js事件循环机制理解

首先谈起事件循环 就需要了解 js的单线程设计

                       js单线程就是 只有一个线程存在，同一时间只能做一件事

                       为什么js要设计成单线程 : 因为这跟js做的工作有关 js是作为浏览器的脚本语言 主要实现的功能是用户与浏览器之间的交互 以及操作DOM 这也就决定了它只能是单线程 否则会带来很复杂的问题 例如 js如果是多线程 这时有一个线程要修改DOM元素 而另一个元素要删除这个DOM元素 那是先修改还是先删除呢 这时候就会出现问题 所以js会设计成单线程模式。

               而js单线程有会出现阻塞的问题 因为js单线程同一时间只能做一件事 但是如果这个时候 我有很多个重要的任务需要去做 例如 现在有一个重要的任务浏览器DOM节点渲染需要尽快执行 而前面有一个异步任务 那么就需要等待他执行完毕再执行后续操作 这就造成了单线程产生的阻塞问题 而js用来解决单线程阻塞的方法 就是事件循环

               在js中所有任务都可以分为同步任务和异步任务

               同步任务： 立即执行的任务 同步任务一般会直接进入到主线程中执行

               异步任务： 异步任务可以分为微任务和宏任务   微任务 例如 ： promise  宏任务  例如ajax网络请求 setTimeout定时器函数等

               在浏览器的执行机制中有三个状态 一个是 执行栈用来执行任务  一个是事件队列用来存放事件等待浏览器一个一个执行  最后一个是宿主环境 宿主环境用来处理异步任务

               执行顺序为 首先对整个代码从上到下执行 碰到同步任务直接执行 碰到异步任务直接推给 宿主环境 由宿主环境执行完毕后将结果放到事件队列内排队等待执行 而当例如用户与页面交互重新发起任务 则也是继续放到事件队列中等待执行 然后执行栈每执行完毕一个任务就会从事件队列中再取一个任务 这样循环执行 直到所有任务都被执行完毕为止。