【ES6】Promise.race的用法

Promise.race()方法同样是将多个 Promise 实例,包装成一个新的 Promise 实例。

javascript 复制代码
const p = Promise.race([p1, p2, p3]);

上面代码中,只要p1、p2、p3之中有一个实例率先改变状态,p的状态就跟着改变。那个率先改变的 Promise 实例的返回值,就传递给p的回调函数。

Promise.race()方法的参数与Promise.all()方法一样,如果不是 Promise 实例,就会先调用下面讲到的Promise.resolve()方法,将参数转为 Promise 实例,再进一步处理。

javascript 复制代码
    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的值

相关推荐
网络点点滴16 小时前
标签的ref属性
前端·javascript·vue.js
Cobyte18 小时前
17. Vue3 业务组件库按需加载的实现原理
前端·javascript·vue.js
谢尔登18 小时前
原型理解从入门到精通
开发语言·javascript·原型模式
粥里有勺糖18 小时前
视野修炼-技术周刊第127期 | Valdi
前端·javascript·github
码上成长18 小时前
Vue Router 3 升级 4:写法、坑点、兼容一次讲透
前端·javascript·vue.js
qq_3985865420 小时前
浏览器中内嵌一个浏览器
前端·javascript·css·css3
*小雪21 小时前
uniapp写H5授权登录及分享,返回到目标页面
开发语言·javascript·uni-app
性野喜悲21 小时前
ts+uniapp小程序时间日期选择框(分开选择)
前端·javascript·vue.js
你不是我我1 天前
【Java 开发日记】SQL 语句左连接右连接内连接如何使用,区别是什么?
java·javascript·数据库
一壶浊酒..1 天前
请求签名(Request Signature)
javascript