Promise的理解与使用

Promise是什么

抽象来说：

1、Promise是一门新的技术（ES6规范）

2、Promise是 JS 中进行异步编程的新解决方案

具体来说：

1、从语法上说：Promise是一个构造函数

2、从功能上说：Promise对象用来封装一个异步操作并可以获取其成功 / 失败 的结果值

Promise的状态改变

Promise有三个状态

1、pending（未决定的）：Promise对象还未获取到成功/失败结果值时是pending状态

2、fulfilled（resolved 成功的）：Promise对象获取到成功结果值（也就是调用了 resolve（）函数），状态从 pending → fulfilled

3、rejected（失败的）；Promise对象获取到失败结果值（也就是调用了reject（）函数）状态从pending → rejected

Promise的API

1、Promise构造函数：Promise(excutor) { }

（1）excutor 函数：执行器（resolve，reject）=> { }

（2）resolve 函数：内部定义成功时我们调用的函数 value => { }

（3）reject 函数：内部定义失败时我们调用的函数 reason => { }

说明：excutor 会在 Promise 内部立即调用，异步操作在执行器中执行

2、Promise.prototype.then方法：(onResolved,onRejected)=>{ }

  (1）onResolved 函数：成功的回调函数 （value）=> { }

（2）onReject 函数：失败的回调函数 （reason) => { }

说明：指定用于得到成功value 的成功回调和用于得到失败的reason的失败回调。

3、Promise.prototype.catch方法：（onRejected）=>{ }

（1）onRejected 函数：失败的回调函数 （reason) => { }

说明：then()方法的语法糖，相当于then(undefined,onRejected).，该方法只能返回失败的回调

4、Promise.resolve方法：（value）=> { }

（1）value：成功的数据或 Promise 对象

说明：当value 为非Promise对象时，返回的结果为成功Promise对象；当value为Promise对象时，返回的结果取决于该Promise对象返回的是成功还是失败的结果。

5、Promise.reject方法：（reason）=> { }

（1）reason：失败的原因

说明：不论reason是失败的数据还是Promise对象，返回的只会是失败。若reason非Promise对象，返回的则是reason的值，若reason为Promise对象，则返回的失败结果值是该Promise对象返回的值（不论是成功还是失败的结果值）。

6、Promise.all方法：（promises）=> { }

（1）promises：包含 n 个promise的数组

说明：返回一个新的 Promise 对象，只有数组里的所有Promise 都成功，才成功，且结果值为所有 Pomise对象成功的值，若有一个Promise失败，则只返回那个失败的PromiseResult。

7、Promise.race方法：（promises）=> { }

（1）：promises：包含 n 个promise的数组

说明：返回一个新的数组，第一个完成的Promise的结果状态就是最终的结果状态。

Promise的几个关键问题

1、如何改变 promise 的状态

（1）调用 resolve（）函数；

（2）调用 reject（）函数；

（3）抛出异常：throw ‘error’；

2、一个Promise指定多个成功/失败的回调，都会调用吗？

当Promise改变为对应的状态时都会调用。

3、改变 Promise 的状态和指定回调函数谁先谁后？

（1）都有可能，正常情况是先指定回调再改变状态，但是也可以先改状态再指定回调

（2）如何先改变状态再指定回调？

        ①  在执行器（excutor）中直接调用resolve（）/reject（）函数

        ②  延迟更长时间才调用 then（）方法

（3）什么时候才能得到数据？

        ①  如果先指定回调，那当状态发生改变时，回调函数就会调用，得到数据

        ②  如果先改变状态，那当指定回调时，回调函数就会调用，得到数据。

4、Promise.then()返回的新的Promise的结果状态由什么决定？

（1）简单表达：由 then（）指定的回调函数执行的结果决定

（2）详细表达：

        ①  如果抛出异常，新的 Promise 变为 rejected，reason为抛出的异常

        ②  如果返回的是非 Promise 的任意值，新的 Promise 变为 fulfilled，value为返回的值

        ③  如果返回的是另一个新 Promise ，此 Promise 的结果就等于 新Promise 的结果。

5、Promise如何串连多个操作任务？

（1）Promise 的 then（）返回一个新的 Promise，可以开城 then（）的链式调用

（2）通过 then（）的链式调用串连多个同步/异步任务

let p = new Promise((resolve,reject)=>{
    setTimeout(()=>{
        resolve('ok);
    },1000)
})

p.then(value=>{
    return new Promise((resolve,reject)=>{
        resolve('Success');
    })
}).then(value=>{
    console.log(value)
}).then(value=>{
    console.log(value)
})

 6、Promise异常穿透？

（1）当使用 Promise 的 then 链式调用时，可以在最后指定失败的回调

（2）前面任何操作出了异常，都会传到最后失败的回调中处理

let p = new Promise((resolve,reject)=>{
    setTimeout(()=>{
        resolve('ok);
    },1000)
})

p.then(value=>{
    return new Promise((resolve,reject)=>{
        resolve('Success');
    })
}).then(value=>{
    console.log(value)
}).then(value=>{
    console.log(value)
}).catch(reason=>{
    console.log(reason)
})

7、中断 Promise 链

（1）当使用 Promise 的 then 链式调用时，在中间间断，不再调用后面的回调函数

（2）办法：在回调函数中返回一个 pending 状态的Promise对象

let p = new Promise((resolve,reject)=>{
    setTimeout(()=>{
        resolve('ok);
    },1000)
})

p.then(value=>{
    return new Promise(()=>{}) // pending 状态的Promise
}).then(value=>{
    console.log(value)
}).then(value=>{
    console.log(value)
}).catch(reason=>{
    console.log(reason)
})

Promise的工作流程

说明：当我们新建一个 Promise时，我们得到的是处于 pending 状态的 Promise，接着执行异步操作，若是执行成功 ，则执行 resolve（）函数，promise的状态 PromiseState 从pending → fulfilled

若执行失败，则执行 reject（）函数，Promise的状态从 PromiseState 从 pending → rejected；执行回调函数 then（）方法，若成功执行 onResolved（）函数，若失败执行 onRejected（）函数，最后返回一个新的 Promise。