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"

Documentation links:

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.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:

Example output, from Chrome, that matches the JavaScript code below

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();'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.log('Un-grouped item (after the groups)');

About Rob

I've been interested in computing since the day my Dad purchased his first business PC (an Amstrad PC 1640 for anyone interested) which introduced me to MS-DOS batch programming and BASIC.

My skillset has matured somewhat since then, which you'll probably see from the posts here. You can read a bit more about me on the about page of the site, or check out some of the other posts on my areas of interest.

No Comments

Add a Comment