Promise 学习笔记

Promise 的状态

Promise 有三种状态，pending、fulfilled、rejected(未决定，履行，拒绝)，同一时间只能存在一种状态,且状态一旦改变就不能再变。promise是一个构造函数，promise对象代表一项有两种可能结果（成功或失败）的任务。

Promise.then() / Promise.catch()

then 方法接受一个回调函数作为参数，注册 onFulfilled 的时候回调。then() 方法是异步执行，只能在 Promise 对象中使用。如果我们没有给 then() 方法传入这两个回调函数，或者给它传的参数不是回调函数，则 then() 方法将会失去处理函数，但是这并不会产生错误。如果调用 then 的 Promise 的状态（fulfillment 或 rejection）发生改变，但是 then 中并没有关于这种状态的回调函数，那么 then 将创建一个没有经过回调函数处理的新 Promise 对象，这个新 Promise 只是简单地接受调用这个 then 的原 Promise 的终态作为它的终态。

catch 方法接受一个回调函数作为参数，注册onRejected时的回调函数。

Promise.resolve() / Promise.reject()

Promise 有两个回调函数作为参数，一个是成功的回调，一个是失败的回调。

Promise.all() / Promise.race()

all() 方法接受一个 promise 对象的数组作为参数，当这个数组里的所有 promise() 对象全部变为 resolve() 或 reject() 状态的时候，它才会去调用 then() 方法。

promise 对象的数组会并行执行。
promise 的结果和传递给 Promise.all 的数组的顺序一致。

race() 同样也是接受一个 promise 对象的数组作为参数，它返回 promise 对象列表中最快被 resolved 或者 rejected 的值。

race 函数的实现原理：

function race(entries) {
  /*jshint validthis:true */
  var Constructor = this; // this 是调用 race 的 Promise 构造器函数。

  if (!isArray(entries)) {
    return new Constructor(function (_, reject) {
      return reject(new TypeError('You must pass an array to race.'));
    });
  } else {
    return new Constructor(function (resolve, reject) {
      var length = entries.length;
      for (var i = 0; i < length; i++) {
        Constructor.resolve(entries[i]).then(resolve, reject);
      }
    });
  }
}

为什么在 threejs 使用 promise 的时候，会在 reject 的时候出错？

要注意 loader 的 load 方法第三个参数不能省略，不需要的时候可以用 undefined。

const loader = new FileLoader();

const jsonLoader = url => new Promise(
  (resolve, reject) => {
    loader.load(
      url,
      (json) => {
        resolve(json);
      },
      // 这里是 laoder 函数的第三个参数，表示文件加载的过程，如果直接将 error 写在这里，promise 会出错。
      undefined,
      (error) => {
        reject(error);
      },
    );
  },
);

async 和 await：

async 起什么作用:

async 函数（包含函数语句、函数表达式、Lambda表达式）会返回一个 Promise 对象，如果在函数中 return 一个直接量，async 会把这个直接量通过 Promise.resolve() 封装成 Promise 对象。因此在单独使用 async 的时候，就相当于写一个返回一个 Promise 对象的普通方法。如果 async 函数没有返回值，它会返回 Promise.resolve(undefined)。

await 在等待什么:

await 是个运算符，用于组成表达式，await 表达式的运算结果取决于它等的东西。

如果它等到的不是一个 Promise 对象，那 await 表达式的运算结果就是它等到的东西。
如果它等到的是一个 Promise 对象，await 就忙起来了，它会阻塞后面的代码，等着 Promise 对象 resolve，然后得到 resolve 的值，作为 await 表达式的运算结果。

Promise 学习笔记