Reproduced from: JavaScript, console console many different types of output_js console output console_Old Dream Star Rail Blog-CSDN Blog
Added a screenshot of the result running in Notepad++
console.log(); is very familiar to front-end developers, he can output a lot of information we want, but the output in the console is not only console.log();, I will share with you below The most important thing is, the different types of output information of the console, and give examples of several commonly used output types.
| output category |
describe |
| console.log(); |
Output prints multiple types of data |
| console.assert(); |
Assert output, throw an error message |
| console.clear(); |
The content displayed in the console will be replaced by some information |
| Console.count() |
Outputs the number of times count() was called |
| console.countReset(); |
Reset the counter (reset the number of times count() was called) |
| console.dir(); |
Display the properties of the specified JavaScript object in the console, and display them in an interactive list similar to the file tree style. |
| console.dirxml(); |
Displays an interactive tree of an explicit XML/HTML element including all descendant elements. If it cannot be displayed as an element, a JavaScript object will be used instead. Its output is an inherited list of expanded nodes, allowing you to see the contents of child nodes. |
| console.error(); |
output error message |
| console.group(); |
Create a new group. Subsequent content output to the console will be indented, indicating that the content belongs to the current group, until the console.groupEnd() is called, and the current group ends. |
| console.groupCollapsed(); |
Create a new group. Subsequent content output to the console will be added with an indentation, indicating that the content belongs to the current group and the difference between the console.group() method is that the newly created group is collapsed by default. The user must click a button to open the collapsed content |
| console.groupEnd(); |
Exit one-space indentation (end grouping) in the web console. |
| console.info() |
Output a notification message to the web console. In Firefox only, a small 'I' icon is displayed next to items in the log in the web console |
| console.profile(); |
Start recording performance description information |
| console.profileEnd() |
End recording performance description information |
| console.table() |
Print data by table |
| console.time() |
start a timer |
| console.timeLog(); |
output time |
| console.timeEnd() |
End timer, output elapsed time |
| console.trace() |
Output a stack trace. |
| console.warn() |
output warning message |
| console.timeStamp() |
(Added in v8.0.0) method is a built-in API of the "console" module and will not display anything unless used in the inspector. This method adds an event with the label "label" to the inspector's timeline panel. |
| console.debug() |
Same as console.log(); |
console.log();
Mainly output information to the console, any type of data can be placed in log();
console.log("string");
console.log(true, false);
console.log({ a: 1, b: 2 });
console.log(12345);
console.log(null);
console.log(undefined);
console.log([1, 2, { a: 3, b: 4 }]);Browser results
Notepad++ running results
console.error();
This method outputs the error message to the console, which is displayed in red by default.
console.error("An error occurred here");Browser results
Notepad++ running results
console.warn();
This method outputs a prompt warning message, which is displayed in yellow.
console.warn("An error warning is generated here");Browser results
Notepad++ running results
console.clear();
Call directly without parameters to clear the console. When clearing the console, if it is based on the Chrome browser, it will output the text "console data has been cleared" as shown in the figure, but in Firefox, nothing will be returned.
console.time(“timerName”);
console.timeLog(“timerName”);
console.timeEnd(“timerName”);
Whenever, if we need to know how long a program or a function takes to execute, we can call console.time("name") to start the timer. We need to declare a parameter, the timer name, and then call
console.timeLog("name"), read the time it takes to execute to this point, the parameter name when reading must be the same as the parameter name that starts the timer. Call console.timeEnd(“timerName”); to end the timer and output the time at the same time.
console.time("timerName");
console.timeLog("timerName");
console.timeEnd("timerName");Browser results
Notepad++ running results
console.table()
This method allows to output a table in the console, the input data must be an array or an object displayed as a table.
console.table({ a: 1, b: 2, c: 3 });Browser results
Notepad++ running results
Console.count()
When this method is called, the number of times the same data is output will be returned to the console
console.count("label");
console.count("label");
console.count("label");
console.count("label");
console.count("label");
console.count("label");
console.count("label");
console.count("label");
console.count("label");
console.count("label");Browser results
Notepad++ running results
