手动触发点击事件和JavaScript函数式触发点击事件的区别

在寻找这个问题的答案之前，首先得掌握JavaScript的事件循环机制(Event Loop)相关知识。

JavaScript是一门单线程的编程语言，因为其作为浏览器脚本语言，主要用途是与用户互动，以及操作DOM。这决定了它只能是单线程，否则会带来很复杂的同步问题。比如：假定JavaScript同时有两个线程，一个线程在某个DOM节点上添加内容，另一个线程删除了这个节点，这时浏览器应该以哪个线程为准？所以，为了避免复杂性，从一诞生，JavaScript就是单线程。因此JavaScript中的所有任务都需要排队依次完成，但这样的设计存在一个问题：如果碰到一个需要耗费很多时间才完成的事件，就可能会造成线程的阻塞。

JavaScript的开发者为解决这个问题将所有的任务分为两种：
① 同步任务：没有被引擎挂起，在主线程中排队执行的任务，它们需要按顺序执行，只有上一个任务执行完成后，下一个任务才会开始执行。
② 异步任务：被引擎挂起，不进入主线程，而进入"任务队列"（task queue）的任务，只有引擎认为某个异步任务可以执行了（主线程的同步任务全部执行完毕），该任务（采用回调函数的形式）才会进入主线程执行。排在异步任务后面的代码，不用等待异步任务结束会马上运行，也就是说，异步任务不具有“堵塞”效应。

异步任务又分为宏任务（macro-task）与微任务（micro-task）。
常见的宏任务：script（整块代码）、setTimeout、setInterval、用户交互（事件）、DOM操作、网络任务（ajax）、setImmediate（node环境）…
常见的微任务：new promise().then(回调)、MutationObserver（html5新特性，用来监听DOM节点变化的）、process.nextTick（node环境的异步操作）…
注：Promise并不是完全的同步，在Promise中的代码是同步任务，执行resolve或者reject回调的时候，此时是异步操作，会先将then/catch放到异步任务中的微任务队列。若同时存在promise和nextTick，则先执行nextTick。

执行过程：
1、先执行script（宏任务）中所有的同步任务，遇到微任务，就将它添加到微任务的任务队列中&#x