Promise学习笔记

2018-06-10 本文已影响0人罂粟1995

什么是Promise？

Promise是es6新增的异步编程的一种解决方案，是es6的原生对象。
它有三种状态：

pending 进行中
resolved 已完成
rejected 已失败
当Promise的状态由pending转变为resolved时，会执行相应的方法，并且状态一旦改变，就无法再次改变状态。

用法

用函数包装异步操作，返回Promise对象：

       function run1(){
          var p = new Promise((resolve,reject)=>{
            //这里做一些异步操作
            setTimeout(()=>{
              console.log('第一个run');
              resolve('第一个run已完成');//resolve代表异步操作执行成功后的回调函数
            },10000)
          });
          return p;
        }

        function run2(){
          var p = new Promise((resolve,reject)=>{
            //这里做一些异步操作
            setTimeout(()=>{
              console.log('第二个run');
              resolve('第二个run已完成');//resolve代表异步操作执行成功后的回调函数
            },10000)
          });
          return p;
        }

链式操作：

        run1().then((data)=>{
          //then中放的语句是等run执行完毕后才执行的
          console.log(data);//这个data是resolve(xxx)中传入的xxx
          return run2();//这里run2的返回值也是一个Promise对象，它的resolve会传给下一个then
        }).then((data)=>{
          console.log(data);
          return "结束了";//也可以直接把数据传给下一个then
        }).then((data)=>{
          console.log(data);//接收到上一个then return的数据
        })

reject怎么用？
resolve是已完成后的回调函数，reject是已失败后的回调函数。
reject就是把Promise的状态置为rejected，然后在then中捕捉到，或者用catch捕捉，执行“失败”的回调。
把代码改为：

        function run1(a){
          var p = new Promise((resolve,reject)=>{
            //这里做一些异步操作
            setTimeout(()=>{
              console.log('第一个run');
              if(a === 'reject'){
                reject('第一个run已失败');//reject代表异步操作执行失败后的回调函数
              }else{
                resolve('第一个run已完成');//resolve代表异步操作执行成功后的回调函数
              }
            },10000)
          });
          return p;
        }

       run1('reject').then((data)=>{
          console.log('resolved');
          console.log(data);
        },(reason)=>{//then的第二个参数捕捉reject
          console.log('rejected');
          console.log(reason);
        })

或者用catch来捕捉reject并制定reject的回调：

       run1('reject').then((data)=>{
          console.log('resolved');
          console.log(data);
        }).catch((reason)=>{
          console.log('rejected');
          console.log(reason);
        })

用catch的好处是：resolve回调抛出异常时，不会报错卡死JS，而是会进到这个catch方法中。

all的用法：
Promise.all接收一个函数数组参数，里面的值最终都返回Promise对象。数组中的异步操作并行执行，等它们都执行完后才会进到then里面，all会把所有的异步操作的结果放进一个数组中传给then;如果执行失败，则返回最先被reject的结果值。

Promise.all([run1(),run2(),run3()]).then((result)=>{
     console.log(result);
})

race的用法：
all的执行顺序是按数组下标先后执行，但race是哪个执行得快先返回哪个结果值。

     function run1(a){
          var p = new Promise((resolve,reject)=>{
            //这里做一些异步操作
            setTimeout(()=>{
              console.log('第一个run');
              if(a === 'reject'){
                reject('第一个run已失败');//reject代表异步操作执行失败后的回调函数
              }else{
                resolve('第一个run已完成');//resolve代表异步操作执行成功后的回调函数
              }
            },10000)
          });
          return p;
        }

        function run2(){
          var p = new Promise((resolve,reject)=>{
            //这里做一些异步操作
            setTimeout(()=>{
              console.log('第二个run');
              resolve('第二个run已完成');//resolve代表异步操作执行成功后的回调函数
            },5000)
          });
          return p;
        }

        Promise.race([run1(),run2()]).then((result)=>{
          console.log(result);
        })

打印结果，可以看到，上面的代码run2先被执行，因为run2更快。

Promise学习笔记

什么是Promise？

用法

猜你喜欢

热点阅读