| |
|
开发:
C++知识库
Java知识库
JavaScript
Python
PHP知识库
人工智能
区块链
大数据
移动开发
嵌入式
开发工具
数据结构与算法
开发测试
游戏开发
网络协议
系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程 数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁 |
-> JavaScript知识库 -> Event Loop -> 正文阅读 |
|
[JavaScript知识库]Event Loop |
javaScript是一门单线程的语言,在执行任务的时候,所有任务必须排队,然后一个一个的执行, 大体由三部分组成:调用栈(call stack)、消息队列(Message Queue)、微任务队列(Microtask Queue) Event Loop开始执行时会从全局代码开始,一行一行执行。遇到函数调用,会压入调用栈中 被压入的函数叫做帧(Frame) ?会从调用栈中弹出 ?如上图代码,首先把func2()压入调用栈中,执行func2()中的代码 遇到console.log(2) ,压入执行栈中,执行并打印2,弹出 遇到func1(),压入执行栈中,console.log(1)被压入执行栈中,执行并打印出1,弹出,func1()执行完毕,弹出 最后console.log(3)被压入栈中,执行并打印3,func2执行完毕,弹出,整个调用栈清空 javaScript中的异步操作宏任务fetch,setTimeout,setInterval中的回调函数会入队到消息队列中,称为消息。 加上setTimeout ??当setTimeout压入到执行栈中,他里面的回调函数会被进入消息队列中 ?消息会在调用栈清空时执行 遇到func1(),压入执行栈,遇到console.log(1),压入执行栈,执行并打印1,弹出 遇到console.log(3),压入调用栈,执行并打印3,弹出。执行完毕后,func2()弹出,调用栈为空。 消息队列中的消息会被压入到调用栈中,并执行,打印2 ?微任务?使用Promise,async创建的异步操作会加入到微任务队列中,在调用栈被清空的时候,立即执行。并且处理期间新加入的微任务也会一同执行。 加入promise Promise构造函数首先被压入到执行栈中 ?之后console.log(4),resolve(5),分别压入栈中,并执行,打印4.最后弹出promise函数 剩下的过程和之前一样,调用fun2,setTimeout中的匿名回调,console.log(2)入队到消息队列,调用func1(),打印1,弹出func1(),console.log(3),打印3,之后promise两个then的回调函数,入队到微任务队列,之后弹出func2() ?此时调用栈为空,执行微任务队列中的任务,把他们压入调用栈中,并执行,打印出5和6 最后压入并执行消息队列的消息,打印2? |
|
JavaScript知识库 最新文章 |
ES6的相关知识点 |
react 函数式组件 & react其他一些总结 |
Vue基础超详细 |
前端JS也可以连点成线(Vue中运用 AntVG6) |
Vue事件处理的基本使用 |
Vue后台项目的记录 (一) |
前后端分离vue跨域,devServer配置proxy代理 |
TypeScript |
初识vuex |
vue项目安装包指令收集 |
|
上一篇文章 下一篇文章 查看所有文章 |
|
开发:
C++知识库
Java知识库
JavaScript
Python
PHP知识库
人工智能
区块链
大数据
移动开发
嵌入式
开发工具
数据结构与算法
开发测试
游戏开发
网络协议
系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程 数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁 |
360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 | -2024/11/24 4:46:04- |
|
网站联系: qq:121756557 email:121756557@qq.com IT数码 |