#Js篇：Promise.all()&Promise.allSettled()&Promise.race()& Promise.any()-CSDN博客

定义

Promise是异步操作解决方案，为异步操作提供统一接口。

Promise英文意思是“承诺”，表示其他手段无法改变。

所有异步任务都返回一个Promise实例。

Promise实例有一个then方法，用于指定下一步的回调函数。

状态

异步操作未完成 pending（进行中）

异步操作成功 fulfilled（已完成）

异步操作失败 rejected（已失败）

从“未完成”到“成功”
从“未完成”到“失败”

优点

可以将异步操作以同步操作的流程表达出来，避免了层层嵌套的回调函数。

缺点

无法取消Promise,一旦新建它就会立即执行，无法中途取消。

如果不设置回调函数，Promise内部抛出的错误，不会反应到外部。

当处于pending状态是，无法得知目前进展到哪一阶段。

基本用法

ES6规定，Promise对象是一个构造函数，用来生成Promsise实例。

const promise = new Promise((resolve,reject) => {
	if (/* 异步操作成功 */) {
    resolve(value)
	} else {
    reject(error)
  }
})

resolve函数作用是，将Promise对象的状态从“未完成”变为“成功”----pending到resolved

Reject函数作用是，将Promise从“未完成”变成“失败”

—pending到rejected

Promise实例生成以后，可以用then方法分别指定resolved状态和rejected状态的回调函数。

function timeout(ms) {
  return new Promise((resolve, reject) => {
    setTimeout(resolve, ms, 'done');
  });
}

timeout(100).then((value) => {
  console.log(value);
});

下面是异步加载图片的例子

function loadImageAsync(url) {
  return new Promise(function(resolve, reject) {
    const image = new Image();

    image.onload = function() {
      resolve(image);
    };

    image.onerror = function() {
      reject(new Error('Could not load image at ' + url));
    };

    image.src = url;
  });
}

Promise.prototype.then()

作用是为Promise实例添加状态改变时的回调函数。

返回： t hen方法返回一个新的Promise实例。

Promise.prototype.catch()

指定发生错误时的回调函数

getJSON('/posts.json').then(function(posts) {
  // ...
}).catch(function(error) {
  // 处理 getJSON 和 前一个回调函数运行时发生的错误
  console.log('发生错误！', error);
});

如果状态变为resolve则调用**then()**方法执行的回调函数；

如果异步操作抛出错误，状态就会变味rejected则会调用catch()方法指定的回调函数，处理这个错误。

Promise.prototype.finally()

指定不管Promise对象最后状态如何，都会执行的操作。

Promise.all()

定义

用于将多个Promise实例，包装成一个新的Promise实例。

const p = Promise.all([p1, p2, p3]);

特点

p1、p2、p3都是 Promise 实例
如果不是，就会先调用下面讲到的Promise.resolve方法，将参数转为 Promise 实例，再进一步处理。

p的状态由p1 p2 p3决定

3种都变成fulfilled, === p变成fulfilled;
3种中有一个变成rejected,====p变成fulfilled

Promise.all()方法只适合所有异步操作都成功的情况，如果有一个操作失败，就无法满足要求。

Promise.race()

定义

将多个Promise实例，包装成一个新的Promise实例。

特点

p的状态

只要p1 p2 p3之中有一个实例率先改变状态，p的状态就跟着改变。

只要有一个 Promise 对象率先解决或拒绝，整个 Promise.race() 就会解决或拒绝。

Promise.allSettled()

定义

只有等到参数数组的所有 Promise 对象都发生状态变更（不管是fulfilled还是rejected），返回的 Promise 对象才会发生状态变更。

const promises = [
  fetch('/api-1'),
  fetch('/api-2'),
  fetch('/api-3'),
];

await Promise.allSettled(promises);
removeLoadingIndicator();

上面示例中，数组promises包含的三个请求，只有等到三个请求都结束了，removeLoadingIndicator()才会执行。

== 用于获取多个Promise对象的最终状态和结果==

== 而 Promise.finally()用于在Promise最终解决或拒绝时执行一段逻辑 ==

Promise.any()

特点

只要参数实例一个变成fulfilled–成功状态，包装对象就会变成fulfilled—成功状态
如果所有参数实例都变成rejected状态，包装对象实例就会变成rejected状态

Promise.resolve()

定义

需要将现有对象转为Promise对象

Promise.reject()

小总结

Promise.all()

所有异步操作都成功的情况

Promise.allSettled()

所有请求都结束

Promise.race()

随着第一个状态的改变而改变

Promise.any()

一个变成成功，就变成功

所有都是失败，才变失败