获取中...

-

Just a minute...

微任务队列宏任务队列

  1. javascript是单线程,多线程都是模拟出来的,
  2. script、setTimeOut、setInterval是宏任务
  3. Promise,process.nextTick是微任务
  4. setTimeOut是n毫秒之后,将回调函数放入任务执行队列;setInterval是每隔n毫秒将回调函数推入任务执行队列,不能保证n毫秒之后立即执行!
  5. 1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    setTimeout(()=>{
    console.log(1)
    },0)
    let i =0
    while(i<10000){
    i++
    console.log(2)
    }

    setTimeout(() => {
    console.log(3)
    }, 0)
    2 1 3
    虽然setTimeout很早就注册了,但是要等到同步任务,宏任务执行完毕才执行微任务
    再看一段复杂一点的
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    console.log('1');
    new Promise((resolve) => {
    console.log('1.1');
    resolve()
    }).then(() => {
    console.log('2');
    }).then(()=>{
    console.log('2.1')
    })
    console.log(4)
    输出1 1.1 4 2 2.1
    console.log是同步任务,new Promise之后取出
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
console.log('1');                   //a同步任务,输出1
setTimeout(function() { //b放入队列,宏任务 h执行宏任务
console.log('3'); // i同步任务,输出3
new Promise(function(resolve) { // j同步任务,输出3.1
console.log('3.1');
resolve();
}).then(function() { // k微任务,放入队列,插队输入4
console.log('4')
})
})

new Promise(function(resolve) {
console.log('1.1'); //c同步任务,输出1.1
resolve();
}).then(function() {
console.log('2') //d放入队列,微任务 g优先执行微任务,输出2
})

setTimeout(function() { //e放入队列,宏任务 l执行队列中的宏任务
console.log('5'); // m同步任务,输出5
new Promise(function(resolve) {
console.log('5.1'); // n放入队列,队列无任务,立即执行输出5.1
resolve();
}).then(function() { // o放入队列,队列无任务,立即执行输出6
console.log('6')
})
})
//f结束没有同步任务了,开始执行微任务队列

最后答案
1 1.2 2 3 3.1 4 5 5.1 6

相关文章
评论
分享
  • 罗盘时钟

    罗盘时钟不刷抖音但是最近也听说了有很火的罗盘时钟,废话不多说直接上代码 123456789101112131415161718192021222324252627282930313233343536373839404142434445...

    罗盘时钟
  • 如何判定我点了margin?

    这个世界上唯有两样东西能让我们的心灵感到深深的震撼:一是我们头顶上灿烂的星云,二是我们心中崇高的道德法则。 one - 康德 前言页面的绑定事件都是绑定在DOM元素上的,诸如此类 123document.getElementById(...

    如何判定我点了margin?
  • 花式log

    各种控制台输出常见的控制台打印12345678console.log() // 打印日志console.debug() // 打印调试console.error() // 打印错误console.info() // 打印...

    花式log
  • 离线上传方案

    有个需求需要断网环境下上传文件,在有网环境下提交附件需要提交到单独的文件服务器,返回文件服务器的id框架是element-ui 设计思路 利用浏览器自带的indexDB,存储blob数据 利用localStorage缓存表单数据,in...

    离线上传方案
  • 粘贴图片上传功能

    粘贴图片并上传最近在写博客的时候,纯MarkDown语法写,但是发现图片是个需求,需要经常截图并且写到MarkDown里面之前的做法是用QQ截图,然后另存为到本地桌面,然后再上传,返回URI地址,贴到博客编辑器里面最近发现有些页面支持...

    粘贴图片上传功能
  • 只要不失去你的崇高整个世界就会向你敞开

    7 月 29 日周五,临下班之前问了一下领导,下周不会出差吧,这周我要回家领导说:放心回马鞍山吧,不出差,注意疫情防控就行。结果刚到高铁站就打电话来,说是一个很紧急的项目要去桂林出差,赶紧订周日或者周一的飞机票过去年龄越大,就越难有反...

    只要不失去你的崇高整个世界就会向你敞开
  • 端午小记

    端午小记很遗憾 三个月没到就分手了 为什么是她因为刚好是她合适的时间合适的地点相遇再加上一些多巴胺和荷尔蒙的催化下我也想试试,以为这就是不等人的缘分 为什么是我因为刚好是我出现在合适的时间合适的地点在她被不喜欢的人追求时一面挡箭牌出现...

    端午小记
  • 利用微信小程序扫码授权

    微信小程序扫码授权背景想要使用微信扫码登录自己的网址,通过授权快速获取用户的昵称,头像功能由于没有企业认证账号,故只能通过微信小程序实现, 体验地址https://api.nnnnzs.cn/screen-demo.html?env=...

    利用微信小程序扫码授权
  • Math.ceil(25/10)*10 === 30

    终于是到了四舍五入等于 30 的年龄了其实这应该是一篇放在 2022 年 3 月 8 日更新的博客内容应该是来南京工作一年的总结拖到五一假期,整理一下思绪打算发的结果五一又忙着帮别人搬家生日也得过且过,所以拖到了现在 感情发上一篇帖...

    Math.ceil(25/10)*10 === 30
  • 强制加载element-dialog

    强制加载element-dialog背景123<el-dialog> <MyComponent /></el-dialog> 自己封装的组件 MyComponent ,放在了el-dialog里...

    强制加载element-dialog