Stop Using console.log() In JavaScript

Are you a JavaScript developer who uses console.log() often to debug your code? There is nothing wrong in it. But if you are unaware, there are so many other methods of console object which are quite amazing. In this article, I would like to explain the effective usage of these methods.

Why Is console Object Used?
The console object in JavaScript provides access to the browser debugging console, where you can print values of the variables which you’ve used in your code. Oftentimes, this can be used to debug if the right value is being passed in your code.
I’m pretty sure most of us developers have used console.log() to print values in our browser console. log is just one method of the console object. There are several other methods that are very useful.

1. console.log()
This method is mainly used to print the value passed to it to the console. Any type can be used inside the log(), be it a string, array, object, boolean etc.
Example
console.log(‘JavaScript’);
console.log(7);
console.log(true);
console.log(null);
console.log(undefined);
console.log([1, 2, 3]);
console.log({a: 1, b: 2, c: 3});

2. console.error()
This method is useful while testing code. It is used to log errors to the browser console. By default, the error message will be highlighted with red color.
Example
console.error(‘Error found’);

3. console.warn()
This method is also used to test code. Usually, it helps in throwing warnings to the console. By default, the warning message will be highlighted with yellow color.
Example
console.warn(‘Warning!’);

https://delightfulsweetsmusic.tumblr.com/
https://weepinglovewizard.tumblr.com/
https://wonderwoman3036.tumblr.com/
https://wonder-women-pelun-1000sales.tumblr.com/
https://zenodo.org/communities/kimetsuduhuwademonduhu/?page=1&size=20

. console.clear()
This method is used to clear the console. It is often used if the console is clogged with messages/errors. The console will be cleared and a message Console was cleared will be printed in the console.
Example
console.clear()
Image for post
Output
5. console.time() and console.timeEnd()
Both these methods are used in conjunction with each other. Whenever we want to know the amount of time spent by a block or a function, we can make use of the time() and timeEnd() methods. Both these functions take a string as a parameter. Make sure you use the same string for both these functions to measure the time.
Example
console.time(‘timer’);
const hello = function(){
console.log(‘Hello Console!’);
}
const bye = function(){
console.log(‘Bye Console!’);
}
hello(); // calling hello();
bye(); // calling bye();
console.timeEnd(‘timer’);
Image for post
Output
6. console.table()
This method generates a table inside a console, for better readability. A table will be automatically generated for an array or an object.
Example
console.table({a: 1, b: 2, c: 3});
Image for post
Output
7. console.count()
This method is used to count the number that the function hit by this counting method. This can be used inside a loop to check how many times a particular value has been executed.
Example
for(let i=0; i❤; i++){
console.count(i);
}
Image for post
Output
8. console.group() and console.groupEnd()
These methods group() and groupEnd() allows us to group contents in a separate block, which will be indented. Just like the time() and the timeEnd() they also accept a label, of the same value. You can expand and collapse the group.