Some options could be applied to the log() method that some might not be aware of.

Log Them All

All data types of JavaScript could be logged using the console.log().

console.log('Hello, World!'); //String
console.log(1234); //Number
console.log(2 > 1); //Boolean
console.log([1, 2, 3]); //Array
console.log({foo: 'bar'}); //Object

logging different data types

The null and undefined data types could be logged as well. However, undefined will through Uncaught ReferenceError error.

The console.log() could also take a list of arguments separated by commas. They will be rendered separated with a space between each argument.

console.log('Hello, World!', 1234, 2 > 1, [1, 2, 3], {foo: 'bar'});

logging values as arguments


Like C language, a substitution could be used to log the arguments like so.

console.log('My name is %s, and I'm %d years old', 'Anas', 26);

logging values in a C substitution style

The %s tells the interpreter to replace the value as a string, according to the arrangement of the arguments. %d does the same for digits. %o is used for Objects

Extra Substitution

If we go to Facebook and open the console in the DevTools, we will notice this giant "Stop!" in red. I always wondered how did they change the style in console?

Facebook console warning

It is another substitution, the %c, which allows us to write CSS as an argument. Here is an example.

console.log('%cStop!', 'color: red; font-size: 45px');

CSS Substitution