1. What is console.log()?
Except for some very old versions of browsers, most browsers nowadays come with debugging functions; even if there is no debugging function, they can be supplemented by installing plug-ins. For example, the old version of Firefox does not come with debugging tools. In this case, you can add debugging functions by installing the Firebug plug-in. On a browser with debugging function, a member variable named console will be registered in the window object, referring to the console in the debugging tool. By calling the log() function of the console object, you can print information in the console. For example, the following code will print "Sample log" in the console:
The code copy is as follows: window.console.log("Sample log");
The above code can ignore the window object and directly abbreviated as:
The code copy is as follows: console.log("Sample log");
console.log() can accept any string, number, and JavaScript object. Similar to the alert() function, console.log() can also accept newlines/n and tab characters/t. The debugging information printed in the console.log() statement can be seen in the debugging console of the browser. The behavior of console.log() may vary in different browsers. This article mainly discusses the use of console.log() in Firebug.
2. Compatible with browsers without debugging console
For old versions of browsers that lack debug console, the console object in window does not exist, so using the console.log() statement directly may cause errors inside the browser (null pointer error) and eventually lead to some old versions Browser crash. To solve this problem, you can manually define the console object and declare that the log function of the console object is an empty function; this way, when the console.log() statement is executed, these old versions of browsers will not do anything:
Copy the code as follows: if(!window.console){
window.console = {log : function(){}};
}
However, in most cases, there is no need to do this compatibility work - debugging code such as console.log() should be removed from the final product code.
3. Use parameters
Similar to the alert() function, console.log() can also accept variables and splice them with other strings:
Copy the code as follows: //Use variable
var name = "Bob";
console.log("The name is: " + name);
Unlike the alert() function, console.log() can also accept variables as parameters to pass into strings, and its specific syntax is consistent with the printf syntax in C language:
Copy the code as follows://Use parameter
var people = "Alex";
var years = 42;
console.log("%s is %d years old.", people, years);
The execution result of the above code is: "Alex is 42 years old."
4. Use other log levels
In addition to console.log(), Firebug also supports a variety of different log levels: debug, info, warning, error. The following code will print these different log levels in the console:
Copy the code 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");
From the Firebug console, you can see that the colors and icons of printing information at different log levels are different; at the same time, you can select different log levels in the console to filter this information: