安庆网站建设公司简,污水处理厂网站建设,吉林省建设项目信息网,怎么查wordpress主题一、前言
JS是单线程语言#xff0c;但是又可以做到异步处理高并发请求#xff0c;这时就用到了JavaScript的事件循环机制 理解事件循环#xff0c;可以帮助我们准确分析和运用各种异步形式#xff0c;减少代码的不确定性#xff0c;在一些执行效率优化上也能有明确的思路…一、前言
JS是单线程语言但是又可以做到异步处理高并发请求这时就用到了JavaScript的事件循环机制 理解事件循环可以帮助我们准确分析和运用各种异步形式减少代码的不确定性在一些执行效率优化上也能有明确的思路。
二、首先理解
JS是单线程语言分为 同步任务 和 异步任务同步任务立即执行的任务在主线程上排队执行形成一个执行栈只有前一个任务执行完毕才能继续执行下一个任务。异步任务不进入主线程而进入“任务队列”的任务只有等主线程任务全部执行完毕。“任务队列”的任务才会进入主线程执行。任务队列分为 微任务队列 和 宏任务队列微任务较短时间内可以完成的任务宏任务需要相对较长时间才能完成的任务
微任务microtask宏任务macrotask谁发起的JS引擎宿主Node、浏览器具体事件Promise.then()/.catch()、async await、MutaionObserver、nextTick(Node.js 环境)script整体代码、setTimeout/setInterval 、UI渲染任务、事件处理器、I/O操作如文件读取、Ajax网络请求等异步任务谁先执行先执行后执行会触发新一轮事件循环吗不会会
栈是一种后进先出的数据结构数据元素在插入即进栈和删除即出栈时均从栈顶进行操作。 类似于堆在一起的餐盘最先放的盘子在最底下最后放的盘子在最上面需要把最上面的盘子一个个拿走才能拿到最下面的盘子。队列是一种先进先出的数据结构数据元素在队尾插入而从队首删除的。 类似于我们去排队买东西先去的同学可以先买到。
三、灵魂三问
1. JS为什么是单线程的?
JS引擎之所以是单线程是由于JavaScript最初是作为浏览器脚本语言开发的并且JavaScript需要操作DOM等浏览器的API如果多个线程同时进行DOM更新等操作则可能会出现各种问题如竞态条件、数据难以同步、复杂的锁逻辑等因此将JS引擎设计成单线程的形式就可以避免这些问题。 如果JS是多线程的场景描述: 现在有2个线程process1 process2由于是多线程的JS所以他们对同一个dom同时进行操作 process1 删除了该dom而process2 编辑了该dom同时下达2个矛盾的命令浏览器究竟该如何执行呢这时可能就会出现问题了。 这样想,JS为什么被设计成单线程应该就容易理解了吧 2. 为什么需要异步? 为什么要有事件循环机制
如果JS中不存在异步只能自上而下执行如果上一行解析时间很长那么下面的代码就会被阻塞。对于用户而言阻塞就意味着卡死这样就导致了很差的用户体验。所以JS中存在异步执行。
3. 单线程又是如何实现异步的呢?
异步的核心就是事件循环机制Event Loop。 当 JavaScript 引擎空闲下来也就是当前的执行栈已经清空时JavaScript 引擎才会去查询任务队列中是否有需要执行的异步任务这就是保证异步代码不会阻塞其他任务执行的关键。
四、什么是事件循环
事件循环是JavaScript实现异步的一种方法也是JavaScript的执行机制。
为 js 是单线程运行的在代码执行时通过将不同函数的执行上下文压入执行栈中来保证代码的有序执行。
先执行同步任务如果遇到异步任务js 引擎并不会一直等待其返回结果而是会将这个任务挂起继续执行执行栈中的其他同步任务。当异步任务执行完毕后再将异步任务对应的回调函数加入到一个任务队列中等待执行。任务队列可以分为宏任务队列 和 微任务队列当执行栈中的事件执行完毕后js 引擎首先会判断微任务队列中是否有任务可以执行如果有就将微任务队首的事件压入栈中执行。队列遵循先进先出原则。当微任务队列中的任务都执行完成后再去执行宏任务队列中的任务。如果宏任务队列中有微任务继续执行微任务。如此反复循环直至任务队列为空。这就是JavaScript的事件循环机制。
总结JS代码执行顺序同步任务 微任务 宏任务。 需要注意的点 所有的代码都要通过函数执行栈主线程中调用执行。等到执行栈中的task执行完之后再回去执行任务队列之中的task。任务队列中存放的是回调函数。执行微任务过程中产生的新的微任务并不会推迟到下一个循环中执行而是在当前的循环中继续执行。当执行一个宏任务时如果宏任务中产生了新的微任务这些微任务不会立刻执行而是会被放入到当前微任务队列中在当前宏任务执行完毕后被依次执行。 五、事件循环Event Loop 执行顺序
首先执行同步代码这属于宏任务。当执行完所有同步代码后执行栈为空查询是否有异步代码需要执行。执行所有微任务。当执行完所有微任务后如有必要会渲染页面。然后开始下一轮 Event Loop执行宏任务中的异步代码。
也就是说一次 Event Loop 循环会处理一个 宏任务 和 所有这次循环中产生的微任务。
