ES6的Promise的使用场景 --Promise.all(),Promise.race()

最新推荐文章于 2025-03-10 16:37:49 发布

ai_feng123

最新推荐文章于 2025-03-10 16:37:49 发布

阅读量1.2k

点赞数

分类专栏： Es6 文章标签： ES6 Promise

本文链接：https://blog.youkuaiyun.com/ai_feng123/article/details/98337661

版权

Es6 专栏收录该内容

6 篇文章

订阅专栏

本文介绍了ES6中的Promise在处理异步操作时的两个重要方法：Promise.all()和Promise.race()。当需要等待多个Promise都成功完成后再执行后续操作时，可以使用Promise.all()；而在关心哪个Promise先完成，而不是所有都完成的情况下，Promise.race()则是更好的选择。文中还包含相关的代码示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

场景：当两个毫无相关的promise执行完成之后，才进行下一步动作

两个Promise全部执行成功就用Promise.all(),

如果看情况而定，以第一个Promise的结果来进行判定那使用Promise.race()

上传代码：

 <script>
        // 场景：当两个promise毫无相关需要全部执行成功之后，才做下一个动作
        const moviePromise = new Promise((reslove, reject) => {
            setTimeout(() => {
                reslove({ name: '摔跤吧！爸爸', rating: 9.2, year: 2016 })
            }, 2000);

        })
        const usersPromise = new Promise((resolve, reject) => {
            setTimeout(() => {
                resolve(['mojobo', 'vanpelt', 'wycats']);
            }, 1000);
        })
        // all的方法为两者promised都为reslove,才执行then的内容
        // 但是如果其中一个promise的返回结果为reject，执行catch里的内容
        Promise.all([moviePromise, usersPromise]).then(resposes => {
            console.log(resposes);
            // resposes为一个为对象，一个为数组
        }).catch(error => {
            console.error(error);
        });
        // race方法执行的结果由第一个promise的结果来决定的，
        // 遇到reject就直接执行catch，遇到resolve就直接执行then
        Promise.race([moviePromise, usersPromise]).then(resole => {
            // 如果 moviePromise 返回的是reject内容，usersPromise为resolve
            // 返回的resole为一个数组。因为先执行为usersPromise
            // 如果 usersPromise 返回的是reject内容，usersPromise返回是第一个，注意执行毫秒。 
            //moviePromise 为resolve
            // 应该执行catch的内容
            console.log(resole);
        }).catch(error => {
            console.error(error);
        })
    </script>