JavaScript console tips and tricks

The usage of JavaScript console to the JavaScript developer are huge. It a part of debugging or retrieving mystery of JavaScript code. Sometimes it is important to know about different usage of JavaScript console. Most of the console operation can be done on user browsers.

Following are some tips of JavaScript console that we can use everyday:

Console for printing multiple values

We can print multiple variables using JavaScript console like below:

console.log(name, email, status);

Console.clear() to clear the console

We can clear the console using clear method or we can use keyboard shortcut to clear the console like below:

console.clear() 
OR 
Ctrl + l

Basic console functions

We can clear the console using clear method or we can use keyboard shortcut to clear the console like below:

console.log('Output a message'); //log a message or an object to console
console.info('Print the info'); //same as console log
console.warn('Warning happened'); //same as console log but outputs a warning
console.error('Something went wrong'); //same as console log but outputs an error

Heap memory size using console.memory

We can very easily check the browser JS heap memory size using JavaScript console like below:

console.memory

// Output
MemoryInfo {totalJSHeapSize: 64000000, usedJSHeapSize: 53500000, jsHeapSizeLimit: 2330000000}

Debug recurring code block using console.count()

Let say we have a code block that we want to know how many times that code block is getting executed. We can try the following console like below:

console.count("Came here")

// Output
Came here: 1 (First call)
Came here: 2 (Second call)

Conditional logging using console.assert

We can do conditional logging using assert. Log things if condition is false like below:

console.assert(false, "Please log me");

// Output
Assertion failed: Please log me

Hierarchical log using console.group and console.groupEnd

For printing hierarchical log we can use console.group() and console.groupEnd()

console.log("First level log");
console.group();
console.log("Second level log");
console.groupEnd();
console.log("Again first level log");

// Output
First level log 
|
------ Second level log

Again first level log

Print object in tabular form using console.table

console.table is useful if we want to print an object in tabular format. It print index, key and value in a nice tabular format on the console.

console.table([{name:'Joe Smith', age:35}, {name: 'Jennifer Smith', age:28}]);
Share