JavaScript console is more than console.log()
One of JavaScript’s most straightforward approach to troubleshoot anything is to log stuff utilizing console.log. But the console provides many other methods that can help you debug better.
Let’s start with it. Logging a string or a lot of JavaScript objects is the very basic use case.
Just like this,
console.log('Where am I?');Assume we have scenario when we have a lots of objects and need to log them into console.
const foo = { id: 1, height: '200px', width: '100px' };
const bar = { id: 2, height: '250px', width: '200px' };Only console.log(variable) one after the other is the most intuitive way to log this. When we see how it appears on the console, the problem becomes more apparent.
As you can see, variable names are not visible. Sometimes, it gets hard or annoying when you have lots of outputs and have to expand one by one each of them to understand which object or variable is it.
One solution to avoid this is to use console.log as this:
console.log({ foo, bar });This also reduces the number of console.log lines in our code.
