Discovering the Console in JavaScript

Written by germancutraro | Published 2018/01/28
Tech Story Tags: javascript | console | javascript-console | germancutraro | programming

TLDRvia the TL;DR App

The console object in JavaScript is fundamental piece when we are development ours projects.

โ€ผ๏ธ You can go to my Github to find JavaScript examples. โ€ผ๏ธ

If we type in our Google Chrome Developer Tools, in the console tag, the word: console you can see that is an object that is inside de global window object:

So you can access the console object from the window object.

window.console

But is not necessary ๐Ÿ‘“

Letโ€™s get to know her evenย more:

Print in the console:ย ๐Ÿ”ˆ

_// Printing text_console.log('Hi!');

_// Printing a variable_const PI = Math.PI;console.log(PI);

// Expresionsconsole.log(2 + 4);console.log(`PI value: ${PI}`);

// Comparingconsole.log(null === undefined);console.log(3 > 2);console.log(typeof NaN);console.log(true || false);console.log(true && false);

// Ternary Operatorconsole.log( (3 > 2) ? 'Three!' : 'Two!');

Result: ๐Ÿ“

Print an error:ย โŒ

console.error('Error!');

Result: ๐Ÿ“

Print a warning message:ย โš ๏ธ

console.warn('Be careful')

Examining a object:ย ๐Ÿ”ฆ

console.dir(document);console.dir({a: 5});

Result: ๐Ÿ“

Assertion: โ›ณ

function isEqual(x, y) {console.assert(x === y, { "message": "x is not equal than y","x": x,"y": y });}isEqual(10, 5);

Clear: โฌœ๏ธ

console.clear();

Result: will be the console empty. ๐Ÿ“

Table Output:ย ๐Ÿ“‹

const users = [{name: 'Nick', age: 33},{name: 'Jessica', age: 23}];console.table(users);

Result: ๐Ÿ“

Time: ใ€ฝ๏ธ

const users = [10, 20, 30];console.time('performance');const gThan10 = users.filter(n => n > 10);console.log(gThan10);console.timeEnd('performance');

Result: ๐Ÿ“

Group: ๐Ÿ“ฆ

console.group('numbers');console.log(1);console.log(2);console.log(3);console.groupEnd('numbers');

Thank you ๐Ÿ˜Š!


Published by HackerNoon on 2018/01/28