Hidden console features for Javascript debugging


3 Min Read

Hidden console features for Javascript debugging

Another way to debugging your JavaScript code by the good old console

Today it became to mainstream tell people that they should be using the browserís debugger. Many developers don't realise that the "console" itself has a lot of another features, not only popular the basic "console.log()".

Option 1 - console.log()

Seem some strange, but a stock console.log() has amount of different functionality. By the "console.log()", you can simultaneously output both variables, strings messages and additional objects. Here an example of additonal output format:

console.log('message = ' + varibale + ' + %s string', 'Another');

This is the output string in console:

message = 234 + Another string

As you guessed, %s was replaced by the 'Another' at outputting result.

Another interesting console.log() option - %c. This tool is highlight some text, right inside into your output string. So itís definitely sort of a placeholder for css values.

console.log('%cHighlight me Please', 'color: white; background-color: #5364fc; padding: 4px 10px; border-radius: 4px');

Will output precisely as youíd assume - Highlight me Please

Option 2 - console.table()

Itís shocking that this isnít higher best-known option, however the console.table() perform is meant to show tabular info, by the array variables, in a very approach, thatís abundant neater than simply dumping out the raw array of different objects.

var google_map = [{ featureType: 'road', elementType: 'geometry', color: '#38414e' }];

What we'll get ought to be basically a table of:

Unfortunately console.table() solely has the power to handle a most of a thousand rows, therefore it'd not be appropriate to any datasets.

Option 3 - console.warn()

Probably the foremost obvious direct replacement for log(), you'll be able to simply use console.warn() in precisely the identical means. Only onre distinction is that the output could be a bit yellow. This has the impact of creating it a small amount additional obvious in a very untidy output.

Thereís an even bigger advantage, though. As a result of the output string could be a warning instead of an data, you'll be able to filtrate all the console.log and leave solely console.warn(). Clearing the noise will allow you to see your output values far more simply.

Hidden console features for Javascript debugging. Another way to debugging your JavaScript code by the good old console


More than 40 Happy Customers

Over the last 5 years, we have helped and guided organisations to to achieve outstanding results