前端异步处理promise-理解与应用

原理：

        promise的底层原理其实也是回调函数，只是在使用上一直通过 then方法的链式调用，使得多层的回调嵌套看起来变成了同一层的，书写上以及理解上会更直观和简洁一些。

状态：

        promise有三个状态：等待（pending）、成功（resolve）、失败（reject）。

特点：

1.promise的状态是不可逆的，

2.promise可以通过.then()方法进行链式调用，每个then方法可以接收两个回调函数作为参数，对应操作成功和操作失败的情况。

3.避免回调地狱

用法：

let promiseFunc=new Promise(resolve,reject){
    let x=0;
    //异步方法
    setTimeout(()=>{
        x++;
        if(x===10){
            resolve(x)
        }else{
            reject(x)
        }
    },200)
},
//链式调用
promiseFunc.then((res,rej)=>{
    console.log(res);//符合条件
    console.log(rej);//不符合条件
}).catch((err)=>{
     console.log(err);//捕获异常
}).finally(()=>{
    console.log("始终会执行")//不管then catch 都会执行finally
})
//async/await调用
async function getPromise(){
    let res=await promiseFunc();
    console.log(res)
}

方法：

1、Promise.all(arr)     参数为数组 作用是将多个promise实例包装成一个新的promise实例，多个实例中只有全部实例状态都为成功后，新实例状态才会变成 成功。

let promiseFunc1=new Promise(resolve,reject){
    let x=0;
    //异步方法
    setTimeout(()=>{
        x++;
        if(x===10){
            resolve(x)
        }else{
            reject(x)
        }
    },200)
},
let promiseFunc2=new Promise(resolve,reject){
    let x=0;
    //异步方法
    setTimeout(()=>{
        x++;
        if(x===10){
            resolve(x)
        }else{
            reject(x)
        }
    },200)
},
let promiseFunc3=new Promise(resolve,reject){
    let x=0;
    //异步方法
    setTimeout(()=>{
        x++;
        if(x===10){
            resolve(x)
        }else{
            reject(x)
        }
    },200)
},
let newPromise=Promise.all([promiseFunc1,promiseFunc2,promiseFunc3])

2、Promise.race(arr)  参数为数组 作用是将多个promise实例包装成一个新的promise实例，新实例的状态取决于第一个改变状态的实例

3、Promise.any(srr) 参数为数组 作用是将多个promise实例包装成一个新的promise实例，多个实例中只要有一个状态为成功，新实例的状态就为成功

4、Promise.allSettled(arr) 参数为数组 作用是将多个promise实例包装成一个新的promise实例，当所有的实例都执行完之后不管成功还是失败，新实例的状态就必然为成功