JavaScript Debugging Techniques Console.log () detailed

Source: Internet
Author: User

  for debugging JavaScript programs, using Console.log () is a better approach than alert () because the alert () function blocks the execution of JavaScript programs, causing side effects , and Console.log () prints the relevant information only in the console, so it does not cause similar concerns

One, what is Console.log ()? In addition to some very old versions of browsers, most browsers now have their own debugging capabilities, and can be supplemented by installing plug-ins even without debugging. For example, the old version of Firefox does not have its own debugging tools, in which case you can install the Firebug plug-in to add debugging capabilities. On a browser that has debugging capabilities, a member variable named console is registered in the Window object, referring to the console in the Debug tool. By calling the log () function of the console object, you can print the information in the console. For example, the following code will print "Sample Log" in the console:     code as follows: Window.console.log ("Sample Log"); The above code can omit the window object and directly abbreviate:   Code as follows: Console.log ("Sample log"); Console.log () can accept any string, numeric, and JavaScript objects. Like the alert () function, Console.log () can also accept newline characters N and tab T. The debug information printed by the Console.log () statement can be seen in the browser's debug console. Console.log () behavior in different browsers may be different, this article mainly discusses the use of Console.log () in Firebug. Second, compatible browsers without the debug console the Console object in window does not exist for an older browser that lacks the debug console, so using the Console.log () statement directly may cause an error inside the browser (null pointer error). And eventually led to some old version of the browser crash. To solve this problem, you can define the console object and declare that the log function of the console object is an empty function, so that when the Console.log () statement executes, these older browsers will not do anything: The code is as follows: if (! Window.console) {  Window.console = {log:function () {}}; However, in most cases, there is no need to do this kind of compatibility work-console.log () The debug code should be removed from the final product code. The use of parameters is similar to the alert () function, and Console.log () can also accept the variable and splice it with another string: The code is as follows://use variable var name = "Bob"; Console.log ("The name is: "+ name); Unlike the alert () function, Console.log () can also accept a variable as a parameter passed to the string, whose specific syntax is the same as the printf syntax in C: The   code is as follows://use parameter var people = "Alex" ; var years = 42; Console.log ("%s is%d years old.", people, years); The results of the above code are: "Alex is years old." Four, using other logging levels in addition to Console.log (), Firebug also supports a number of different logging levels: Debug, info, warn, error. The following code prints these different log levels of information in the console: The code is as follows://use different logging level Console.log ("Log Level"); Console.debug ("debug level"); Console.info ("info level"); Console.warn ("Warn level"); Console.error ("error level"); You can see from the Firebug console that printing information at different log levels is not the same color as the icon, and you can select different logging levels in the console to filter the information:   

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.