Promise--相关的API

Posted 2021-08-20 Z && Y

1. Promise相关的API

---

1.1 Promise 构造函数

Promise 构造函数: Promise (excutor) {}

• (1) executor 函数: 执行器 (resolve, reject) => {}
• (2) resolve 函数: 内部定义成功时我们调用的函数 value => {}
• (3) reject 函数: 内部定义失败时我们调用的函数 reason => {}

说明:

executor 会在 Promise 内部立即同步调用,异步操作在执行器中执行

---

1.2 then() 方法

Promise.prototype.then 方法: (onResolved, onRejected) => {}

• (1) onResolved 函数: 成功的回调函数 (value) => {}
• (2) onRejected 函数: 失败的回调函数 (reason) => {}

说明:

指定用于得到成功 value 的成功回调和用于得到失败 reason 的失败回调
返回一个新的 promise 对象

---

1.3 catch()方法

Promise.prototype.catch 方法: (onRejected) => {}

• (1) onRejected 函数: 失败的回调函数 (reason) => {}

说明:

说明: then()的语法糖, 相当于: then(undefined, onRejected)

1.3.1 捕获异常

第一种方式，使用then（onResolved, onRejected）

    let flag = false;
    new Promise((resolve, reject) => {
        if (flag) {
            // 模拟异步
             setTimeout(() => {
                resolve(flag);
            }, 0)
        } else {
            // 模拟异步
            setTimeout(() => {
                reject(flag);
            }, 0)
        }
    }).then(value => {
        console.log('因为flag为' + value + '所以成功');
    }, reason => {
        console.warn('因为flag为' + reason + '所以失败');
    })

第二种方式，使用catch

    let flag = false;
    new Promise((resolve, reject) => {
        if (flag) {
        	// 模拟异步
            setTimeout(() => {
                resolve(flag);
            }, 0)
        } else {
            // 模拟异步
            setTimeout(() => {
                reject(flag);
            }, 0)
        }
    }).then(value => {
        console.log('因为flag为' + value + '所以成功');
    }).catch(error => {
        console.warn('因为flag为' + error + '所以失败');
    });

说明：

如果已经使用了第一种方式去捕获异常，那么则不会执行catch语句，catch做了单独的封装,其内部的实现也是由then()方法实现的

---

1.4 resolve()方法

Promise.resolve 方法: (value) => {}

• (1) value: 成功的数据或 promise 对象

说明:

返回一个成功/失败的 promise 对象

如果传入的参数为 非Promise类型的对象, 则返回的结果为成功promise对象

    console.log(Promise.resolve("Success"))

如果传入的参数为 Promise 对象, 则参数的结果决定了 resolve 的结果

    console.log(Promise.resolve(new Promise(resolve => {
        resolve("Success");
    })))

    console.log(Promise.resolve(new Promise((resolve, reject) => {
        // 模拟异步请求, 否则游览器会认为没有处理异常
        setTimeout(() => {
            reject("failed");
        }, 0)
    })).catch(error => {
        console.warn(error)
    }))

---

1.5 reject()方法

Promise.reject 方法: (reason) => {}

• (1) reason: 失败的原因

说明:

和resolve()方法类似，只是不管传入什么都返回一个失败的 promise 对象（即使是传入一个成功的Promise对象也返回失败的Promise对象）

---

1.6 all()方法

Promise.all 方法: (promises) => {}

• (1) promises: 包含 n 个 promise 的数组

说明:

返回一个新的 promise，如果数组全为成功的Promise对象, promise对象的值为这个数组，promise对象的值为第一个失败的Promise对象， 只有所有的 promise 都成功才成功, 只要有一个失败了就直接失败。

示例:

    let p1 = Promise.resolve("Success 01");
    let p2 = Promise.resolve("Success 02");
    let p3 = Promise.resolve("Success 03");
    console.log(Promise.all([p1, p2, p3]));

    let p1 = Promise.resolve("Success 01");
    let p2 = Promise.reject("Failed 02");
    let p3 = Promise.reject("Failed 03");
    console.log(Promise.all([p1, p2, p3]));

---

1.7 race()方法

Promise.race 方法: (promises) => {}

• (1) promises: 包含 n 个 promise 的数组

说明:

返回一个新的 promise, 第一个完成的 promise 的结果状态就是最终的结果状态。可以理解为赛跑，冠军（结果）就是第一个到达终点的人。

示例:

    let p1 = new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve('Success 01');
        }, 3000);
    });
    let p2 = new Promise((resolve, reject) => {
        setTimeout(() => {
            reject('Failed 01');
        }, 4000);
    }).catch(error => {
        console.warn(error);
    });
    let p3 = new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve('Success 02');
        }, 2000);
    });

    //因为p3第一个改变状态 所以返回Promise对象的值是P3 = > Success 02
    console.log(Promise.race([p1, p2, p3]))

---

---