Promise

什么是promise

promise是一个对象，它代表了一个异步操作的最终完成或者失败

promise产生的原因

promise的诞生是为了解决回调地狱，常见的回调地狱：Ajax的并行与串行

• Ajax串行：只有第一个请求成功才能执行第二个，第二个成功才能执行第三个...最后一个成功后才能拿到每一次的请求的所有数据

    $.ajax({
        url:'/api1/',
        success:function(result){
           $.ajax({
               url:'/api2',
               success: result=>{
                   $.ajax({
                       url:'/api3',
                       success: result=>{
                           console.log(result);
                       }
                   })
               }
           })
    }
    })

• Ajax的并行：三个请求可以同时发送，但需要等到所有请求成功从能做一件事情

    var count = 0;
    function func(){
        console.log('已完成')
    }
    function test(){
       if(count>=3){
           func();
       }
    }
    $.ajax({
        url:'/api1/',
        success: result=>{
            count++;
           test();
        }
    })
    $.ajax({
        url:'/api2/',
        success: result=>{
            count++;
            test();
        }
    })
    $.ajax({
        url:'/api3/',
        success: result=>{
            count++;
            test();
        }
    })

Promise的创建

Promise 对象是由关键字 new 及其构造函数来创建的。该构造函数会把一个叫做“处理器函数”（executor function）的函数作为它的参数。

• new promise的时候就会把executor执行
• promise会给executor传递两个参数resolve()，reject()
  • resolve(): 它执行代表promise处理的异步事情是成功的，并把promise的状态改为fulfillde(resolved)
  • reject(): 它执行代表promise处理的异步事情是失败的，并把promise的状态改为rejected
• executor函数中放的是当前要处理的异步操作。

    let promiseExamp =new Promise((resolve,reject)=>{
        //一般存放的是即将要处理的异步任务，任务成功我们执行resolve，任务失败执行reject
        setTimeout(()=>{
            if(Math.random()<0.5){
                reject('呵呵)
            }
            resolve('哈哈')
        },1000)
    });

Promise的三种状态

• pending: 初始状态（new promise后的状态）
• fulfilled(resolved): 成功状态（在executor函数中把resolve执行，就告知promise当前异步操作是成功的）
• rejected： 失败状态（在executor函数中把reject执行，就告知promise当前异步操作是失败的）

Promise.prototype

• then: 设置成功或失败后执行的方法（成功或失败都可以设置，也可以只设置一个）

  pro.then([success],[error])
  pro.then([success])
  pro.then(null,[error])

• catch: 设置失败后执行的方法
• finally： 不论成功还是失败都能执行的方法

promise的执行流程

    let promiseExamp =new Promise((resolve,reject)=>{
        //一般存放的是即将要处理的异步任务，任务成功我们执行resolve，任务失败执行reject
        setTimeout(()=>{
            if(Math.random()<0.5){
                reject('呵呵')
            }
            resolve('哈哈')
        },1000)
    });
    promiseExamp.then(function success(result){
         console.log(result);
    },function error(reason){
        console.log(reason);
    })

链式写法

执行then/catch/finally返回的结果是一个全新的promise实例，所以可以链式写下去：下一个then中哪个方法被执行，由上一个then中某个方法执行的结果来决定（then中某个方法能够正常执行，新的promise实例的状态为fulfilled）,上一个then中某个方法的返回值会传递给下一个then的某一个方法

    new Promise((resolve,reject)=>{
        resolve(100);
    }).then(result=>{
        console.log(result);
    }).catch(error=>{
        console.log(error)
    })
    //这种写法的优点是：当then方法在执行过程报错，这个时候会让then创建的promise实例变为失败状态，并且把报错的原因修改此promise实例的value值。

    new Promise((resolve,reject)=>{
        resolve(100);
    }).then(result=>{
        console.log(result);  //100
        return result*10;
    }).catch(error=>{
        console.log(error);
        return error/10
    }).then(A=>{
        console.log('A='+A);  //A:1000
    },B=>{
        console.log('B='+B);
    })

如果当前promise实例的状态确定后，都会到对应的then中找方法，如果then中没有对应的这个方法，则会向下顺延（顺延的原因：上一个then中没有成功的函数promise内部会帮我们自动创建一个成功的函数，让其执行后的状态还是fulfilled)

如果一个方法中返回的是一个新的promise实例，它会按照这个实例的最终状态和结果，决定下一个then中执行谁。

    new Promise((resolve,reject)=>resolve(x)).then(x=>{
        return new Promise();
    })

Promise常见的方法

1. promise.all()

promise.all([promise1,promise2,...])

• All中存放的是多个promise实例
• 这个方法返回一个新的promise对象
• 当参数列表中所有的promise实例的状态都为fulfilled,让新的实例状态也变为fulfilled，并且把所有promise成功获取的结果，存储为一个数组（顺序和最开始编写参数的顺序一致），让新的实例的valve值等于这个数组。
• 只要有一个状态为rejected,那么新的实例状态就为rejected
• 都成功才会通知then中第一个方法执行，只要有一个失败就会通知then中第二个方法或catch中方法执行

2. promise.race()

看哪个promise状态最先处理完（成功或失败），以最先处理完的为主