学习笔记 devtool 3. consoleWrites the number of times that count

3.1 Reference

Open the Console panel
- ctrl + shift + j
- Command Menu -> typing console -> Panel Show Console
Open the Console Tab in the Drawer
- Esc
- Command Menu -> typing console -> Drawer Show Console
Open Console Settings
- Click button
Open Console Sidebar
- Click Button

Group similar
Log XMLRequests
- log all XMLRequest and Fetch requests
Preserve log
- Persist message across page loads
Hide network
- Hide network messages
Selected context only
- Only show messages from the current context(top, iframe, worker, extension)
Eager evaluation
- eagerly evaluate text in the prompt
Autocomplete from the history

Filter out browser messages
- sidebar -> user messages
Filter by log level
- Custom levels
- sidebar
Filter by URL
- filter text box -> url:xxx/-url:xxx
Filter out messages from diffirent contexts
Filter out messages that don't match a regular expression pattern
- filter text box -> /xxx/

Re-run expressions from history
- up/down arrow key
Watching an expression's value in real-time with Live Expressions
- click create live expression
- typing variable in live expression text box
- enter

console.assert(expression, object)
- writes an error when expression evaluates to false
console.clear()
- Clears the console
- If preserve log is enable, console.clear() is disabled
console.count([label])/console.countRest([label])
- Writes the number of times that count() has been invoked at the same line and with the same label.
console.dir(obj)/console.dirxml(node)
- 没太明白这两个有啥用
console.error/console.warning/console.log
console.group(label)/console.group(label)/console.groupCollapsed(label)
- Visually groups messages together until groupEnd is called.
console.table
- logs an array of objects as a table
console.time(label)/console.timeEnd(label)
- Start a new timer, call console.stop(label) to stop the timer and print the elapse timee.
console.trace()
- prints a stack trace

These functions only work when you call them from the Chrome DevTools Console

returns the value of the most recently evaluted expresstion.

work as a historical reference to the last five DOM elements inspected within the Element panel
work as a historical reference to the last five JavaScript heap Objects selected in the profiles panel.

$('#div')

?('div')

copy($0)

When the specified function is called, the debugger is invoked and the breaks inside the function on the Source panel allowing step through the code and debug it.

var a = function () {
  var b = 1;
var c = 2;
return b + c;
}

debug(a)

opens and selects the specified element in the element panel for DOM elements
opens and selects the specified object in the Sources panel for JavaScrip heap Objects

inspect($_)
insecpt(a)

getEventListers($0)

returns an array containing names/values of the properties belonging to the specified object.

when the function specified is called, a message is logged to the console that indicates the function name along with the arguments that are passed to the function when it was called

var a = function () {
  var b = 1;
var c = 2;
return b + c;
}

monitor(a)

When one of the specified events occurs on the specified object, the events object is logged to the console
- a single event ['resize' ]
- an array of events ['resize', 'scroll']
- one of the generic events types ['mouse', 'key', 'touch', 'control']

Log object data with table formatting by passing a data object in with optional column headings.
第二个参数没效果呢怎么