Web developers log messages on the console to ensure their javascript code is working as expected. Apart from just logging the message like console.log("log message"), there are other useful utilities which a web dev can use to level up their debugging.
Let’s start with logging the console object to see what all functions are there in the console object.
Log the console object
Command
console.log(console)
There are various functions available(assert, clear, context, etc). I will cover my favorite ones.
Assert
You might have done the following in your code
if(!flag) console.error("some error")
There is a handy way to do that.
Command
console.assert(flag, "some error")
Counters
I am sure you might have done the following in your javascript code.
counter ++; console.log(counter)
There is a much handy way to do a similar thing.
Command
console.count("counter")
You can reset the counter using the below command
console.countReset("counter")
Beautify
There are various ways to beautify the output of the console – table, custom css.
Table look
Command
console.table({abc: 1, bcd: 2})
Custom CSS
You can even use custom CSS to style the console output
Command
console.log("%c hello", "background-color:red; color:white; padding:30px; font-size:40px")
Group
You can even visually group the output.
Log the timeduration
Log the trace
Log levels
References
Deven Bhooshan 