javascript - 将 Promise 分配给变量并在链中返回与仅返回 Promise 调用不同吗？

Question

这两个链的处理方式有什么不同或者处理方式相同吗？使用其中一种比另一种有什么好处吗？

我尝试了这两个调用，它们都返回相同的结果 (32) - 我的假设是它们以相同的方式处理，但我有一个 friend 告诉我它们的工作方式不同。

const getNewDataPromise = num => new Promise( (resolve, reject) => {
    typeof num === 'number' ? resolve(num * 2) : 
        reject(`${num} is not a number -- input must be a numeric value.`);
});

getNewDataPromise(2).then( data => {
    const nowEight = getNewDataPromise(data);
    return nowEight;
}).then( data => {
    const nowSixteen = getNewDataPromise(data);
    return nowSixteen;
}).then( data => {
    const nowThirtyTwo = getNewDataPromise(data);
    return nowThirtyTwo
}).then( data => {
    console.log(data);
}).catch( err => {
    console.log(err);
});

getNewDataPromise(2).then( data => {
    return getNewDataPromise(data);
}).then( data => {
    return getNewDataPromise(data);
}).then( data => {
    return getNewDataPromise(data);
}).then( data => {
    console.log(data);
}).catch( err => {
    console.log(err);
});

Answer 1

就结果而言，您的两个版本之间完全没有区别。第一个只是创建一个中间局部变量，它不会影响结果或并行性或您的 friend 断言的任何内容。

您的第二个更简洁、同样清晰，是我在你们两个之间的偏好。

<小时/>

另一种选择是使用async/await，这对于异步操作序列特别有用:

async function run() {
    try {
        let data = await getNewDataPromise(2);
        data = await getNewDataPromise(data);
        data = await getNewDataPromise(data);
        data = await getNewDataPromise(data);
        console.log(data);
    } catch(e) {
        console.log(e);
    }
}

或者，如果您真的只是一遍又一遍地调用相同的函数，您也可以使用循环，这会减少重复性(更干燥):

async function run() {
    try {
        let data = 2;
        for (let i = 0; i < 4; i++) {
            data = await getNewDataPromise(data);
        }
        console.log(data);
    } catch(e) {
        console.log(e);
    }
}