promise

Promsie

通俗来说，Promise就是一个承诺，例如，我承诺明年要赚1百万，then方法中的onFulfilled就是承诺完成后要做的事，onRejected就是承诺失败要做的事情，而Promise构造函数中的resolve用来手动完成这个承诺，reject用来手动让承诺失败

overview

1. 构造函数

   new Promise((resolve, reject) => {})
   

2. 实例方法（原型对象上的方法）

   Promise.prototype.then(onFulfilled, onRejected)
   Promise.prototype.catch(onRejected)
   

3. 静态方法

   Promise.all()
   Promsie.race()
   Promsie.resolve()
   Promsie.reject()
   

4. 状态

   • pedding（因为是在等待状态的改变，所以是ing）
   • fulfilled（因为是setted，表示已经完成的，所以需要ed）
   • rejected（因为是setted，表示已经完成的，所以需要ed）

构造函数

new Promise((resolve, reject) => {
    resolve(val)
})

1. 接受的参数

   接受的参数是一个function，成为executor，promise会往这个executor注入两个函数作为参数

    - resolve
   
        当调用resolve，表示的是把Promise的状态从pedding变成fulfilled，那么接下去就会执行then中注册的onFulfilled方法
    - reject
   
        当调用reject，表示的是把Promise的状态从pedding变成rejected，那么接下去就会执行then中注册的onRejected方法
   

2. 返回的结果

   返回的是一个promise实例，状态是pedding

实例方法（原型对象上的方法）

1. then

   then方法接受两个参数，onFulfilled和onRejected，返回的是一个新的Promise实例，例如：

   const p = new Promise()
   p.then(val => val) // 如果p的状态是fulfilled，相当于 Promise.resove(val)
   

   此时的then返回的是一个新的promise对象，如果p的状态是fulfilled，那么then的onFulfilled函数val => val就会被执行，然后返回一个状态是fulfilled的promise对象，相当于Promise.resolve(val)，这也是then链式调用的关键

2. catch

   说到catch，就要说到promise中的错误处理情况，promise内部会捕获错误，主要有三种情形：

    ```
    // 写法一
    var promise = new Promise(function(resolve, reject) {
        try {
            throw new Error('test');
        } catch(e) {
            reject(e);
        }
    });
    promise.catch(function(error) {
        console.log(error);
    });
    // 写法二
    var promise = new Promise(function(resolve, reject) {
        reject(new Error('test'));
    });
    promise.catch(function(error) {
        console.log(error);
    });
    ```
   
    1. 同步的错误，在promise发生的错误会被promise捕获，但是不会有反应，因为错误没有被处理，但是在chrome中会抛错
   
        ```
        new Promise((resolve, reject) => {
            throw new Error() // 不会有反应，因为error被捕获但是没有被处理，chrome的实现不同
        })
        ```
    2. 异步的错误，异步发生的错误不在当前的callstack，当前同步的代码已经执行完，没有发现错误，所以异步的错误无法捕获，会抛错
   
        ```
        new Promise((resolve, reject) => {
            setTimeout(() => {
                throw new Error()
            }, 0)
        })
        ```
    3. 使用reject捕获错误，无论异步还是同步的都能捕获，然后交给catch处理，注意错误是会冒泡，所以一般在最后使用catch捕获错误
   

静态方法

1. Promise.resolve()

   接受的参数有三种情况：

    1. value
   
        返回一个状态为fulfilled的promise对象，value是传递给onFulfilled的参数
    2. promise
   
        Promise.resolve(promise)返回的实例会"follow"promise的状态
   
        ```
        const p1 = new Promise((resolve, reject) => {
            setTimeout(() => resolve('hello'), 1000)
        })
        const p2 = new Promise((resolve, reject) => {
            resolve(p1)
        })
        p2.then(val => console.log(val, 2))
        p1.then(val => {
            console.log(p1)
            console.log(p2)
            console.log(val, 1)
        })
        ```
        结果：过1s后，先打印出p1，是一个promise对象，状态是resolved，然后打印p2，状态是pedding，然后打印hello，1，然后打印hello，2
   
        有这样的结果是因为，传递给p2的resove的参数是一个promise，p1，那么p2就会"follow"p1的状态，但当p1的状态改变后，p2的状态才会改变，而且会先执行挂载在p1上回调，然后再执行挂载在p2上的回调函数
    3. thenable
   
        在MDN中对Promise.resolve中的介绍中说到，如果参数是一个thenable的对象，也就是拥有then方法的对象，那么Promise.resolve(thanable)返回的Promise实例会"follow"这个thenable对象的状态，简单的来说，就是跟随thenable对象状态的改变而改变
   
        ```
        var p = Promise.resolve({
            then: (onFulfilled, onRejected) => {
                setTimeout(onRejected, 1000, new Error())
                set
            }
        })
        p.then(val => console.log(val)).catch(error => console.log(error))
        ```
        当then中的onFulfilled方法被调用的时候，表示之前的promise实例的状态是fulfilled，所以then会返回一个新的promise实例，状态是fulfilled，相当于Promise.resolve(val)