Promise 笔记
Promise
含义
异步编程的一种解决方案，比传统的解决方案【回调函数和事件】更合理。
Promise对象两个特点
- 对象不受外界影响。 共有三个状态
pending，fulfilled，rejected。只有异步操作的结果，可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。即：一旦发生无法改变 - 一旦状态改变，就不会再变，任何时候都可以得到这个结果。
Promise对象的状态改变，只有两种可能：pending=>fulfilled或者pending=>rejected,这两个过程一旦发生，状态立刻凝固，不会再变，这时就称为resolved（已定型）
Promise也有一些缺点：
- 无法取消
Promise，一旦新建它就会立即执行，无法中途取消。 - 如果不设置回调函数，
Promise内部抛出的错误，不会反应到外部 - 当处于
pending状态时，无法得知目前进展到哪一个阶段（刚刚开始还是即将完成）。
Promise.resolve()
作用：将现有对象转为 Promise 对象
const jsPromise = Promise.resolve($.ajax('/whatever.json'));
上面代码将 jQuery 生成的deferred对象，转为一个新的 Promise 对象。
Promise.resolve('foo')
// 等价于
new Promise(resolve => resolve('foo'))
Promise.resolve方法的参数分成四种情况
-
参数是一个 Promise 实例
- 如果参数是 Promise 实例，那么
Promise.resolve将不做任何修改、原封不动地返回这个实例。
- 如果参数是 Promise 实例，那么
-
参数是一个
thenable对象-
thenable对象指的是具有then方法的对象，比如下面这个对象。 -
let thenable = { then: function(resolve, reject) { resolve(42); } }; -
Promise.resolve方法会将这个对象转为 Promise 对象，然后就立即执行thenable对象的then方法。 -
let thenable = { then: function(resolve, reject) { resolve(42); } }; let p1 = Promise.resolve(thenable); p1.then(function(value) { console.log(value); // 42 });上面代码中，
thenable对象的then方法执行后，对象p1的状态就变为resolved，从而立即执行最后那个then方法指定的回调函数，输出 42。
-
-
参数不是具有
then方法的对象，或根本就不是对象-
如果参数是一个原始值，或者是一个不具有
then方法的对象，则Promise.resolve方法返回一个新的 Promise 对象，状态为resolved。 -
const p = Promise.resolve('Hello'); p.then(function (s){ console.log(s) }); // Hello上面代码生成一个新的 Promise 对象的实例
p。由于字符串Hello不属于异步操作（判断方法是字符串对象不具有 then 方法），返回 Promise 实例的状态从一生成就是resolved，所以回调函数会立即执行。Promise.resolve方法的参数，会同时传给回调函数。
-
-
不带有任何参数
-
Promise.resolve()方法允许调用时不带参数，直接返回一个resolved状态的 Promise 对象。 -
const p = Promise.resolve(); p.then(function () { // ... });
-
Promise.reject()
Promise.reject(reason)方法也会返回一个新的 Promise 实例，该实例的状态为rejected。
const p = Promise.reject('出错了');
// 等同于
const p = new Promise((resolve, reject) => reject('出错了'))
p.then(null, function (s) {
console.log(s)
});
// 出错了
上面代码生成一个 Promise 对象的实例p，状态为rejected，回调函数会立即执行。
应用
我们可以将图片的加载写成一个Promise，一旦加载完成，Promise的状态就发生变化。
const preloadImage = function (path) {
return new Promise(function (resolve, reject) {
const image = new Image();
image.onload = resolve;
image.onerror = reject;
image.src = path;
});
};
Generator 函数与 Promise 的结合
使用 Generator 函数管理流程，遇到异步操作的时候，通常返回一个Promise对象。
function getFoo () {
return new Promise(function (resolve, reject){
resolve('foo');
});
}
const g = function* () {
try {
const foo = yield getFoo();
console.log(foo);
} catch (e) {
console.log(e);
}
};
function run (generator) {
const it = generator();
function go(result) {
if (result.done) return result.value;
return result.value.then(function (value) {
return go(it.next(value));
}, function (error) {
return go(it.throw(error));
});
}
go(it.next());
}
run(g);
上面代码的 Generator 函数g之中，有一个异步操作getFoo，它返回的就是一个Promise对象。函数run用来处理这个Promise对象，并调用下一个next方法。
Promise.try()
实际开发中，经常遇到一种情况：不知道或者不想区分，函数f是同步函数还是异步操作，但是想用 Promise 来处理它。因为这样就可以不管f是否包含异步操作，都用then方法指定下一步流程，用catch方法处理f抛出的错误。一般就会采用下面的写法。
Promise.resolve().then(f)
上面的写法有一个缺点，就是如果f是同步函数，那么它会在本轮事件循环的末尾执行
const f = () => console.log('now');
Promise.resolve().then(f);
console.log('next');
// next
// now
上面代码中，函数f是同步的，但是用 Promise 包装了以后，就变成异步执行了
有没有一种方法，让同步函数同步执行，异步函数异步执行，并且让它们具有统一的 API 呢？回答是可以的，并且还有两种写法。
-
第一种写法是用
async函数来写 -
const f = () => console.log('now'); (async () => f())(); console.log('next'); // now // next上面代码中，第二行是一个立即执行的匿名函数，会立即执行里面的
async函数，因此如果f是同步的，就会得到同步的结果；如果f是异步的，就可以用then指定下一步，就像下面的写法。(async () => f())() .then(...)需要注意的是，
async () => f()会吃掉f()抛出的错误。所以，如果想捕获错误，要使用promise.catch方法。(async () => f())() .then(...) .catch(...) -
第二种写法是使用
new Promise() -
const f = () => console.log('now'); ( () => new Promise( resolve => resolve(f()) ) )(); console.log('next'); // now // next上面代码也是使用立即执行的匿名函数，执行
new Promise()。这种情况下，同步函数也是同步执行的。 -
鉴于这是一个很常见的需求，提供
Promise.try方法替代上面的写法。const f = () => console.log('now'); Promise.try(f); console.log('next'); // now // next事实上，
Promise.try就是模拟try代码块，就像promise.catch模拟的是catch代码块
Promise.all()
Promise.all()方法用于将多个 Promise 实例，包装成一个新的 Promise 实例。
const p = Promise.all([p1, p2, p3]);
上面代码中，Promise.all()方法接受一个数组作为参数，p1、p2、p3都是 Promise 实例，如果不是，就会先调用下面讲到的Promise.resolve方法，将参数转为 Promise 实例，再进一步处理。另外，Promise.all()方法的参数可以不是数组，但必须具有 Iterator 接口，且返回的每个成员都是 Promise 实例。
当p1,p2,p3所有状态都变为 fulfilled 则 p状态变为fulfilled ，只要有一个状态变为rejected，p的状态就变成rejected
Promise.race()
Promise.race()方法同样是将多个 Promise 实例，包装成一个新的 Promise 实例。
const p = Promise.race([p1, p2, p3]);
上面代码中，只要p1、p2、p3之中有一个实例率先改变状态，p的状态就跟着改变。那个率先改变的 Promise 实例的返回值，就传递给p的回调函数。
Promise.race()方法的参数与Promise.all()方法一样，如果不是 Promise 实例，就会先调用下面讲到的Promise.resolve()方法，将参数转为 Promise 实例，再进一步处理。
Promise.allSettled()
Promise.allSettled()方法接受一组 Promise 实例作为参数，包装成一个新的 Promise 实例。只有等到所有这些参数实例都返回结果，不管是fulfilled还是rejected，包装实例才会结束。
const promises = [
fetch('/api-1'),
fetch('/api-2'),
fetch('/api-3'),
];
await Promise.allSettled(promises);
removeLoadingIndicator();
上面代码对服务器发出三个请求，等到三个请求都结束，不管请求成功还是失败，加载的滚动图标就会消失。
该方法返回的新的 Promise 实例，一旦结束，状态总是fulfilled，不会变成rejected。状态变成fulfilled后，Promise 的监听函数接收到的参数是一个数组，每个成员对应一个传入Promise.allSettled()的 Promise 实例。
const resolved = Promise.resolve(42);
const rejected = Promise.reject(-1);
const allSettledPromise = Promise.allSettled([resolved, rejected]);
allSettledPromise.then(function (results) {
console.log(results);
});
// [
// { status: 'fulfilled', value: 42 },
// { status: 'rejected', reason: -1 }
// ]
上面代码中，Promise.allSettled()的返回值allSettledPromise，状态只可能变成fulfilled。它的监听函数接收到的参数是数组results。该数组的每个成员都是一个对象，对应传入Promise.allSettled()的两个 Promise 实例。每个对象都有status属性，该属性的值只可能是字符串fulfilled或字符串rejected。fulfilled时，对象有value属性，rejected时有reason属性，对应两种状态的返回值。
const promises = [ fetch('index.html'), fetch('https://does-not-exist/') ];
const results = await Promise.allSettled(promises);
// 过滤出成功的请求
const successfulPromises = results.filter(p => p.status === 'fulfilled');
// 过滤出失败的请求，并输出原因
const errors = results
.filter(p => p.status === 'rejected')
.map(p => p.reason);
有时候，我们不关心异步操作的结果，只关心这些操作有没有结束。这时，Promise.allSettled()方法就很有用。如果没有这个方法，想要确保所有操作都结束，就很麻烦。Promise.all()方法无法做到这一点。
Promise.any()
Promise.any()方法接受一组 Promise 实例作为参数，包装成一个新的 Promise 实例。只要参数实例有一个变成fulfilled状态，包装实例就会变成fulfilled状态；如果所有参数实例都变成rejected状态，包装实例就会变成rejected状态。
Promise.any()跟Promise.race()方法很像，只有一点不同，就是不会因为某个 Promise 变成rejected状态而结束。