There's more to console than .log

A tweet I saw reminded me that the Javascript Console object has more to it than just "log"

Protip: there are many siblings to console.log(), like .group(), .error(), .assert() formatting and much more: https://t.co/VW9laGPZFE pic.twitter.com/Z8MQJgA0bc

— Nick Craver (@Nick_Craver) August 29, 2017

Documentation links:

• MDN web docs: Console
• developers.google.com > Diagnose and Log to Console

The two methods that I wanted to remind myself exist (and thus try and get stuck in my head so that I actually use them) are:

• console.group
• console.groupEnd

By using this pair of methods, you get a grouped/nested view of the log requests that you make, which is kind of similar to the way that MiniProfiler shows some of its results. This makes it easier to work with the information being output into the console as you can expand/collapse the output to only see the parts that you need to see at any one time. By using the console.groupCollapsed method you can even start off with the grouped section collapsed (the clue's in the name!) to make it all the more readable, for example:

This output was achieved with the following (utterly contrived) example JavaScript:

console.log('Un-grouped item');
console.groupCollapsed('Collapsed Group');
console.log('First item in collapsed group');
console.log('Second item in collapsed group');
console.error('Even errors go into the collapsed group');
console.groupEnd();
console.group('Expanded Group');
console.log('First item in expanded group');
console.log('Second item in expanded group');
console.error('Even errors go into the expanded group');
console.groupEnd();
console.log('Un-grouped item (after the groups)');