Use the Console to learn and debug JavaScript

What is a Console

The Console is a separate window for displaying JS and DOM object information. and inject 1 console objects into JS, using this object to output information to the console window.

Second what browser support Console

Many people may know that the Console is supported in Chrome and FireFox (FireBug). Other browsers are not supported. For example, IE8 's own development tools support Console, but the function is more monotonous, display objects are displayed [Object,object], and can not click to see the properties inside the object. IE6, IE7 Although can install Developer Toolbar, but also does not support console. The Console is supported by Safari and Opera, but it is not easy to use with Firebug and Chrome. Now Firebug has launched the Firebuglite tool, which allows all browsers to support console functionality, and is almost identical to Firebug. See Http://getfirebug.com/firebuglite

Why don't you just use alert or write your own log

is not the same as using alert to display information, debugging programs? The alert pop-up will break the program, and if you want to display the information in the loop, hand-clicking the Close window is exhausting. And the alert display object is always displayed as [object]. I write the log although you can display some object information, but a lot of features support is not the console good, after reading the introduction of the console will know.

(Some of the ways to compare the chicken are not listed, with the coarse blue mark out is the usual method)

Four Console.log (object[, Object, ...])

Console.log is the simplest way to output information to the console window, supporting multiple parameters, which combine these parameters to display, e.g:

The first parameter of the log method supports similar C-language printf string substitution patterns, and log supports the following alternate modes:

• %s instead of string
• %d instead of integers
• %f instead of floating-point values
• %o Instead of Object

e.g:

Five Console.debug,info,warn,error

These 4 methods are exactly the same as the log method, except that the icons displayed are not the same as the text color.

Six Console.assert (expression[, Object, ...])

The Assert method is similar to assertions in unit tests, and when expression is false, output the following information, e.g: note: The Assert method is not supported in Firebuglite, Chrome and FireBug support

Seven Console.clear ()

This method clears all information in the console (not supported in chrome)

Eight Console.dirxml (node)

Print HTML code for HTML elements, equivalent to log.

Nine Console.trace ()

The trace method can view the call stack information for the current function, that is, how the current function is called, e.g:

Ten Console.group (object[, Object, ...]), groupcollapsed, GroupEnd

These 3 functions are used to group information such as log output, so that it is easy to read and view.

The Groupcollapsed method is the same as the group method, except that the displayed groupings are collapsed by default.

11 Console.time (name)/console.timeend (name)

We often need to test the execution time of the JS function, we may write our own code in the 1th statement and the last 1 statements take the current time subtraction. This set of functions actually implements this function, and time (name) creates 1 new timers based on name. Timeend (name) stops the timer for the given name and displays the time.

12 Console.profile (name)/console.profileend ()

This set of methods is used to open the browser parser to analyze the JS execution between the set of functions, note: Firebuglite does not support the profile function, Chrome supports profiles, but the content of the analysis is unknown.

13 Console.count ([title])

The Count method is used to count how many times the current code has been executed, and the title parameter can output an additional caption before the number of times to help read. e.g:

14 Console.table (data)

The table method displays the data object in tabular form, which is useful when displaying arrays or JSON objects of the same format.

Note: Table only supports FireBug, and is only available after the firebug1.6+ version.

Summary: Console is to help us learn and debug JS 1 very good tools, if you have not used before, and now start using it.

You will find that it can save you a lot of development time.

Use the Console to learn and debug JavaScript