As a web developer, you know very well the need to debug your code. We often use external libraries for logs, and to format and/or display them in some cases, but the console of our browsers is much more powerful than we think.
When we think about the console, the first thing that comes to mind and the
console.log, right? But there are many more methods than those we imagine. Now we will see how to make the most of using the console, and I’ll give you some tips to make them these methods more readable
What is the Console?
- View a log of errors and warnings that occur on a web page.
- Debug applications and traverse the DOM directly in the browser.
- Inspect and analyze network activity
Console.log, Console.error, Console.warn and Console.info
These are probably the most used methods of all. You can pass more than one parameter to these methods. Each parameter is evaluated and concatenated in a string delimited by the space, but in case of objects or arrays you can navigate between their properties.
This method allows you to group a series of console.logs (but also error info, and so on) under a group that can be collapsed. The syntax is really very simple: just enter all the
console.log we want to group before a
console.groupCollapsed() if we want it to be closed by default). Then add a
console.groupEnd() at the end to close the group.