promise的理解

Promise 的用途

promise 是异步编程的一种解决方案，promise 可以将异步操作以同步操作的流程表达出来，避免了层层嵌套的回调函数。此外，Promise 对象提供统一的接口，使得控制异步操作更加容易。

创建 promise

const promise = new Promise(function(resolve, reject) {
  // ... some code

  if (/* 异步操作成功 */){
    resolve(value);
  } else {
    reject(error);
  }
});

Promise.prototype.then() 的用法

then()用来执行回调函数，它最多需要有两个参数：Promise 的成功和失败情况的回调函数，并且 then 方法里也可以返回 promise 对象，这样就可以链式调用了。

语法如下：

p.then(onFulfilled[, onRejected]);

示例如下：

var Pro = function (time) {
    //返回一个Promise对象
    return new Promise(function (resolve, reject) {
        console.log('123');
        //模拟接口调用
        setTimeout(function () {
            //这里告诉Promise 成功了，然后去执行then方法的第一个函数
            resolve('成功返回');
        }, time);
    });
};
(function () {
    console.log('start');
    Pro(3000)
        .then(function (data) {
            console.log(data);
            return Pro(5000);
        })
        .then(function (data) {
            console.log(data);
            console.log('end');
        });
})();
//依次输出：
//start
//123
//成功返回
//123
//end

Promise.all() 的用法

Promise.all() 方法用于将多个 Promise 实例，包装成一个新的 Promise 实例。个 Promise 的 resolve 回调执行是在所有输入的 promise 的 resolve 回调都结束，或者输入的 iterable 里没有 promise 了的时候。它的 reject 回调执行是，只要任何一个输入的 promise 的 reject 回调执行或者输入不合法的 promise 就会立即抛出错误，并且 reject 的是第一个抛出的错误信息。

语法如下：

Promise.all(iterable);

iterable 指可迭代对象，如 Array 等

示例如下：

let p1 = new Promise(function (resolve, reject) {
    resolve(1);
});
let p2 = new Promise(function (resolve, reject) {
    resolve(2);
});
let p3 = new Promise(function (resolve, reject) {
    resolve(3);
});
Promise.all([p1, p2, p3])
    .then(function (results) {
        console.log('success:' + results);
    })
    .catch(function (r) {
        console.log('error');
        console.log(r);
    });
//输出：success:1,2,3

Promise.race() 的用法

Promise.race() 方法同样是将多个 Promise 实例，包装成一个新的 Promise 实例。一旦迭代器中的某个 promise 解决或拒绝，返回的 promise 就会解决或拒绝，也就是说取决于最先改变状态的 promise 实例。

语法与 all 类似：

Promise.race(iterable);

iterable 指可迭代对象，如 Array 等

示例如下：

var p1 = new Promise(function (resolve, reject) {
    setTimeout(resolve, 500, 'one');
});
var p2 = new Promise(function (resolve, reject) {
    setTimeout(resolve, 100, 'two');
});

Promise.race([p1, p2]).then(function (value) {
    console.log(value); // "two"
    // 两个都完成，但 p2 更快
});

var p3 = new Promise(function (resolve, reject) {
    setTimeout(resolve, 100, 'three');
});
var p4 = new Promise(function (resolve, reject) {
    setTimeout(reject, 500, 'four');
});

Promise.race([p3, p4]).then(
    function (value) {
        console.log(value); // "three"
        // p3 更快，所以它完成了
    },
    function (reason) {
        // 未被调用
    }
);