javascript - 使用 await Promise.all 获取解析对象的更简洁方法

Question

考虑一堆 promise - result1, result2, results3等等。
我等待等待 Promise.all然后处理解析的对象。不再需要 promise 。
我可以像这样使用解构赋值:-

[result1, result2, result3] = await Promise.all([result1, result2, result3]);

但是那里有重复([result1, result2...] 使用了两次)并且有大量 promise 的错误已经成熟。
有没有更好的办法？

Answer 1

您可以有一个使用对象而不是数组的实用程序函数，类似于以下内容:

async function allKeyed(promises) {
    // Get an array of [name, value] pairs for the object's properties
    const entries = Object.entries(promises);
    // Wait for any thenables/promises in the values to settle
    const values = await Promise.all(entries.map(([_, value]) => value));
    // Build an object from those result values; this works because the
    // array from `Promise.all` is in the same order as the array of
    // values we gave it above.
    const result = Object.fromEntries(entries.map(([key], index) => {
        return [key, values[index]];
    }));
    return result;
}

然后它会是这样的:

const {a, b, c} = await allKeyed({
    a: promise1,
    b: promise2,
    c: promise3,
});

...但使用有意义的名称而不是 a , b , 和 c . :-)
现场示例:

async function allKeyed(promises) {
    // Get an array of [name, value] pairs for the object's properties
    const entries = Object.entries(promises);
    // Wait for any thenables/promises in the values to settle
    const values = await Promise.all(entries.map(([_, value]) => value));
    // Build an object from those result values; this works because the
    // array from `Promise.all` is in the same order as the array of
    // values we gave it above.
    const result = Object.fromEntries(entries.map(([key], index) => {
        return [key, values[index]];
    }));
    return result;
}

function fetchSomething(value) {
    return new Promise(resolve => {
        setTimeout(() => {
            console.log(`fulfilling with ${value}`);
            resolve(value);
        }, Math.floor(Math.random() * 1000));
    });
}

(async () => {
    const {a, b, c} = await allKeyed({
        a: fetchSomething("ayy"),
        b: fetchSomething("bee"),
        c: fetchSomething("see"),
    });

    console.log({a, b, c});
})()
.catch(error => console.error(error));

在问题中，您在 Promise.all 之前将 promise 分配给变量对 promise (输入 Promise.all)及其履行值(在解构中)使用相同的名称，如下所示:

// ...assign promises to `resultX`, then:
({result1, result2, result3} = await allKeyed({result1, result2, result3}));

我把它们放在那里，但这也能正常工作:

// ...assign promises to `resultX`, then:
({result3, result1, result2} = await allKeyed({result1, result2, result3}));

现场示例:

async function allKeyed(promises) {
    // Get an array of [name, value] pairs for the object's properties
    const entries = Object.entries(promises);
    // Wait for any thenables/promises in the values to settle
    const values = await Promise.all(entries.map(([_, value]) => value));
    // Build an object from those result values; this works because the
    // array from `Promise.all` is in the same order as the array of
    // values we gave it above.
    const result = Object.fromEntries(entries.map(([key], index) => {
        return [key, values[index]];
    }));
    return result;
}

function fetchSomething(value) {
    return new Promise(resolve => {
        setTimeout(() => {
            console.log(`fulfilling with ${value}`);
            resolve(value);
        }, Math.floor(Math.random() * 1000));
    });
}

(async () => {
    let result1 = fetchSomething("one");
    let result2 = fetchSomething("two");
    let result3 = fetchSomething("three");
    ({result3, result1, result2} = await allKeyed({result1, result2, result3}));

    console.log({result1, result2, result3});
})()
.catch(error => console.error(error));