First of all, I want to tell you, yes there are good and bad ways to console.log in JavaScript that can make your life easier as a JavaScript developer. So let’s get started on how to debug javascript?
Let’s imagine we have 3 objects to log like below.
const foo = { name: 'tom', age: 30, nervous: false };
const bar = { name: 'dick', age: 40, nervous: false };
const baz = { name: 'harry', age: 50, nervous: true };
Bad Code 💩
console.log(foo);
console.log(bar);
console.log(baz);
In the above approach, the problem is we don’t have the variables name to see which one is which? You have to concatenate a string to see which is which.
Good Code ✅
But there is a trick called Computed Property Names/property shorthands
console.log({ foo, bar, baz });
It reduces the code but also shows exactly which variable defines the data.
one line of code.
one console log.
and all the specified information.
Top comments (4)
Thank you! Nice tip.
I assume you meant property shorthands
And if you really want to rock the party, do it in a table ;)
Here the fiddle
You can say that too;
the table example I covered here in all examples with results and more
and thank you for your comment really appreciated!!! :)
Thanks for the tip!
You are welcome :)