ES6系列八：Promise

男娘i 2022-02-01 08:17 182阅读 0赞

异步和同步  
 异步，操作之间没有关系，同时执行多个操作， 代码复杂。  
 同步，同时只能做一件事，代码简单。  
Promise 对象  
 用同步的方式来书写异步代码。  
 Promise 让异步操作写起来，像在写同步操作的流程，不必一层层地嵌套回调函数。  
 改善了可读性，对于多层嵌套的回调函数很方便。  
 充当异步操作与回调函数之间的中介，使得异步操作具备同步操作的接口。  
Promise 也是一个构造函数  
 接受一个回调函数f1作为参数，f1里面是异步操作的代码。  
 返回的p1就是一个 Promise 实例。  
 所有异步任务都返回一个 Promise 实例。  
 Promise 实例有一个then方法，用来指定下一步的回调函数。

function f1(resolve, reject) {
      // 异步代码...
    }
    var p1 = new Promise(f1);
    p1.then(f2); // f1的异步操作执行完成，就会执行f2。

Promise 使得异步流程可以写成同步流程

// 传统写法
    step1(function (value1) {
      step2(value1, function(value2) {
        step3(value2, function(value3) {
          step4(value3, function(value4) {
            // ...
          });
        });
      });
    });
    
    // Promise 的写法
    (new Promise(step1))
      .then(step2)
      .then(step3)
      .then(step4);

Promise.all([
        $.ajax({url:'data/arr', dataType: 'json'}),
        $.ajax({url:'data/json', dataType: 'json'})
    ]).then(function (results) {
        let [arr,json]=results;
        alert('成功了');
        console.log(arr,json);
    },function () {
        alert('失败了');
    });

Promise.all([
        $.ajax({url:'data/arr', dataType: 'json'}),
        $.ajax({url:'data/json', dataType: 'json'}),
        $.ajax({url:'data/num', dataType: 'json'})
    ]).then(results=>{
        let [arr,json,num]=results;
    
        alert('成功了');
        console.log(arr,json,num);
    },err=>{
        alert('失败了');
    });

Promise.all(promiseArray)方法： 都成功才算成功  
 将多个Promise对象实例包装，生成并返回一个新的Promise实例。  
 promise数组中所有的promise实例都变为resolve的时候，该方法才会返回。  
 并将所有结果传递results数组中。  
 promise数组中任何一个promise为reject的话，则整个Promise.all调用会立即终止，并返回一个reject的新的promise对象。

var p1 = Promise.resolve(1),
        p2 = Promise.resolve(2),
        p3 = Promise.resolve(3);
    Promise.all([p1, p2, p3]).then(function (results) {
        console.log(results);  //[1, 2, 3]
    });

Promise.race(\[p1, p2, p3\])方法：有一个成功就算成功  
 Promse.race就是赛跑的意思  
 哪个结果获得的快，就返回那个结果  
 不管结果本身是成功状态还是失败状态