首页
学习
活动
专区
圈层
工具
发布

Promise、setTimeout的执行顺序

Event Loop 这个概念相信大家或多或少都了解过,所谓温故而知新,so,今天,我们就从event loop出发,看看在事件的执行过程中,他都经历了些什么。...同步和异步任务 ​ 要了解异步线程我们首先应该明白它的用处,因为js的单线程特性,任务的执行顺序都是依次执行,而当我们在工作中遇到网络请求,前后端交互的时候,你的数据不会马上拿到,这需要时间,如果等拿到数据再执行下面的代码...() }).then(() => { console.log(4) }) 首先来分析下,这段代码中包含同步任务,包含异步的宏任务setTimeout,包含异步的微任务promise,这套题的答案是...queue 中记一个任务 setTimeout1 然后碰到 promise 微任务, 直接执行 new Promise 输出 5, 并将 then 函数的回调函数推入 micro Task 的 event...queue 中, micro Task 的 event queue 中记 一个 微任务 promise1 又遇到了 setTimeout 宏任务, 同理,将其回调函数推入 macro Task 的 event

82120

JavaScript中Promise里的代码为什么比setTimeout先执行?

在 ES3 和更早的版本中,JavaScript 本身还没有异步执行代码的能力,这也就意味着,宿主环境传递给 JavaScript 引擎一段代码,引擎就把代码直接顺次执行了,这个任务也就是宿主发起的任务...Promise Promise 是 JavaScript 语言提供的一种标准化的异步管理方式,它的总体思想是,需要进行 io、等待或者其它异步操作的函数,不返回真实结果,而返回一个“承诺”,函数的调用方可以在合适的时机...Promise 的 then 回调是一个异步的执行过程,下面我们就来研究一下 Promise 函数中的执行顺序,我们来看一段代码示例: var r = new Promise(function(resolve...在这段代码中,我设置了两段互不相干的异步操作:通过 setTimeout 执行 console.log(“d”),通过 Promise 执行 console.log(“c”)。...在每个宏任务中,分析有多少个微任务; 3. 根据调用次序,确定宏任务中的微任务执行次序; 4. 根据宏任务的触发规则和调用次序,确定宏任务的执行次序; 5.

1.1K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    settimeout(fn 0)与Promise的执行顺序

    而像settimeout、ajax等异步操作的回调,会进入”任务队列“中,而且只有主线程中没有执行任何同步代码的前提下,才会执行异步回调。...新建后立即执行,也就是说,Promise构造函数里的代码是同步执行的。...来看看上面实例的执行: 首先,setTimeout 被推进到 macrotask 队列(将在下一个macrotask中执行)中。...接着, 会先执行 macrotask 中的第一个任务(整个 script中的同步代码 ),再加上promise 构造函数也是同步的(promise.then 回调被推进到 microtask 队列中),...此时,microtask 队列中的任务已经执行完毕,所以执行剩下的 macrotask 队列中的任务,也就是 setTimeout, 所以打印出 1.

    1.5K30

    JavaScript中的Promise

    这让异步方法可以像同步方法那样返回值,但并不是立即返回最终执行结果,而是一个能代表未来出现的结果的promise对象 2.作用 1、主要用于异步计算。...2、可以将异步操作队列化,按照期望的顺序执行,返回符合预期的结果。 3、可以在对象之间传递和操作promise,帮助我们处理队列。...如果该值是thenable(即,带有then方法的对象),返回的Promise对象的最终状态由then方法执行决定;否则的话(该value为空,基本类型或者不带then方法的对象),返回的Promise...另外,then方法指定的回调函数,如果运行中抛出错误,也会被catch方法捕获。...Promise 的值的填充过程都被日志记录(logged)下来,这些日志信息展示了方法中的同步代码和异步代码是如何通过Promise完成解耦的。

    1.4K20

    JavaScript中的 return await promise 与 return promise

    原文地址:'return await promise' vs 'return promise' in JavaScript 原文作者:Dmitri Pavlutin 译文出自:掘金翻译计划 当从异步功能中返回时...相同行为 为了找到两个表达式(与)的区别,(return await promise vs return promise), 我要使用辅助功能。 delayedDivide(n1, n2)....在此步骤中,您已经看到使用和没有区别 return await promise and return promise 至少在处理成功履行承诺时。 但是,让我们搜索更多! 2....return await promisereturn promise 但是,如果你想抓住拒绝的承诺,你从异步功能返回,那么你绝对应该使用表达和故意添加。...return await promiseawait `catch(error) {...}声明捕获只等待拒绝的承诺在声明中。try {...} 喜欢这个帖子?请分享!

    2.4K20

    Promise中的then链机制

    Promise中的then链机制因为每一次 .then都会返回一个新的promise实例,所以我们就可以持续 .then下去了而且因为实例诞生的方式不同,所以状态判断标准也不同第一类:new Promise...,但是有些时候,我们是不传递其中的某个函数的,这种情况下我们需要采取“顺延策略”:找到下一个then中对应状态的函数执行例如:.then(null,onrejected) 或者 .then(onfulfilled...---->我们应该去执行onfulfilled或者onrejected,但是不是立即执行,它是一个异步的微任务首先,把执行对应的方法这个事情放在WebAPI中监听,但是因为此时已经知道状态了,对应的方法可以执行...,所以紧接着把它挪至到EventQueue中(异步微任务队列)等待执行。...;执行Promise.all返回一个新的promise实例@p并且传递一个数组,数组中包含n多其他的promise实例如果数组中的每一个promise实例最后都是成功状态的,则@p也会是成功的,它的值也是一个数组

    35520

    解决cron不执行的问题

    在FreeBSD5.4下面做开发,需要定期备份mysql数据,开始在网上找了bash的脚本,但是执行无效,一怒之下,使用php来写,嘿嘿,其实php写脚本也不错滴。...上面的代码很好理解吧,就是生成一个按照时间为名字的.tgz文件,保存在我的个人主目录下面,为了脚本能够执行,还要加上 chmod +x /home/heiyeluren/db_dump/mysql_dump.php...哦,我想起来了,好像cron能够把脚本中的输出当作邮件发送给创建cron的用户,嗯,好,我们去掉 > /dev/null 这段,就让我们cron直接发送邮件给我们的root: crontab -e 修改为...难道是我们的php脚本有问题,不是我测试过没有问题的吗?哦,看提示,原来是sudo命令没有找到,为什么呢?因为所有脚本中引用的程序都必须是绝对路径滴,不然会找不到,唉,犯错了。...,并且把任何输出到输出到 /dev/null 中,不要给root发邮件。

    1.7K40

    关于 JavaScript 中的 Promise

    Javascript 是一种单线程编程语言,支持异步执行,在不阻塞主线程的情况下满足并发执行的需求。Javascript promise 是处理异步执行的好方法。...在执行过程中,当一个 Promise 被解决为 Fulfilled 或 Rejected 状态时,它的状态将不再改变,并且它的结果(成功时的值或失败时的原因)将被传递给注册的 .then() 或 .catch...在Promise的构造函数中,我们传递了一个执行器函数,这个函数接受两个参数:resolve和reject,它们是由JavaScript引擎提供的回调函数。...链式调用(Chained Promise)链式调用(Chained Promise)是一种用于处理异步操作序列的技术,在JavaScript中,它允许按顺序执行多个异步操作,并且可以在每个操作完成后执行下一个操作...虽然 JavaScript 的 Promise 本身不直接支持取消操作,但可以通过上述方法实现类似的行为。需要根据具体情况和需求选择最合适的方法来管理和取消 Promise。

    1.2K62

    Javascript 中的神器——Promise

    Promise 对象代表一个异步操作,有三种状态:Pending(进行中)、Resolved(已完成,又称 Fulfilled)和 Rejected(已失败)。...有了 Promise 对象,就可以将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数。此外,Promise 对象提供统一的接口,使得控制异步操作更加容易。 Promise 也有一些缺点。...首先,无法取消 Promise,一旦新建它就会立即执行,无法中途取消。其次,如果不设置回调函数,Promise 内部抛出的错误,不会反应到外部。...设定更高层的作用域3. spread 5. finally 任何情况下都会执行的,一般写在 catch 之后 6. bind somethingAsync().bind({}) .spread(function...只有有一个失败,所有的执行都结束 ``` Promise.props({ pictures: getPictures(), comments: getComments(), tweets: getTweets

    1.3K50

    JavaScript执行(一):Promise里的代码为什么比setTimeout先执行?

    在 ES3 和更早的版本中,JavaScript 本身还没有异步执行代码的能力,这也就意味着,宿主环境传递给 JavaScript 引擎一段代码,引擎就把代码直接顺次执行了,这个任务也就是宿主发起的任务...Promise Promise 是 JavaScript 语言提供的一种标准化的异步管理方式,它的总体思想是,需要进行 io、等待或者其它异步操作的函数,不返回真实结果,而返回一个“承诺”,函数的调用方可以在合适的时机...Promise 的 then 回调是一个异步的执行过程,下面我们就来研究一下 Promise 函数中的执行顺序,我们来看一段代码示例: var r = new Promise(function(resolve...在这段代码中,我设置了两段互不相干的异步操作:通过 setTimeout 执行 console.log(“d”),通过 Promise 执行 console.log(“c”)。...在每个宏任务中,分析有多少个微任务; 3. 根据调用次序,确定宏任务中的微任务执行次序; 4. 根据宏任务的触发规则和调用次序,确定宏任务的执行次序; 5.

    71610

    iOS 中的 Promise 设计模式

    Promise 设计模式的原理 Promise设计模式把每一个异步操作都封装成一个Promise对象,这个Promise对象就是这个异步操作执行完毕的结果,但是这个结果是可变的,就像薛定谔的猫,只有执行了才知道...另外还有其它几个关键字用来表示一个Promise对象的状态: pending: 任务执行中,状态可能会进入下面的fullfill或者reject二者之一 fufill/resolved: 任务完成了,返回结果...一个Promise在执行完毕之后,无论状态是变成resolve还是pending,都通过这个方法,执行对应的 then,并返回一个Promise对象。...上面的函数中,有一个dispatchBarrierSync,barrier是栅栏的意思,一般来说如果我们有多个异步任务,但是希望他们按照一定的顺序执行,就可以使用这个方法。...在这个barrier方法内部,一个是会去看当前是否已经有下一个要执行的Promise,如果没有就生成一个新的,另一个把对应的pending 放到handler队列,依次执行。

    1.6K00

    JavaScript中的Promise使用详解

    那么如何解决地狱回调,保持我们的代码简短,这时Promise就出场了,Promise对象可以理解为一次执行的异步操作,使用Promise对象之后可以使用一种链式调用的方式来组织代码;让代码更加的直观。...Promise正如字面意思-承诺,“承诺将来会执行”约定的事情。我们首先需要了解Promise的三种状态: pending: 初始状态,既不是成功,也不是失败状态。...Resolve函数的作用是,将Promise对象的状态从“未完成”变为“成功”(即从 pending 变为 resolved),在异步操作成功时调用,并将异步操作的结果,作为参数传递出去; Reject...函数的作用是,将Promise对象的状态从“未完成”变为“失败”(即从 pending 变为 rejected),在异步操作失败时调用,并将异步操作报出的错误,作为参数传递出去。...Promise实例生成以后,可以用then方法分别指定resolved状态和rejected状态的回调函数。

    1.7K1513
    领券