console.log() is OLD! Use These 5 Console Hacks! 😎

Arjun Vijay Prakash - Mar 21 - - Dev Community

Are you still using console.log for all your JavaScript needs in 2024?

It's time to upgrade.

If you console.log() the console object, the following would be the output -

Image

Your first time seeing this many functions inside the console object, right?

One of the biggest problems with using just console.log is that it's not very informative on its own.

It just outputs the value of whatever you pass to it without any context or additional information.

In this post, let us explore some of them, which can actually replace the need to use console.log().

[not really, this classic function is just way, way better than others]


1️⃣ console.error();

Outputs an error message to the console.

console.error("ERROR");
Enter fullscreen mode Exit fullscreen mode

Image


2️⃣ console.warn();

Outputs a warning message to the console.

console.warn("WARNING");
Enter fullscreen mode Exit fullscreen mode

Image


3️⃣console.table();

Outputs a warning message to the console.

console.table([{ name: 'John', age: 30 }, { name: 'Jane', age: 25 }]);
Enter fullscreen mode Exit fullscreen mode

Image


4️⃣ console.assert();

Logs a message to the console only if an expression evaluates to false.

console.assert(2 + 2 === 5, "Error: Math is broken!");

console.assert(2 + 2 === 4, "Error: Math is broken!");
Enter fullscreen mode Exit fullscreen mode

Image


5️⃣ console.info();

Outputs an informational message to the console.

To be honest, this is a console.log() in disguise.

console.info("Informational message");
Enter fullscreen mode Exit fullscreen mode

Image


BONUS: 6️⃣ console.log( {} );

Try to put an object inside the console.log() parameter. It will make the output more readable.

Image

Just see the difference!


🙌 Final Thoughts

In 2024, don’t just use console.log - there are many more powerful and valuable functions available.

From console.table() to console.assert(), these methods will help you make it easier to troubleshoot and fix problems in your code.

Develop your debugging skills in 2024 by trying these techniques! (Your future self will definitely thank you.)

And also, share your favourite web dev resources to help the beginners here!

Connect with me @ Linktree.

Happy Coding! 🚀
Thanks for 23957! 🤗

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .