DEV Community

Dom the dev
Dom the dev

Posted on • Edited on

JavaScript Console more than just a log

If you have any questions hit me up von Twitter

If you are a visualer learner you might prefer my YouTube Short i made about this Topic.

console.log("Hello World")

If you are reading this i asume that you are a developer and that you probably already heared about the JavaScript console.log().
The console.log function is an easy way for frontend developers working with JS to check their code. You can log almost everything from your code.

But did you know that there are way more functions which may fit better for your purpose? Let me show you some of them!

console.error(error)

You probably already run over the console.error method, and you probably didn't even notice.

Example output

Error: Not variable found. 
at script.js:1
Enter fullscreen mode Exit fullscreen mode

This methods prints an error to the console. Telling you the file and the line in your code where the error occurs.

console.table(data)

This methods allows you to log data in tables. This works for arrays and object.

The first column will be either the index for arrays, or the property name for objects.
The second colum is going to contain the value of the element.

const fruits = ["apples", "bananas", "oranges"];
console.table(fruits)
Enter fullscreen mode Exit fullscreen mode

Example output:

(index) values
0 apples
1 bananas
2 oranges

console.time() and console.timeEnd()

This two methods in combination can print the duration of the operation between them two.

The method console.time() starts the timer while the console.timeEnd() function stops the timer and prints the duration to the console.

console.time()

alert("Hello World")

console.timeEnd("duration:")
Enter fullscreen mode Exit fullscreen mode

Example output

duration: 131.60205078125 ms
Enter fullscreen mode Exit fullscreen mode

That's it from me. There are some more console methods to explore.

Thanks for reading! <3

Top comments (0)