Do you know how many methods there are on the console of the browser console?

This article will briefly introduce the consoles that you don't know and the consoles that I don't know

console.log

The most basic printing function, which everyone knows, will not be elaborated here

console.error

To print an error on the console, the syntax is as follows:

console.info

The following introduction is available on MDN:

Output a notification message to the web console. Only in Firefox, a small 'I' icon will appear next to the items in the logs of the web console

The grammar is as follows:

In actual testing, there will also be a small "I" icon in Safari browser, which is no different from console.log in Chrome browser

console.debug

Output debugging information to the console, only displayed when the console is configured to display debugging output (with Verbose checked on the browser's console filter), as shown below:

console.warn

The syntax for printing a warning type message to the console is as follows:

console.dir

Display the properties of a specified JavaScript object in the console and display them through an interactive list similar to a file tree style. The syntax is as follows:

console.dirxml

Output an explicit XML/HTML element interaction tree including all descendant elements on the console. If the input parameter is not an XML/HTML element, it will be replaced in the form of a JavaScript object. Unlike console.dir, it outputs all descendant elements after it. As shown in the picture:

console.table

Print data in table format, with parameters as objects or arrays, and an optional parameter 'columns' to specify the columns to be displayed. See the above figure for the effect

Print array:

Print object:

When an array object has multiple attributes and only wants to display a portion, as shown in the following figure (with the gende rattribute hidden):

console.clear

Clear all information on the current console

console.count & console.countReset

Console.count outputs the number of times it has been called, optionally passing in a label, and counting different labels separately

Console.countReset resets the current count, resets the default counter if no parameters are passed, and resets the counter for the corresponding label if a label is passed in

console.assert

Parameter is a value or expression

Assertion. If the result of the assertion content is true, nothing happens. If it is false, an assertion failure message is output to the console. Without passing any parameters, the assertion fails directly

Console.profile&console.fileEnd (Chrome or Firefox)

Console.profile records performance information, optionally passing in a profile name

Console.fileEnd ends the recording of performance information, and can also optionally pass in a name; If a name is passed in, stop the record that passes in the name; otherwise, stop the most recent record

After recording, you can view it in the menu ->more tools ->JavaScript Profiler in the upper right corner of the console, as shown in the figure:

Start and end records:

View the final record:

console.timeStamp

Add a tag to the Performance (Chrome) or Waterfall (Firefox) tool of the browser. This allows you to associate a point in the code with other events that have been recorded on the timeline, such as layout events and drawing events.

You can choose to use a parameter as the timestamp tag, and then the tag will be displayed next to it.