promise和setTimeout的执行机制

首先阐述一下两者

在Promise中,我们可以将一个异步任务封装在一个Promise对象中,并为其绑定resolve和reject回调函数。当异步任务执行成功时,调用resolve,失败时则调用reject。Promise对象的状态有三种:pending(进行中),fulfilled(已完成,相当于resolve),rejected(已失败,相当于reject)。当Promise状态变为fulfilled或rejected时,Promise会将对应的回调函数加入到任务队列中等待执行。

setTimeout用于设定一个定时器,在定时器到达设定的时间后,将目标函数加入到任务队列中等待执行。由于JavaScript是单线程执行,当主线程执行完当前所有任务后才会去任务队列中取出任务执行。因此,setTimeout中设定的回调函数并不是在设定的时间到达时马上执行,而是在主线程中的所有任务执行完毕后才会被调用。另外,值得注意的是,当setTimeout的时间设为0时,相当于直接将目标函数加入到了任务队列中,但它的执行顺序也会受到当前主线程任务的影响。

可以看到Promise和setTimeout都会将函数加入任务队列,那么执行顺序应该是怎么样的?

JavaScript通过任务队列管理所有异步任务,而任务队列还可以细分为MacroTask Queue和MicoTask Queue两类:

MacroTask Queue

MacroTask Queue(宏任务队列)主要包括setTimeout, setInterval, setImmediate, requestAnimationFrame, UI rendeing, NodeJS中的I/O等。

MicroTask Queue

MicroTask Queue(微任务队列)主要包括两类:

  1. 独立回调microTask:如Promise,其成功/失败回调函数相互独立;

  2. 复合回调microTask:如 Object.observe, MutationObserver 和NodeJs中的 process.nextTick ,不同状态回调在同一函数体;

MacroTask和MicroTask的执行流程是一个交替执行的过程,代码块执行的时候,按顺序放入异步任务,如果检测到MicroTask,那么将执行它,第一个异步任务结束后会检查是否有同类任务,如果有就继续执行,没有则检查另一类任务是否存在,直至异步任务全部执行完毕。

举个实际开发中遇到的例子

var p = new Promise(function(resolve, reject){
    resolve(1);
})
setTimeout(function(){
  console.log("setTimeout1");
},0)
p.then(function(value){
  console.log("p1");
})
p.then(function(value){
  setTimeout(function(){
  console.log("setTimeout2");
},0)
  console.log("p2");
})
setTimeout(function(){
  console.log("setTimeout3");
},0)
p.then(function(value){
  console.log("p3");
})

执行结果为p1 p2 p3 setTimeout1 setTimeout3 setTimeout2

promise的优先级是大于setTimeout的,因此3个promise先执行完毕,接着执行setTimeout的时候发现setTimeout2顺序发生了一点变化,真实的setTimeout入栈顺序是setTimeout1->setTimeout3->setTimeout2,因为promise执行完之后setTimeout2才被加入宏异步任务,所以排在最后。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
### 回答1: promisesetTimeout都是JavaScript中常用的异步编程方式,但是它们的应用场景和特点略有不同。 promise是一种用于处理异步操作的对象,它可以将异步操作的结果传递给相关代码,以便于异步操作完成后进行后续处理。Promise有三种状态:Pending(进行中)、Resolved(已完成)和Rejected(已失败),当异步操作完成后,可以将Promise状态从Pending改为Resolved或者Rejected,并将相应的结果传递给相关代码。 setTimeout是一种用于在一定时间后执行某个函数的方法。它会在指定的时间间隔之后将指定的代码添加到任务队列中,并在执行栈为空时执行该代码。setTimeout是一种延时执行的方法,通常用于在等待一段时间之后执行某些操作,比如延迟加载资源或者实现一些动画效果。 从应用场景来看,Promise通常用于需要处理异步操作结果的场景,而setTimeout通常用于需要在一定时间之后执行某些代码的场景。从技术特点来看,Promise可以很好地处理异步操作的结果,而setTimeout主要是用于延时执行某些代码。因此,在不同的场景下,选择使用Promise或者setTimeout都需要考虑具体的需求和实现方式。 ### 回答2: 在JavaScript中,PromisesetTimeout是两个不同的概念,它们的执行顺序取决于具体的代码逻辑和使用方式。 Promise是一种异步编程的解决方案,用于处理一些需要花费时间的操作。当我们创建一个Promise对象时,其中的代码会被立即执行,并且可以设置回调函数处理异步操作的结果。一旦Promise对象的状态发生改变(可以是fulfilled满足或rejected拒绝),相应的回调函数将会被调用。 而setTimeoutJavaScript的一个定时器函数,用于在指定的延迟时间之后执行一段代码。当我们使用setTimeout函数时,其中的代码会被放入到一个任务队列中,在指定的延迟时间之后,才会被执行。 根据执行机制Promise通常拥有更高的优先级。Promise对象中的代码会立即执行,而setTimeout中的代码则会在其他同步任务执行完毕后才会被执行。也就是说,Promise中的代码会被优先执行,而setTimeout中的代码会在Promise对象执行完毕后才会被执行。 然而,如果我们使用了async/await等异步操作,PromisesetTimeout执行顺序就有可能受到影响。在这种情况下,可能会出现在Promise中的代码还未执行完毕,但由于设置了一个较短的延迟时间,setTimeout中的代码先被执行的情况。 总结起来,Promise通常拥有更高的优先级,其代码会立即执行setTimeout中的代码会在Promise代码执行完毕后才会被执行,除非使用了某些特殊的异步操作方式。 ### 回答3: PromisesetTimeout没有优先性的比较,因为它们是完全不同的东西。 Promise是一种处理异步操作的机制,它可以用于处理异步操作的状态和结果。当我们创建一个Promise对象时,它可以包含异步操作的结果,并提供一些方法来处理成功或失败时的逻辑。Promise执行顺序由代码中的逻辑和异步操作的执行时间决定,与setTimeout没有直接的关系。 setTimeout是一个用于设置在一定延迟时间后执行的函数的方法。它允许我们在指定的延迟时间之后执行一段代码。setTimeout执行时间是相对于调用它的时刻来计算的,它不受Promise的状态或结果影响。 根据上述解释,PromisesetTimeout执行顺序上没有优先性的比较。它们是独立的概念,用于不同的目的。Promise用于处理异步操作的状态和结果,而setTimeout用于延迟执行一段代码。在实际开发中,我们可以根据需求选择使用PromisesetTimeout,或者它们的组合来处理不同的情况。

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值