Promise配合forEach的使用,异步循环后再继续执行

网上有很多类似的实现方式,但我也不太懂js啊,所以我专门用TS写了一遍。
循环执行Promise,每一次循环都是异步且等上一循环结束后再执行下一次循环。
TypeScript异步执行数组中的每一项,并在每一项执行完后才继续执行后面的代码。
用的ES2015。

这个写法有什么用处呢?如果是加载资源,一般都是同时加载,最后统计加载完成的个数,都是能并发就并发的。
想来想去,不知道这种依次异步的实现方式,用在哪里。

后来我想,这可以用来实现类似Rx的流的概念。我一系列操作步骤,无论同步异步,全放在循环里,可以大大优化代码

/**异步循环 */
    function doLoop()
    {
        try
        {
            var result:Promise<any> = Promise.resolve();

            //forEach写法
            loopArr.forEach(
                function (factory)
                {
                    result = result.then(factory);
                }
            );

            // Promise.all写法
            //Promise.all(loopArr.map(
            //    function(factory)
            //    {
            //        result = result.then(factory);
            //    }
            //));

            result.then(logLoopResult);
        }
        catch(err)
        {
            console.log("loop failed");
        }
    }

    /**循环结束后才会执行此方法 */
    function logLoopResult()
    {
        console.log("do Loop end");
    }
    
    var loopCount:number = 0;
    var maxCount:number = 3;
    var loopArr = [promiseFactry1, promiseFactry2, promiseFactry3];
    function calllLoopPromise(reslove)
    {
        setTimeout(
            function ()
            {
                //此处loopCount++只是为了看下效果,实际不需要计数
                loopCount++;
                console.log(loopCount, maxCount);
                return reslove("loopCount");
            } 
            , 1000
        );
    }

    function promiseFactry1()
    {
        return new Promise(calllLoopPromise);
    }

    function promiseFactry2()
    {
        return new Promise(calllLoopPromise);
    }

    function promiseFactry3()
    {
        return new Promise(calllLoopPromise);
    }
  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值