ES6的promise

一、promise是什么呢

promise是异步编程的一种解决方案，比如在网络请求里面就有异步函数，但如果请求过于复杂时就会出现回调地狱，所以promise应运而生

二、链式编程解释与promise参数说明

链式编程

它的核心就是返回了this，也就是在调用方法完成之后会再执行return this

promise参数说明：

三、promise的基本使用

回调地狱

setTimeout(() => {							/*第一层回调*/
        console.log('hello 1');			
        setTimeout(() => {					/*第二层回调*/
          console.log('hello 2');
          setTimeout(() => {				/*第三次回调*/
            console.log('hello 3');
          }, 2000)
        }, 1500)
      }, 1000);

上面的回调太过生猛，不利于后期维护，也不利于阅读

优雅的promise

new Promise((resolve, reject) => {				/*第一层*/
        setTimeout(() => {
          resolve()				/*跳转到then*/
        }, 1000)
      }).then(() => {
        console.log('hello 1');
        /*因为它本身返回的就是void，而下面又会使用到链式编程，所以这里必须使用return new Promise()*/
        return new Promise((resolve, reject) => { 	/*第二层*/
          setTimeout(() => {
            resolve()
          }, 1500)
        })
      }).then(() => {
        console.log('hello 2');
        return new Promise((resolve, reject) => {	/*第三层*/
          setTimeout(() => {
            resolve()
          }, 2000)
        })
      }).then(() => {
        console.log('hello 3');
      })

使用了promise，虽然代码变长了，但更加有逻辑性，也利于后期维护

四、promise执行过程

new Promise（） =》 执行promise里面的构造函数（1、保存一些状态信息2、执行传入的函数） =》 执行resolve（）或者reject（）函数 =》 执行then或者catch

五、promise的三种状态

pending：等待状态，比如正在网络请求
fulfill：满足状态，会调用resolve，且会回调.then()
reject：拒绝状态，会调用reject，且会回调.catch()

六、promise的另几种种写法

①

new Promise((resolve, reject) => {
        setTimeout(() => {
          resolve('success');
          reject('fail')
        }, 1000)
      }).then(val => {			/*再then里面传递两个参数（函数），分别是成功时与失败时*/
        console.log(val);
      }, err => {
        console.log(err);
      })

②

 new Promise((resolve, reject) => {
        setTimeout(() => {
          resolve('123');
        }, 1000)
      }).then(val => {
        console.log('resolve' + val);
        return Promise.resolve(val + '456')		/*简写*/
      }).then(val => {
        console.log(val);
        return val + '789'						/*是Promise.resolve的简写，在程序运行的时候会自动给它包装上Promise.resolve*/
      }).then(val => {
        console.log(val);
      })

③

new Promise((resolve, reject) => {
        setTimeout(() => {
          reject('123');
        }, 1000)
      }).catch(val => {
        console.log('reject' + val);
        // throw 'errors';
        return Promise.reject(val + '456')			/*简写*/
      }).catch(val => {
        console.log(val);
      })

七、Promise.all

Promise.all([					/*注意这里的参数是数组类型*/
        new Promise((resolve, reject) => {		
          setTimeout(() => {			/*模拟一次网络请求*/
            resolve('123');
          }, 1000)
        }),
        new Promise((resolve, reject) => {
          setTimeout(() => {			/*模拟一次网络请求*/
            resolve('456');
          }, 2000)
        })
      ]).then(results => {
        console.log(results);			/*结果为数组类型*/
      })

Promise.all的作用在于可以 把多个异步请求的结果统一处理而不需要判断异步请求返回的顺序，比如说，某一页面需要两次网络请求，然而并不知道这两次网络请求何时结束，而页面的处理又都需要这两次网络请求的数据，而Promise.all就是干这种事情的

本文只用于个人学习与记录