Translator's note: We tend to be limited to the circle of knowledge we are familiar with, but we should also take the opportunity to expand it occasionally and use some unusual and useful techniques to expand our comfort zone.
- Original: 10 Tips for Javascript Debugging Like a PRO with Console
- Translator: Fundebug
To ensure readability, this article uses free translation instead of literal translation. In addition, the copyright of this article belongs to the original author, and the translation is only for learning.
In the past ten years, one of my most passionate things is front-end development (especially JavaScript). As a "craftsman", I like to specialize in various tools. In this article, I will introduce you some techniques for debugging with the old-fashioned console.
Yes, we all know the following basic techniques:
console.log( Hello World! );
console.info( Something happened );
console.warn( Something strange happened );
console.error( Something horrible happened );
From now on, I will teach you some skills you don't know, so that you can become an old driver!
1. console.trace()
If you want to know where the message was printed, use console.trace()stacktrace to get the data to be printed.
2. console.time() && console.timeEnd()
If you want to analyze the performance of the function, you can use console.time()to time console.timeEnd()to end the time, the console will print out the time difference between the two times.
3. console.memory
If you find that performance problems are difficult to analyze, you may also want to consider whether there is a memory leak. You can use console.memory(note that memory is an attribute of the console, not a function) to view the current heap usage.
Fundebug helps you debug better, welcome to try!
4. console.profile('profileName') & console.profileEnd('profileName')
Although not a standard practice, it is widely accepted for use. You can use these two commands to start and stop profiling. This will help you do accurate profiling in your code. Instead of relying on manual mouse clicks. You can Javacript Profilerfind the profile just now in the browser console .
5. console.count("STUFF I COUNT")
Sometimes in order to record how many times a function or a piece of code is executed repeatedly, it can be used console.count('?')to record. Each time the code is executed, it will automatically increase by 1.
6. console.assert(false, Log me! )
You can use it console.assertto output messages under certain false conditions, instead of using if-else. Note: An error (Assertion Error) will be reported under Node.js.
7. console.group('group') & console.groupEnd('group')
If you want to format the printed log, you can use console.group()and console.groupEnd(). Use console.group to aggregate logs into groups and form a nested level. Look at the example:
8. String substitutions
You can use console.logprinting variables (%s = string, %i = integer, %o = object, %f = float).
9. console.clear()
We have already output a lot of records in the console, console.clear()let's use it to clear them.
10. console.table()
The last one! You can use console.table()to print out the objects in the form of tables.
Copyright statement:
Please indicate the author Fundebug and the address of this article when reprinting:
https://blog.fundebug.com/2018/03/19/10-tips-for-debugging-with-console/