专栏首页前端小吉米Promise 串行调用面试题

Promise 串行调用面试题

最新看到一个比较有趣的面试题:

怎么串行执行 Promise ?

这里简单给大家介绍下解答。针对多个 Promise 方法,原生提供了 allrace 方法。但是,他们都不是串行执行。那应该如果执行串行方法?这里介绍两种写法:

递归执行

简单来说就是在 then 方法里面递归传递下一次异步方法: then(next())

function iteratorPromise(arr){

    (function iter(){
        if(arr.length)
            arr.shift()().then(iter)
    })()
}

let arr = [()=>{
    return new Promise(res=>{
        console.log("run", Date.now());
        res()
    })
},()=>{
    return new Promise(res=>{
        console.log("run", Date.now());
        res()
    })
},()=>{
    return new Promise(res=>{
        console.log("run", Date.now());
        res()
    })
}]

iteratorPromise(arr);

// output
run 1529918098567
run 1529918098568
run 1529918098569

循环调用

这种办法比较取巧,直接利用 Promise.resolve()。通过循环赋值,得到最终的结果。

function iteratorPromise(arr){

    let res = Promise.resolve();

    arr.forEach(fn=>{
        res = res.then(()=>fn()) // 关键是 res=res.then... 这个逻辑
    })
}

let arr = [()=>{
    return new Promise(res=>{
        setTimeout(()=>{
            console.log("run", Date.now());
            res()
        },1000)

    })
},()=>{
    return new Promise(res=>{
        setTimeout(()=>{
            console.log("run", Date.now());
            res()
        },1000)

    })
},()=>{
    return new Promise(res=>{
        setTimeout(()=>{
            console.log("run", Date.now());
            res()
        },1000)

    })
}]

iteratorPromise(arr);


// output
run 1529918643573
run 1529918644574
run 1529918645580

本文分享自微信公众号 - 前端小吉米(villainThr)

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2018-06-25

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 关于音视频测试的一点建议

    villainhr
  • 学好 MP4,让直播更给力

    villainhr
  • HTTP2即未来

    villainhr
  • 使用python创建生成动态链接库dll的方法

    如今,随着深度学习的发展,python已经成为了深度学习研究中第一语言。绝大部分的深度学习工具包都有python的版本,很多重要算法都有python版本的实现。...

    砸漏
  • Mathematica 在教学上的可视化展示

    WolframChina
  • LitePal操作数据库

    Dream城堡
  • React Native 集成分享第三方登录功能分享第三方登录模块开发(Android)

    在我们常用的App中经常会看到分享与第三方登录的功能,可以说分享与第三方登录已经成为了各大APP的必备功能。对于产品运行与推广来说,分享与第三方登录不仅能加强用...

    CrazyCodeBoy
  • android沉浸式状态栏的实现

    在style.xml中添加 <style name="Theme.Timetodo" parent="@android:style/Theme.Holo.L...

    xiangzhihong
  • Android-MediaPlayer

    突然觉得这个音乐播放有点意思,我们来做一下吧。 首先我们来一个名为MediaPlayerDemo的项目。 然后再main.xml文件里面创建三个按钮,分别是...

    晨曦_LLW
  • Android使用AIDL实现两个App间通信

    今天开发了一个功能,通过Android的AIDL机制完成两个app间的通信。功能需求很简单,一个客户端app,叫做client,一个服务端app叫orderMa...

    砸漏

扫码关注云+社区

领取腾讯云代金券