Console.log: Tips and Tricks
Type the next comments in browser's console to see how they work. The hot keys "CTRL+Shift+I" to open a console.
And type one after another highlighted strings. There are various methods to display a text in browser console.
- Interpolated:
(just copy and type a string below and press a button 'Enter'):
console.log('Hello, I am a %s drinker!', '☕');
- Styled:
console.log('%c I am some great text', 'font-size: 20px; color: #fcc3426; text-shadow: 3px 2px 5px #56cc34');
- Warning:
console.warn('Oh No!!');
- Error:
console.error('Unexpected error');
- Info:
console.info('Important news');
- Testing:
(an output - the blank, because a condition 1 === 1 is true):
console.assert(1 === 1, 'That is wrong');
(an output - the warning with a text, because 1 === 2 is wrong):
console.assert(1 === 2, 'That is wrong');
- Clearing:
(will clear a console):
console.clear();
- Timing:
console.time('fetching data'); fetch('https://api.github.com/users/wesbos').then(data => data.json()).then(data => {console.timeEnd('fetching data'); console.log(data);})