【面试必备】事件循环(EventLoop)、宏任务微任务

在js执行同步任务和异步任务的过程中,在主线程执行栈中的同步任务执行完毕就会,读取任务队列中的回调函数,将回调函数放到主线程执行栈中执行,执行完毕又会继续读取任务队列中的回调函数,放到主线程执行栈中执行,如此往复的过程称为事件循环(EventLoop);

在这里插入图片描述

注意:❗❗❗

🥇 二、宏任务、微任务

===========================================================================

以上内容已经讲解了同步任务和异步任务的概念,javascript将异步任务又进一步划分成了宏任务和微任务;

常见的宏任务有:Ajax请求、文件操作、setTimeout、setInterval

常见的微任务: Promise的then、catch、finally方法,Process.nextTick;

在这里插入图片描述

🥇 三、宏任务和微任务的执行顺序

================================================================================

在每一个宏任务执行完毕后就会去查找是否存在微任务,如果微任务存在就将微任务执行完毕再去执行下一个宏任务,以此往复;

在这里插入图片描述

🥇 四、便于理解的生活场景映射

===============================================================================

①小云和小腾去银行办业务。首先,需要取号之后进行排队;

⚫宏任务队列

②假设当前银行网点只有一个柜员,小云在办理存款业务时,小腾只能等待

⚫单线程,宏任务按次序执行

③小云办完存款业务后,柜员询问他是否还想办理其它业务?

⚫当前宏任务执行完,检查是否有微任务

④小云告诉柜员:想要买理财产品、再办个信用卡、最后再兑换点马年纪念币?

⚫执行微任务,后续宏任务被推迟

⑤小云离开柜台后,柜员开始为小腾办理业务

⚫所有微任务执行完毕,开始执行下一个宏任务

写在最后

===================================================================

宏任务、微任务是前端的经典面试题,请大家千万一定要认真理解,深刻记忆;

🥂(❁´◡`❁)您的点赞👍➕评论📝➕收藏⭐是作者创作的最大动力🤞

最后

自我介绍一下,小编13年上海交大毕业,曾经在小公司待过,也去过华为、OPPO等大厂,18年进入阿里一直到现在。

深知大多数初中级Android工程师,想要提升技能,往往是自己摸索成长,自己不成体系的自学效果低效漫长且无助。

因此收集整理了一份《2024年Web前端开发全套学习资料》,初衷也很简单,就是希望能够帮助到想自学提升又不知道该从何学起的朋友,同时减轻大家的负担。

img

既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,基本涵盖了95%以上Android开发知识点!不论你是刚入门Android开发的新手,还是希望在技术上不断提升的资深开发者,这些资料都将为你打开新的学习之门!

如果你觉得这些内容对你有帮助,需要这份全套学习资料的朋友可以戳我获取!!

由于文件比较大,这里只是将部分目录截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且会持续更新!
dn.net/topics/618191877)

由于文件比较大,这里只是将部分目录截图出来,每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频,并且会持续更新!

  • 5
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,下面是一个宏任务微任务相关的面试题。 1. 什么是宏任务微任务? 答:宏任务微任务是 JavaScript 引擎用来管理异步任务的两种机制。 宏任务指的是在 JavaScript 引擎中排队等待执行的任务,这些任务通常是由浏览器或 Node.js 等宿主环境提供的,如定时器、事件回调等。 微任务指的是在当前任务执行完毕后需要立即执行的任务,这些任务通常是由 Promise 和 MutaionObserver 提供的,如 Promise.then()、Promise.catch()、Promise.finally() 和 MutationObserver。 2. 宏任务微任务的执行顺序是怎样的? 答:宏任务微任务执行顺序是不同的,它们都有自己的队列,而且微任务的优先级比宏任务高。 当一个宏任务被执行时,会先执行完所有的微任务,然后再继续执行下一个宏任务。如果在执行微任务的过程中产生了新的微任务,那么这些新的微任务会被插入到当前微任务队列的末尾,等待下一次执行。 举个例子:假设当前有一个宏任务 A,它包含三个微任务 X、Y 和 Z。当宏任务 A 被执行时,会先执行微任务 X,然后执行微任务 Y,最后执行微任务 Z,如果在执行微任务 Y 的过程中又产生了一个新的微任务 W,那么它会被插入到当前微任务队列的末尾,等待下一次执行。 3. 如何利用宏任务微任务实现异步操作? 答:可以使用 Promise 和 async/await 来利用宏任务微任务实现异步操作。 例如,使用 Promise 来发起一个异步请求: ```javascript function fetchData() { return fetch('https://api.example.com/data') .then(response => response.json()) .then(data => { console.log('data:', data); }) .catch(error => { console.error('error:', error); }); } ``` 在这个例子中,fetchData 函数返回一个 Promise 对象,当这个 Promise 对象被 resolve 时,会执行一系列的微任务,包括打印数据到控制台。如果发生错误,会执行一个 catch 微任务。 另外,可以使用 async/await 来简化异步操作: ```javascript async function fetchData() { try { const response = await fetch('https://api.example.com/data'); const data = await response.json(); console.log('data:', data); } catch (error) { console.error('error:', error); } } ``` 这个例子中,使用 async/await 来编写异步代码,fetchData 函数会等待 fetch 请求的结果,在结果返回后再执行后续操作。如果发生错误,会抛出一个异常,可以通过 try/catch 块来处理。在执行 async 函数时,会创建一个微任务队列来管理异步操作,确保异步操作的执行顺序正确。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值