时间戳

首页 > 解决方案 > 在 javascript 中使用 Promises 运行代码时出现问题

javascript - 在 javascript 中使用 Promises 运行代码时出现问题

问题描述

节目说明

Create 3 functions:
FuncA – will receive a string and returns it’s length
FuncB – will receive an array of strings and returns their total lengths (using
funcA) after 2 seconds.
FuncC - will receive an array of arrays of strings and returns their total lengths
(using FuncB)

我的解决方案是

    function funcA(s)
    {
        return s.length
    }

    function funcB(arr)
    {
        return new Promise(resolve =>
            {
                setTimeout(() =>
                {
                    let total = 0;
                    arr.forEach(element => {
                        total += funcA(element)
                    });
                    resolve(total)
                },2000)
            })
    }

    function funcC(arr)
    {      
            return new Promise(resolve =>
                {
                    let isFirst = true
                    //a <=> total
                    let total = arr.reduce(async (a,b) =>
                    {
                        if(isFirst) {
                           isFirst = false
                           return (await funcB(a) + await funcB(b))
                        }
                        else {//a <=> total
                            return (a + await funcB(b))
                        }
                    })
                    resolve(total)
                }) 
    }

运行的是：
funcC([["aa","bbb","tyui"],["ccc"],["dfghj","aedtfr"]]).then(x => console.log(x) )

结果是： [object Promise]11

问题是什么？

标签： javascriptasynchronouspromiseasync-awaitreduce

解决方案

这真是令人费解。

  • 不要将业务逻辑放在setTimeout回调中。只解决 promise，然后在 promisethen回调中或在await.
  • 始终将初始值传递给reduce! 这将使它适用于空数组，并且它将消除对那种非常奇怪的isFirst逻辑的需要。
  • total已经是一个承诺。不要不必要地将其包装在new Promise!

这些建议将导致

function funcA(s) { return s.length }

function funcB(arr) {
    return new Promise(resolve => {
        setTimeout(resolve, 2000);
    }).then(() => {
        let total = 0;
        arr.forEach(element => {
            total += funcA(element)
        });
        return total;
    });
}

function funcC(arr) {      
    return arr.reduce(async (a,b) => {
        return await a + await funcB(b)
    }, Promise.resolve(0))
}

但是，reduce并不真正适合异步工作。您应该在 中使用循环方法funcC，并reduce在funcB更适合的地方使用：

async function funcB(arr) {
    await new Promise(resolve => {
        setTimeout(resolve, 2000);
    });
    return arr.reduce((total, element) => total + funcA(element), 0);
}

async function funcC(arr) {
    let total = 0;
    for (const b of arr) {
        total += funcB(b);
    }
    return total;
}

推荐阅读