本文摘自PHP中文网，作者青灯夜游，侵删。
在 Chrome 的 DevTools 中的控制台提供了一些 Debug 专用的函数，每一个都身怀绝技。
Console Utility Functions
这些函数只能用在 Chrome 的 console 中。当我在第一次看到这些函数时非常兴奋，把它们直接写到了自己的代码中，结果当然是跳出了各种 Uncaught ReferenceError：xxx is not defined 错误。
$_
$_ 会存储的执行结果，在控制台测试 JavaScript 的时候通常都需要逐步确认，这正是 $_ 的用武之地：
在遇到不能链式调用的函数时可以用 $_ 来避免游标被修改：
顺带提一句，将来也有可能会出现 Pipeline operator 来做到任意的函数链接，一次来促进提升性或避免修改内建原型。
1 2 3 4 5 6 |
|
$, $$
$(selector[, element]), $$(selector[, element])
$ 和 $$ 分别就是 document.querySelector 和 document.querySelectorAll 的缩写，其来源于大家都熟知的 JQuery。
第二个参数可以传入起始的元素，搭配 $0 就可以先检验一个元素，然后再从它开始搜寻。
1 |
|
我经常用 $$ 来快速测试一些东西，例如输出某个人 GitHub 页面的所有存储库名称：
不过如果已经把 JQuery 引入为
$的话，还是会正常执行 JQuery 的。
debug
debug(function)
参数为一个函数，只要执行到该函数就会触发调试器，可以用 undebug(fn) 来取消：
1 2 3 4 5 6 |
|
其效果相当于：
1 2 3 4 5 6 7 8 9 10 |
|
monitor
monitor(function)
用法和 debug 类似，monitor 函数被执行时会输出函数名称和参数，可用 unmonitor(function) 来停止，不过不能用于箭头函数，如果要监听箭头函数的执行就只能手动重写了。
monitorEvents
monitorEvents(element[, eventType])
可以监听并输出元素的特定事件，比较特别的是除了能监听单个事件，还能监听事件类型，例如输出 window 的点击事件和所有 touch 类别的事件：
效果和以下 JavaScript 相同：
1 2 3 4 5 |
|
可以用 unmonitorEvents(element [, eventType])来停止监听。
getEventListeners
getEventListeners(element)
输出已注册在元素上的监听器，就拿刚才的例子来说，输入 monitorEvents(element) 后再输入 getEventListeners(element) 就会看到所有事件都被注册了一波：
相关阅读 >>
更多相关阅读请进入《Chrome》频道 >>
Vue.js 设计与实现 基于Vue.js 3 深入解析Vue.js 设计细节
本书对 Vue.js 3 技术细节的分析非常可靠，对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪，Vue.js作者
