The JS console cheatsheet

1. console.log(): Logging out any info be it object, string, number, undefined, any JS data type

console.log(”hello”) // hello
console.log({"tom" : "jerry"}) // {tom: "jerry"}
console.log(undefined) // undefined

2. console.assert(): Throws an error message only when condition is false

console.assert(false, "false") // Assertion failed: false
console.assert(true, "does nothing")
console.assert(3 % 3 === 1, "Remainder not 0") // Assertion failed: Remainder not 0

3. console.clear(): Clears the terminal

4. console.count(): Counts the number of times console.count() has been called. Restarts the count for different scopes

console.count() // default: 1
console.count(); console.count(); // default: 2
console.count('hello'); console.count('hello'); /* hello: 1 hello: 2 */

5. console.countReset(): Resets the counter for console.count() for the default value or a particular label

6. console.error(): Outputs an error message to the console. Just like the console.log it can take any js data type and output it as an error

7. console.table(): Takes an array input and outputs a table with the keys being the indices and the array values being the values

console.table(['new', 'hello']) 
/*
  (index) Value 
    0     'new' 
    1     'hello'
*/

8. console.time, console.timeLog, console.timeEnd: A timer can be started like console.time(’newTimer’) where newTimer is the label for the newly started timer, then console.timeLog(’newTimer’) will log the time elapsed since it was created and console.timeEnd(’newTimer’) will log the final time and clear the timer

console.time('new')
console.timeLog('new') // new: 44559.760986328125 ms
console.timeEnd('new') // new: 67500.62890625 ms

9. console.trace(): Logs how the stack is being used

function fn1() {   
  function fn2() {    
    console.trace();   
  }   
  fn2();  
}   
fn1();    

output:   
fn2  
fn1

10. console.warn(): Logs a warning message to the console and can be supplied with any value like console.log()

Extra tip:

You can apply css to your logs using the %c tag

console.log(
  "This is %cMy stylish message",
  "color: yellow; font-style: italic; background-color: blue;padding: 2px",
);

For more info: https://developer.mozilla.org/en-US/docs/Web/API/console#examples*

More info on: https://developer.mozilla.org/en-US/docs/Web/API/console#instance_methods