开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

在微任务队列中，当我们返回值和从then()链返回Promise.resolve时会发生什么？

在微任务队列中，当我们返回值和从then()链返回Promise.resolve时，会发生以下情况：

返回值：如果在Promise的resolve或reject回调函数中返回一个非Promise的值，那么这个值会被包装成一个已解决（resolved）的Promise，并作为下一个then()方法的参数传递。这样可以实现链式调用，将返回值传递给后续的Promise。
Promise.resolve()：当我们从then()链中返回一个Promise.resolve()时，它会创建一个已解决（resolved）的Promise，并将其作为下一个then()方法的参数传递。这样可以在Promise链中插入一个新的Promise，以便在后续的then()方法中处理。

总结起来，无论是返回值还是Promise.resolve()，它们都会将结果包装成一个已解决（resolved）的Promise，并将其传递给下一个then()方法。这样可以确保Promise链的顺序执行，并将结果传递给后续的处理函数。

腾讯云相关产品和产品介绍链接地址：

云函数（Serverless）：https://cloud.tencent.com/product/scf
云开发（CloudBase）：https://cloud.tencent.com/product/tcb
云数据库（TencentDB）：https://cloud.tencent.com/product/cdb
云存储（COS）：https://cloud.tencent.com/product/cos
人工智能（AI）：https://cloud.tencent.com/product/ai
物联网（IoT）：https://cloud.tencent.com/product/iotexplorer
区块链（Blockchain）：https://cloud.tencent.com/product/baas
元宇宙（Metaverse）：https://cloud.tencent.com/product/metaspace

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

惊艳！可视化的 js：动态图演示 Promises & AsyncAwait 的过程！

让我们看下当我们在终端运行这段代码时会发生什么？非常酷！就像我们所期望的一样，promise 得到了解析数据后的值。但是现在呢？我们不关心整个 promise 对象，我们只关心数据的值！...然而，在事件循环内部，实际上有 2 种类型的队列：宏任务(macro)队列 (或者只是叫做任务队列 )和微任务队列。 (宏)任务队列用于宏任务，微任务队列用于微任务。...当它们返回值的时候，会被从栈内弹出。当调用栈是空的时，所有排队的微任务会一个接一个从微任务任务队列中弹出进入调用栈中，然后在调用栈中被执行！...(微任务自己也能返回一个新的微任务，有效地创建无限的微任务循环 ) 如果调用栈和微任务队列都是空的，事件循环会检查宏任务队列里是否还有任务。...一旦微任务中所有的任务被放入调用栈并且最终被弹出，JavaScript 引擎会检查宏任务队列中的任务，将他们弹入调用栈中并且在它们返回值的时候把它们弹出调用栈。

2.1K1 0

【JS】779- 深入理解Promise

当执行 resolve()/reject() 的时候，会将 Promise 对应的处理程序推入微任务队列，稍等这里提到的对应的处理程序具体是指什么？...我们知道 onResolved 函数会基于返回值生成一个新的 Promise，而 onResolvedA 函数没有显示的返回值，所以其返回值为 undefined，那么经过 Promise.resolve...3；开始执行微任务队列 2 里的内容，打印 B，同上一条原理，由于 onResolvedB 函数的返回值为 undefined，所以生成了一个 resolved 的新实例，则会立即将 onResolvedC...推入微任务队列 4；执行微任务队列 3，打印 D；执行微任务队列 4，打印 C；至此全部代码执行完成，最终的打印结果为：A B D C。...将函数返回值 3 转成一个 Promise {: 3} 的新实例，这是第二个状态发生变化的实例；此时所有迭代对象遍历完成，即同步代码执行完成，开始执行微任务队列 1 的内容，打印

1.1K1 0

「硬核JS」图解Promise迷惑行为｜运行机制补充

原因搞清楚了，我们开始改造。我们可以在执行then方法时如果还在等待态 pending，就把回调函数临时寄存到队列（就是一个数组）里，当状态发生改变时依次从数组中取出执行就好了。...现在程序运行状态如下：继续执行微任务队列中的方法 P2-t1 执行，输出 10，返回值是 undefined ，这时会调用 P2-t1 这个 then 方法中返回的新 Promise 实例的 resolve...我们来看图：接着开始执行后微任务队列中的 P2-t1 ： P2-t1 回调执行，输出 10，返回值是 undefined ，这时会调用 P2-t1 这个 then 方法中返回的新 Promise...如下图：接着开始执行后微任务队列中的 P2-t1 ： P2-t1 回调执行，输出 10，返回值是 undefined ，这时会调用 P2-t1 这个 then 方法中返回的新 Promise 实例的...整个程序微任务入队出队顺序如下：至于为什么一个 then 和不带 then 的输出结果一致，我们来看三个程序的微任务入队出队顺序对比就知道了：其实，主要是因为在返回的 Promise 对象后写一个

2.2K3 0

前端面试题汇总-代码输出篇

遇到了定时器，将其加入宏任务队列； 3. 执行Promise p中的resolve，状态变为resolved，返回值为1； 4....执行Promise first中的resolve，状态变为resolved，返回值为2； 5. 遇到p.then，将其加入微任务队列，遇到first().then，将其加入任务队列； 6....这样第一轮宏任务就执行完了，开始执行微任务队列中的任务，先后打印出1和2； 8....，我们知道.finally的返回值如果在没有抛出错误的情况下默认会是上一个Promise的返回值，而这道题中.finally上一个Promise是.then()，但是这个.then()并没有返回值，所以...执行宏任务中的第一个定时器setTimeout，首先打印出2，然后遇到 Promise.resolve().then()，将其加入到微任务队列； 8.

7042 1

Promise面试题_研究生英语面试常见问题及回答技巧

中await后面的Promise是没有返回值的，也就是它的状态始终是pending状态，所以在await之后的内容是不会执行的，也包括async1后面的 .then。...执行Promise p中的resolve，状态变为resolved，返回值为1 执行Promise first中的resolve，状态变为resolved，返回值为2 遇到p.then，将其加入微任务队列...，遇到first().then，将其加入任务队列执行外面的代码，打印出4 这样第一轮宏任务就执行完了，开始执行微任务队列中的任务，先后打印出1和2 这样微任务就执行完了，开始执行下一轮宏任务，宏任务队列中有一个定时器...期望参数是一个函数，这里传入的是一个数字，因此就会发生值渗透，将resolve(1)的值传到最后一个then，直接打印出1 遇到第二个定时器，将其加入到微任务队列，执行微任务队列，按顺序依次执行两个定时器...，我们知道.finally的返回值如果在没有抛出错误的情况下默认会是上一个Promise的返回值，而这道题中.finally上一个Promise是.then()，但是这个.then()并没有返回值，所以

2713 0

前端经典面试题合集

分别存放到微任务（立即存放）和宏任务（时间到了或事情发生了才存放）到队列中script执行完毕后，会清空所有的微任务微任务执行完毕后，会渲染页面（不是每次都调用）再去宏任务队列中看有没有到达时间的，拿出来其中一个执行执行完毕后...，在往下执行new Promise立即执行，输出2，then的回调函数丢到微任务队列中，再继续执行，遇到process.nextTick，同样将回调函数扔到微任务队列，再继续执行，输出5，当所有同步任务执行完成后看有没有可以执行的微任务...宏任务在微任务执行之后执行，因此在同一个事件循环周期内，如果既存在微任务队列又存在宏任务队列，那么优先将微任务队列清空，再执行宏任务队列我们可以看到有一个核心的主线程，它的执行阶段主要处理三个核心逻辑。...将异步任务插入到微任务队列或者宏任务队列中。执行微任务或者宏任务的回调函数。在主线程处理回调函数的同时，也需要判断是否插入微任务和宏任务。...，这两个函数在我们之前的内容中没有讲过，但是当你开始考虑它们在 Eventloop 的生命周期的哪一步触发，或者这两个方法的回调会在微任务队列还是宏任务队列执行的时候，才发现好像没有想象中那么简单。

8852 0

JS 异步

如果同步代码执行完，调用栈call stack为空，去查看微任务队列，每执行完一个微任务，它就会从微任务队列出队，直到微任务队列微空后，尝试DOM渲染（如果DOM结构发生变化）。...宏任务：DOM渲染后触发，如setTimeout 微任务：DOM渲染前触发，如Promise 为什么微任务在渲染前，宏任务在渲染后？ - 微任务：ES 语法标准之内，JS 引擎来统一处理。...，然后在微任务队列中塞入promise1和promise2 当第一个setTimeout1执行完毕后，会去微任务队列检查发现有两个promise，会把两个promise按顺序执行完尝试DOM渲染执行下一个宏任务...，两个promise执行完毕后会微任务队列中没有任务了，会去宏任务中执行下一个任务 setTimeout2 当setTimeout2 执行的时候，先打印一个timeout2，然后又在微任务队列中塞了一个...为什么这里有返回undefined之后才会打印setTimeout，因为前面是同步代码和微任务执行完了，JS引擎工作结束，开始返回值。后面打印的setTimeout是浏览器处理的。

3.4K2 0

如果才能做好准备好前端面试

在执行同步代码时，如果遇到异步事件，js 引擎并不会一直等待其返回结果，而是会将这个事件挂起，继续执行执行栈中的其他任务。当异步事件执行完毕后，再将异步事件对应的回调加入到一个任务队列中等待执行。...任务队列可以分为宏任务队列和微任务队列，当当前执行栈中的事件执行完毕后，js 引擎首先会判断微任务队列中是否有任务可以执行，如果有就将微任务队首的事件压入栈中执行。...当微任务队列中的任务都执行完成后再去执行宏任务队列中的任务。...（2）重绘当页面中某些元素的样式发生变化，但是不会影响其在文档流中的位置时，浏览器就会对元素进行重新绘制，这个过程就是重绘。...__proto__时，可以理解成返回了 // Object.getPrototypeOf(obj) 总结： 1、当一个对象查找属性和方法时会从自身查找,如果查找不到则会通过

4652 0

2年前端面试打怪升级之路

；遇到Promise，首先执行里面的同步代码，打印出2，遇到resolve，将其加入到微任务队列，执行后面同步代码，打印出3；继续执行script中的代码，打印出7和8，至此第一轮代码执行完成；执行微任务队列中的代码...，首先打印出4，如遇到Promise，执行其中的同步代码，打印出5，遇到定时器，将其加入到宏任务队列中，此时宏任务队列中有两个定时器；执行宏任务队列中的代码，这里我们需要注意是的第一个定时器的时间为100ms...如果 JS 是门多线程的语言话，我们在多个线程中处理 DOM 就可能会发生问题（一个线程中新加节点，另一个线程中删除节点），当然可以引入读写锁解决这个问题。...不同的任务源会被分配到不同的 Task 队列中，任务源可以分为微任务（microtask）和宏任务（macrotask）。...poll 队列中的事件并且当 poll 中没有定时器的情况下，会发现以下两件事情如果 poll 队列不为空，会遍历回调队列并同步执行，直到队列为空或者系统限制如果 poll 队列为空，会有两件事发生如果有

2553 0

动图学JS异步: Promises & AsyncAwait

然而，事件循环中，实际上有两种类型的队列：在（宏）任务队列(macro)task queue（或者叫任务队列），以及微任务队列microtask queue。...该（宏）任务队列是（宏）任务和microtask队列是microtasks。那么什么是宏任务队列，什么是微任务队列？虽然实际上存在的比我下面列出来的多，但是在下面的表格中都是我们最常见的！ ?...我们看到promise属于微任务队列，当一个promise执行resolve方法后，然后调用它的then()、catch()、finally()方法，在这些方法中的回调都将被添加到microtask queue...事件循环对于这些任务给出了不同的优先级。 1.所有函数都是在当前调用栈执行，当它们返回一个值时候，就会从调用栈弹出。...在函数体中的第一行，我们调用另一个的console.log，console.log被添加到调用堆栈，执行它，并且返回值In function!打印到控制台，并从调用堆栈弹出。 ?

1.1K2 0

js事件循环与macroµ任务队列

异步任务指的是，不进入主线程、而进入"任务队列"（task queue）的任务，等待同步任务执行完毕之后，轮询执行异步任务队列中的任务macrotask 即宏任务，宏任务队列等同于我们常说的任务队列，macrotask...当Promise的状态改变时会调用then函数中定义的回调函数。我们都知道这个回调函数不会立刻执行，他是一个微任务会被添加到当前任务队列中的末尾，在下一轮任务开始执行之前执行。...但 await 下面的语句会被当成微任务添加到当前任务队列的末尾异步执行。我们来看一下答案不记得题的！...的参数为 promise 对象时直接返回这个 Promise 对象，then 函数在这个 Promise 对象发生改变后立刻执行。...我们知道Promise.resolve()的参数为Promise对象时，会直接返回这个Promise对象。

5272 0

js事件循环与macroµ任务队列-前端面试进阶

异步任务指的是，不进入主线程、而进入"任务队列"（task queue）的任务，等待同步任务执行完毕之后，轮询执行异步任务队列中的任务macrotask 即宏任务，宏任务队列等同于我们常说的任务队列，macrotask...当Promise的状态改变时会调用then函数中定义的回调函数。我们都知道这个回调函数不会立刻执行，他是一个微任务会被添加到当前任务队列中的末尾，在下一轮任务开始执行之前执行。...但 await 下面的语句会被当成微任务添加到当前任务队列的末尾异步执行。我们来看一下答案不记得题的！...的参数为 promise 对象时直接返回这个 Promise 对象，then 函数在这个 Promise 对象发生改变后立刻执行。...我们知道Promise.resolve()的参数为Promise对象时，会直接返回这个Promise对象。

3692 0

js事件循环与macroµ任务队列-前端面试进阶_2023-05-19

异步任务指的是，不进入主线程、而进入"任务队列"（task queue）的任务，等待同步任务执行完毕之后，轮询执行异步任务队列中的任务macrotask 即宏任务，宏任务队列等同于我们常说的任务队列，macrotask...当Promise的状态改变时会调用then函数中定义的回调函数。我们都知道这个回调函数不会立刻执行，他是一个微任务会被添加到当前任务队列中的末尾，在下一轮任务开始执行之前执行。...但 await 下面的语句会被当成微任务添加到当前任务队列的末尾异步执行。我们来看一下答案不记得题的！...的参数为 promise 对象时直接返回这个 Promise 对象，then 函数在这个 Promise 对象发生改变后立刻执行。...我们知道Promise.resolve()的参数为Promise对象时，会直接返回这个Promise对象。

3052 0

js事件循环与macroµ任务队列-前端面试进阶

异步任务指的是，不进入主线程、而进入"任务队列"（task queue）的任务，等待同步任务执行完毕之后，轮询执行异步任务队列中的任务macrotask 即宏任务，宏任务队列等同于我们常说的任务队列，macrotask...当Promise的状态改变时会调用then函数中定义的回调函数。我们都知道这个回调函数不会立刻执行，他是一个微任务会被添加到当前任务队列中的末尾，在下一轮任务开始执行之前执行。...但 await 下面的语句会被当成微任务添加到当前任务队列的末尾异步执行。我们来看一下答案不记得题的！...的参数为 promise 对象时直接返回这个 Promise 对象，then 函数在这个 Promise 对象发生改变后立刻执行。...我们知道Promise.resolve()的参数为Promise对象时，会直接返回这个Promise对象。

4102 0

2023我的前端面试小结3

如果 JS 是门多线程的语言话，我们在多个线程中处理 DOM 就可能会发生问题（一个线程中新加节点，另一个线程中删除节点），当然可以引入读写锁解决这个问题。...不同的任务源会被分配到不同的 Task 队列中，任务源可以分为微任务（microtask）和宏任务（macrotask）。...poll 队列中的事件并且当 poll 中没有定时器的情况下，会发现以下两件事情如果 poll 队列不为空，会遍历回调队列并同步执行，直到队列为空或者系统限制如果 poll 队列为空，会有两件事发生如果有...异步指的是当一个进程在执行某个请求时，如果这个请求需要等待一段时间才能返回，这个时候进程会继续往下执行，不会阻塞等待消息的返回，当消息返回时系统再通知进程进行处理。...先执行 Script 脚本，然后清空微任务队列，然后开始下一轮事件循环，继续先执行宏任务，再清空微任务队列，如此往复。

5164 0

asyncawait 和 promise

3.2 画图一步步看清宏任务、微任务的执行过程我们以开篇的经典面试题为例，分析这个例子中的宏任务和微任务。...，在我脑海中宏任务和为微任务如图所示： ?...如果执行中遇到 promise.then() 之类的微任务，就会推入到「当前宏任务的微任务队列」中，在本轮宏任务的同步代码执行都完成后，依次执行所有的微任务1、2、3。...每次宏任务和微任务发生变化，我都会画一个图来表示他们的变化。...在我们这个例子中，就是 Promise.resolve(undefined) 正常处理完成，并返回其处理结果。那么 await async2() 就算是执行结束了。

6961 0

前端一面高频面试题（附答案）

并将返回值作为Promise.race()方法产生的Promise实例的返回值8、Promise.resolve()将现有对象转为Promise对象，如果该方法的参数为一个Promise对象，Promise.resolve...__proto__时，可以理解成返回了 // Object.getPrototypeOf(obj) 总结： 1、当一个对象查找属性和方法时会从自身查找,如果查找不到则会通过...先执行 Script 脚本，然后清空微任务队列，然后开始下一轮事件循环，继续先执行宏任务，再清空微任务队列，如此往复。...setTimeout 和 setInterval 等都是任务源，真正进入任务队列的是他们分发的任务。...（2）重绘当页面中某些元素的样式发生变化，但是不会影响其在文档流中的位置时，浏览器就会对元素进行重新绘制，这个过程就是重绘。

5642 0

社招前端必会面试题（附答案）

中await后面的Promise是没有返回值的，也就是它的状态始终是pending状态，所以在await之后的内容是不会执行的，包括async1后面的 .then。...；遇到Promise，执行代码，打印出3，遇到resolve，将其加入到微任务队列；遇到第二个定时器，加入到宏任务队列；遇到第三个定时器，加入到宏任务队列；继续执行script代码，打印出8，第一轮执行结束...；执行微任务队列，打印出第一个Promise的resolve结果：4；开始执行宏任务队列，执行第一个定时器，打印出2；此时没有微任务，继续执行宏任务中的第二个定时器，首先打印出5，遇到Promise，首选打印出...6，遇到resolve，将其加入到微任务队列；执行微任务队列，打印出6；执行宏任务队列中的最后一个定时器，打印出7。...true 会发生什么情况？

3743 0

V8引擎Promise源码全面解读（深度好文）

的时候已经介绍过了，作用是修改 promise 的状态为 fulfilled 并为其设置值，然后将 promise 的处理函数推到微任务队列。...这时 microtask 队列中有两个 microtask，一个是执行 resolve 返回值中的 then函数，另一个则是 p3的 onFulfilled 函数。...所以会执行 ResolvePromise 的 Enqueue 代码块，里面会调用 NewPromiseResolveThenableJobTask 产生一个微任务，这个微任务的要做的事情上面已经介绍过，...考察的是规范中的 HostPromiseRejectionTracker，当一个没有绑定处理函数的 Promsie 被调用 reject 则会创建一个微任务来再次检测这个 Promise 是否存在处理函数...，如果此时还不存在则输出报错，setTimeout回调执行在微任务之后。

4871 0

【面试题】734- 从一道面试题谈谈对 EventLoop 的理解

队列中没有元素时，称为空队列。队列的数据元素又称为队列元素。在队列中插入一个队列元素称为入队，从队列中删除一个队列元素称为出队。...我们为了方便理解可以认为在任务队列中有宏任务队列和微任务队列。...所以是宏任务优先，在宏任务执行完毕之后才会来一次性清空任务队列中的所有微任务。...）获取其返回值。...即 awaitpromise.then 这里的async2函数返回的Promise中开启了一个宏任务，await异步等待需要等待宏任务执行才能获取其返回值，也就是说宏任务不执行await表达式就压根不能调用

8553 1

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭