ES6 Promise.race() 方法详解与使用示例

Promise.race() 基本定义

Promise.race() 方法的作用是将多个 Promise 实例封装成一个新的 Promise 实例。

const p = Promise.race([p1, p2, p3]);

在上述代码中，只要 p1、p2 或 p3 中有一个实例率先改变状态，新 Promise p 的状态就会随之改变。那个率先改变的 Promise 实例的返回值，将直接传递给 p 的回调函数。

参数处理机制

Promise.race() 方法的参数处理方式与 Promise.all() 类似。如果传入的参数不是 Promise 实例，系统会先调用 Promise.resolve() 方法将其转换为 Promise 实例，然后再进行后续处理。

    let x = 10;
    let p1 = new Promise((resolve) => {
       setTimeout(()=>resolve("p1 hello" + x),2000);
    })
        .then((res) => {
            console.log(`p1 then 输出${res}`);
            return res;
        });
    let p2 = new Promise((resolve) => {
        setTimeout(()=> resolve("p2 hello" + x),2000);;
    })
        .then((res) => {
            console.log(`p2 then 输出${res}`);
            return res;
        });
    let p3 = new Promise((resolve) => {
        setTimeout(()=>resolve("p3 hello" + x),2000);;
    })
        .then((res) => {
            console.log(`p3 then 输出${res}`);
            return res;
        });
    let p4 = new Promise((resolve) => {
        setTimeout(()=>resolve("p4 hello" + x),2000);;
    })
        .then((res) => {
            console.log(`p4 then 输出${res}`);
            return res;
        });
    Promise.race([p1, p2, p3, p4])
        .then(result => console.log(result))
        .catch((e) => {
            console.log("f*cking man 报错了");
            console.log(e);
        });

最终输出结果中，仅会显示最先改变状态的那个 Promise 的返回值。

至此，关于 ES6 Promise.race() 用法的详细介绍已完毕。如需了解更多相关内容，建议查阅本站过往文章或继续浏览后续文章，感谢大家的支持！