什么是promise？
Promise的核心思想是代表异步操作的一个结果，并且promise具有三个状态(pending初始状态,fulfilled成功状态,rejected失败状态)。我们可以理解为使用promise可以实现非阻塞io的功能，根据三个不同的状态，我们可以知道回调函数实现在哪个过程。
Promise.prototype.then
源码分析：
1 this.then = function(onFulfilled) {
2 if (typeof onFulfilled !== "function") return this;
3 return new Promise(function(resolve, reject) {
4 asap(function() {
5 try {
6 resolve(onFulfilled(value));
7 } catch (ex) {
8 reject(ex);
9 }
10 });
11 });
12 };
13
14 this.then = function(onFulfilled, onRejected) {
15 return new self.constructor(function(resolve, reject) {
16 handle(new Handler(onFulfilled, onRejected, resolve, reject));
17 });
18 };
19
20 ValuePromise.prototype = Promise.prototype;
我们知道.then先是以对象的属性实现的方法，随后是以继承的方式实现的方法，所以then方法可以具有一个参数.then(onFulfilled)，又可具有二个参数.then(onFulfilled,onRejected)，第一个参数为操作成功的回调函数，并且第二个参数是操作失败的回调函数，然后从上面的handle方法可以看出then的二个参数以数组对象的形式保存在一个队列(deferreds)里面，然后从队列里面处理then方法。
.then链式调用
例子(略由于非链式每次都是promise迭代而已)：
1 // 新建一个返回promise对象的函数
2 var p1 = function constructorpromise (a) {
3 return new Promise(function(resolve, reject) {
4 resolve(1)
5 });
6 }
7
8 // 实现链式调用
9 var con = constructorpromise(2)
10 con
11 .then(function(a) {
12 var first = document.getElementsByClassName(‘part-second‘)[0]
13 first.innerText = a
14 return a + 2
15 })
16 .then(function(b) {
17 var first = document.getElementsByClassName(‘part-first‘)[0]
18 first.innerText = b
19 })
注意以上有二个then方法实现的回调，第一个then方法function调用传参是从promise中resolve回调传入的参数值1，第二个then方法的function调用传参是上一个then方法function内部return传递下来的值3（return a +２），因此第二个function的参数获得的结果为３。（切记：如果是链式调用then，那么从第二个then开始function的参数都是从上一个then的function返回的结果，如果上一个then没有return，那么下一个then的function参数为undefined）
Promise.all()
源码分析：
1 Promise.all = function(arr) {
2 var args = Array.prototype.slice.call(arr);
3 return new Promise(function(resolve, reject) {
4 if (args.length === 0) return resolve([]);
5 var remaining = args.length;
6 function res(i, val) {
7 try {
8 if (val && (typeof val === "object" || typeof val === "function")) {
9 var then = val.then;
10 if (typeof then === "function") {
11 then.call(val, function(val) {
12 res(i, val);
13 }, reject);
14 return;
15 }
16 }
17 args[i] = val;
18 if (--remaining === 0) {
19 resolve(args);
20 }
21 } catch (ex) {
22 reject(ex);
23 }
24 }
25 for (var i = 0; i < args.length; i++) {
26 res(i, args[i]);
27 }
28 });
29 };
从以上可以看出，当all的方法内参数为空时(args.length === 0)，就会返回一个resolve方法的迭代对象。如果不为空，且all方法的数组上也不是promise时，那么就会输出值args[i] = val;也就是s说返回初始值pending。如果all方法的数组项是promise时，就会回调resolve()并返回每一项的结果。
例子：
1 var promise = Promise.resolve(3);
2 Promise.all([true, promise]).then(values => {
3 console.log(values); // [true, 3]
4 });
Promise.race([])
源码分析：
1 Promise.race = function(values) {
2 return new Promise(function(resolve, reject) {
3 values.forEach(function(value) {
4 Promise.resolve(value).then(resolve, reject);
5 });
6 });
7 };
其实.race方法内部的数组每一项如果都用promise的resolve方法实现的迭代，那么数组内每一项promise的状态都会发送改变，就像race英文的意思"赛跑,竞争"，表示promise哪一项先执行resolve回调，哪一项promise就会先执行回调函数并返回resolve结果。
例子：
1 var p1 = new Promise(function(resolve, reject) {
2 setTimeout(resolve, 500, "one");
3 });
4 var p2 = new Promise(function(resolve, reject) {
5 setTimeout(resolve, 100, "two");
6 });
7
8 Promise.race([p1, p2]).then(function(value) {
9 console.log(value); // "two"
10 // Both resolve, but p2 is faster
11 });
参考：
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise/all
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise#参见
https://segmentfault.com/a/1190000007032448#articleHeader10
https://www.promisejs.org/api/
原文地址：https://www.cnblogs.com/hao5599/p/8511431.html