DEV Community

Cover image for Javascript: 5 cool things you can do with console that aren't console.log

Javascript: 5 cool things you can do with console that aren't console.log

Cat McGee on June 29, 2020

Ah... Javascript. I'd like to say that Javascript and I have a love/hate relationship, but realistically I love it and it just doesn't love me. So...
Collapse
 
perpetual_education profile image
perpetual . education

We basically write console.clear(); at the top of every CodePen. We get a lot of use out of that one! When 'objects' and 'methods' finally clicked back when, realizing there were so many console.log messages was like finding a magic lamp!!! : ) .info() used to have a nice blue style - but might have gone away....

Collapse
 
catmcgeecode profile image
Cat McGee

console.clear() is a great one, should've included that guy! I've never actually used console.info() and heard it was literally the same as console.log(), but if it's nice and blue I've gotta check it out. Thanks!

Collapse
 
perpetual_education profile image
perpetual . education

There's the color options too!

console.log('%c thing one! ', 'color: red');
console.log('%c thing green! ' + '%c thing blue! ', 'color: green', 'color: blue');

We use these for little hidden messages for sneaky developers... ; )

Collapse
 
neomonst profile image
NeoMonst

When I was debugging others' code, I really hope there is some kind of console.exit(), so no more following output to mess up with me.

Collapse
 
catmcgeecode profile image
Cat McGee

Do you mean something like console.clear()?

Collapse
 
neomonst profile image
NeoMonst

console.clear();
console.log(myStaff);
console.noMore();

Something like noMore(), because you can imagine, several console.log() could happen after my part.

Thread Thread
 
catmcgeecode profile image
Cat McGee

Ah I get you! console.group() could help you here - you could group all the ones that you like and ignore the others

Thread Thread
 
neomonst profile image
NeoMonst

Wow, I tried console.group(). Yummy!
I guess I will put a console.group() after my code from now on.
Thanks for the tip!

Collapse
 
fblind profile image
Facundo Soria

Great article !, console rules!!
I like console.time and console.timeEnd, it gives you a very simple and powerful interface to do some kind of benchmark.
Also, in general, I use console rather than some debugging tool because of the javascript non blocking nature

Collapse
 
almostconverge profile image
Peter Ellis

Y U NO console.trace()? :)

It's something I use a lot when trying to figure out an unfamiliar codebase and where stuff is called from without having to faff with breakpoints.

Collapse
 
catmcgeecode profile image
Cat McGee

Hahaha sorry Peter! I’ve never used console.trace() myself so I didn’t want to recommend it, but that sounds awesome. I’ll look into it!

Collapse
 
almostconverge profile image
Peter Ellis

Don't say sorry, you promised 5 cool things and you delivered 5 cool things, mission accomplished.

Collapse
 
muchwowdodge profile image
Anton Rhein

Great, Thank You 🙏🏻

Collapse
 
martixy profile image
Martin Ninov • Edited

#6 (on chromium anyway)
Open console settings and choose "Selected contexts only".

Collapse
 
wisamna profile image
wisam ali

Excellent post especially about how to use console.table() I 'm never know about it before.. many thanks to you

Collapse
 
amilkardev profile image
Malek

Interesting ! Thanks for the effort