Promise的链式调用三种写法，Promise.all与式调用

最新推荐文章于 2024-09-18 11:41:39 发布

浅香沉木

最新推荐文章于 2024-09-18 11:41:39 发布

阅读量2.6k

点赞数 6

分类专栏： JS

本文链接：https://blog.csdn.net/Java_53/article/details/117569575

版权

Promise 链式调用 Promise.all

JS 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

Promise的链式调用三种写法：

// 1,Promise原始链式调用
new Promise((resolve, reject) => {
    setTimeout(() => {
        console.log("请求结果：", 1);
        resolve(1);
    }, 1000)
}).then(data => {
    console.log("第一次对结果处理");
    return new Promise((resolve, reject) => {
        resolve(data * 2);
    });
}).then(data => {
    console.log("第二次对结果处理");
    return new Promise((resolve, reject) => {
        resolve(data * 3);
    });
}).then(data => {
    console.log("第三次对结果处理");
    data *= 4;
    console.log("Promise的链式调用结束,最终结果：", data);
}).catch(err => {
    console.log("链式调用中某个环节出现错误！！", err);
})

// 2,Promise的链式简化写法
new Promise((resolve, reject) => {
    setTimeout(() => {
        console.log("请求结果：", 1);
        resolve(1);
    }, 1000)
}).then(data => {
    console.log("第一次对结果处理");
    return Promise.resolve(data * 2);
}).then(data => {
    console.log("第二次对结果处理");
    return Promise.resolve(data * 3);
}).then(data => {
    console.log("第三次对结果处理");
    data *= 4;
    console.log("Promise的链式调用结束,最终结果：", data);
}).catch(err => {
    console.log("链式调用中某个环节出现错误！！", err);
})

// 3,Promise的链式最简化写法
new Promise((resolve, reject) => {
    setTimeout(() => {
        console.log("请求结果：", 1);
        resolve(1);
    }, 1000)
}).then(data => {
    console.log("第一次对结果处理");
    return data * 2
}).then(data => {
    console.log("第二次对结果处理");
    return data * 3
}).then(data => {
    console.log("第三次对结果处理");
    data *= 4;
    console.log("Promise的链式调用结束,最终结果：", data);
}).catch(err => {
    console.log("链式调用中某个环节出现错误！！", err);
})

Promise.all与式调用：

// Promise.all与式调用
Promise.all([
    new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve({
                message: "第一个请求结果",
                num1: 1
            })
        })
    }), new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve({
                message: "第一个请求结果",
                num1: 2
            })
        })
    })

]).then(results => {
    console.log("与式调用结果数组results：", results);
    console.log("对与式调用结果一起处理操作...");
}).catch(err => {
    console.log("Promise.all与式调用错误！！", err);
});