promise的原理和几种使用方法_promise原理

1. promise概念

   Promise 是异步编程的一种解决方案：从语法上讲，promise是一个对象，从它可以获取异步操作的消息；从本意上讲，它是承诺，承诺它过一段时间会给你一个结果，其实是一个构造函数，自己身上有all、reject、resolve，race这几个方法，原型上有then、catch，finally等方法。promise有三种状态： pending(等待态)，fulfiled(成功态)，rejected(失败态)；状态一旦改变，就不会再变。创造promise实例后，它会立即执行。

2. promise.prototytype.then()：promise实例状态改变的回调函数，有两个参数：第一个是成功回调函数，第二个是失败回调函数。他会返回一个全新的promise，因此可以继续then链式调用。

3. promise.prototype.catch()：失败回调函数，状态变为rejected执行。相当于promise. prototytype.then(null/undifined,rejection)，如果promise内发生了错误，但却没有定义catch()，这时运行到这一行代码会报错，但是不会影响到promise后面代码的执行

promise的几种方法：

1.基础用法：

new Promise((resolve, reject) => {
        // resolve 成功的回调
        // reject  失败的回调
        // 成功或者失败只能存在一种状态，不能同事执行两个状态
        resolve('成功')
        reject('失败')
        // then 是获取Promise的resolve, reject状态
    }).then(res => {
        // 成功
        console.log(res);
    }, error => {
        // 失败
        console.log(error);
    })

2.promise.finally()：promise实例无论状态是什么都会执行的函数，finally不接受任何参数。

 const p1 = function () {
            return new Promise((resolve, reject) =>{
                // 失败时
                // reject("失败了")
                //  resolve(2);
                // 成功时
                resolve(2)
                reject("失败了")
            });
        };
        p1().then(res=> {
            console.log(res);
        }).catch(error=>{
            console.log(error);
        }).finally(()=>{
            console.log('无论失败或者成功都会走这个函数');
        })

3.promise.all()：将多个promise实例包装成一个新的promise实例

const p1 = function () {
                    return new Promise((resolve, reject)=>{
                        resolve(1);
                    });
                };
                const p2 = function () {
                    return new Promise((resolve, reject)=>{
                        resolve(2);
                    });
                };
                const p3 = function () {
                    return new Promise((resolve, reject)=>{
                        // reject("失败了")
                        resolve(3);
                    });
                };
 
                // Promise.all 所有封装的Promise都成功才会成功，只要有一个失败就会失败
                let result = Promise.all([p1(), p2(), p3()]).then(results=>{
                    console.log(results);//[1, 2, 3]
                }).catch(error=>{
                    console.log(err);
                    // 当p3的reject("失败了")被解开时控制台会打印失败了
                })
 
 

4.promise.race()：

// race()  把多个封装的promise 组合起来，看谁跑的快
        const p1 = function () {
            return new Promise((resolve, reject)=>{
                setTimeout(() => {
                    resolve(1);
                }, 500)
 
            });
        };
        const p2 = function () {
            return new Promise((resolve, reject)=>{
                setTimeout(() => {
                    resolve(2);
                }, 400)
            });
        };
        const p3 = function () {
            return new Promise((resolve, reject)=>{
                setTimeout(() => {
                    resolve(3);
                }, 600)
            });
        };
        //谁先执行完成就先执行回调，其余的将不会再进入race的任何回调,其余的没有停止，自行执行
        let result = Promise.race([p1(), p2(), p3()]).then(results=>{
            console.log(results);
        }).catch(error=>{
            console.log(error);
        })
 
 
 
 
 

5.promise.any()：

 // 1. 只要有一个实例变成fulfilled，他就会变成fulfilled
        // 2. 只有全部实例状态都变成rejected，它才会变成rejected
  const p1 = function () {
            return new Promise((resolve, reject)=>{  
                resolve(5);
            });
        };
        const p2 = function () {
            return new Promise((resolve, reject)=>{
                reject(2);
            });
        };
        const p3 = function () {
            return new Promise((resolve, reject)=>{ 
                resolve(3);
            });
        };
 
        let result = Promise.any([p1(), p2(), p3()]).then(results=>{
            console.log(results);
            // 5 因为p1成功了，只返回找到的第一个成功的，遇到reject会继续向下寻找
        }).catch(error=>{
            console.log(error);
            // 当三个return返回的都是reject时，控制台打印AggregateError: All promises were rejected
        })

6.promise.allSettled()：等所有实例都返回结果，他的状态就只会变成fulfilled

const p1 = function () {
        return new Promise((resolve, reject) => {
            resolve(1);
        });
    };
    const p2 = function () {
        return new Promise((resolve, reject) => {
            resolve(2);
        });
    };
    const p3 = function () {
        return new Promise((resolve, reject) => {
            reject(3);
        });
    };
 
    // Promise.allSettled无论成功或者失败会把所有的状态返回给results
    // 没有catch
    let result = Promise.allSettled([p1(), p2(), p3()]).then(results => {
        console.log(results);
    })