1) console.trace()
1.1) Use console.trace() to figure out the entire stack trace from where a function call was made
2) console.group(label)
2.1) Use console.group(label) and console.groupEnd() to group the log statements together.
Be sure to specify the label i.e. the group name, so that it is easily readible amongst the verbose browser output.
3) Conditional Breakpoints
3.1) USE CONDITIONAL breakpoints! Makes life so much simpler.
4) Console.dir instead of console.log
May 31, 2019 - The output is presented as a hierarchical listing with disclosure triangles that let you see the contents of child objects. In other words, console.dir() is the way to see all the properties of a specified JavaScript object in console by which the developer can easily get the properties of the object.
5) Use console.table() to output an object in tabular format to the console.
Also, here are other super useful articles :
https://medium.com/appsflyer/10-tips-for-javascript-debugging-like-a-pro-with-console-7140027eb5f6
https://medium.com/datadriveninvestor/stopping-using-console-log-and-start-using-your-browsers-debugger-62bc893d93ff
https://medium.com/@mattburgess/beyond-console-log-2400fdf4a9d8
https://medium.com/better-programming/boost-your-javascript-debugging-skills-with-these-console-tricks-ab984c70298a
https://medium.com/better-programming/how-to-find-bugs-in-your-code-with-the-debugger-a7f739ea98
6) Turn on the view timestamp setting in the browser console.
7) Use console.error() and console.warn() instead of console.log() so the logged content is easily identifiable because it will be displayed in red and yellow colour respectively.
