Promise对象
所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件（通常是一个异步操作）的结果。从语法上说，Promise 是一个对象，从它可以获取异步操作的消息。
Promise对象有以下两个特点。
（1）对象的状态不受外界影响。Promise对象代表一个异步操作，有三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败）。
（2）一旦状态改变，就不会再变，任何时候都可以得到这个结果。Promise对象的状态改变，只有两种可能：从pending变为fulfilled和从pending变为rejected。只要这两种情况发生，状态就凝固了，不会再变了，会一直保持这个结果，这时就称为 resolved（已定型）。
有了Promise对象，就可以将异步操作以同步操作的流程表达出来，避免了层层嵌套的回调函数。此外，Promise对象提供统一的接口，使得控制异步操作更加容易。
Promise也有一些缺点。首先，无法取消Promise，一旦新建它就会立即执行，无法中途取消。其次，如果不设置回调函数，Promise内部抛出的错误，不会反应到外部。第三，当处于pending状态时，无法得知目前进展到哪一个阶段（刚刚开始还是即将完成）。
基本用法
Promise对象是一个构造函数，用来生成Promise实例。
const promise = new Promise(function(resolve, reject) {
// ... some code
if (/* 异步操作成功 */){
resolve(value);
} else {
reject(error);
}
});
Promise构造函数接受一个函数作为参数，该函数的两个参数分别是resolve和reject。
resolve函数的作用是，将Promise对象的状态从“未完成”变为“成功”（即从 pending 变为 resolved），在异步操作成功时调用，并将异步操作的结果，作为参数传递出去；reject函数的作用是，将Promise对象的状态从“未完成”变为“失败”（即从 pending 变为 rejected），在异步操作失败时调用，并将异步操作报出的错误，作为参数传递出去。
function timeout(ms) {
return new Promise((resolve, reject) => {
setTimeout(resolve, ms, 'done');
});
}
timeout(100).then((value) => {
console.log(value);
});
上面代码中，timeout方法返回一个Promise实例，表示一段时间以后才会发生的结果。过了指定的时间（ms参数）以后，Promise实例的状态变为resolved，就会触发then方法绑定的回调函数。
注意，调用resolve或reject并不会终结 Promise 的参数函数的执行。
new Promise((resolve, reject) => {
resolve(1);
console.log(2);
}).then(r => {
console.log(r);
});
// 2
// 1
上面代码中，调用resolve(1)以后，后面的console.log(2)还是会执行，并且会首先打印出来。这是因为立即 resolved 的 Promise 是在本轮事件循环的末尾执行，总是晚于本轮循环的同步任务。
一般来说，调用resolve或reject以后，Promise 的使命就完成了，后继操作应该放到then方法里面，而不应该直接写在resolve或reject的后面。所以，最好在它们前面加上return语句，这样就不会有意外。
new Promise((resolve, reject) => {
return resolve(1);
// 后面的语句不会执行
console.log(2);
})
原型方法
Promise.prototype.then()
Promise.prototype.catch()
// 写法一
const promise = new Promise(function(resolve, reject) {
try {
throw new Error('test');
} catch(e) {
reject(e);
}
});
promise.catch(function(error) {
console.log(error);
});
// 写法二
const promise = new Promise(function(resolve, reject) {
reject(new Error('test'));
});
promise.catch(function(error) {
console.log(error);
});
Promise.prototype.finally()
finally()方法用于指定不管 Promise 对象最后状态如何，都会执行的操作。该方法是 ES2018(ES9) 引入标准的。
静态方法
Promise.resolve()
Promise.reject()
Promise.all()
Promise.all(param) 接收一个参数数组，返回一个新的promise实例。当参数数组内的promise都resolve后或者参数内的实例执行完毕后，新返回的promise才会resolve。
Promise.race()
与all方法类似，接受一个实例数组为参数，返回新的promise。但区别是一旦实例数组中的某个promise解决或拒绝，返回的promise就会解决或拒绝。
Promise.allSettled()
Promise.allSettled()方法接受一组 Promise 实例作为参数，包装成一个新的 Promise 实例。只有等到所有这些参数实例都返回结果，不管是fulfilled还是rejected，包装实例才会结束。该方法由 ES2020(ES11) 引入。
Promise.allSettled()方法返回一个promise，该promise在所有给定的promise已被解析或被拒绝后解析，并且每个对象都描述每个promise的结果。
Promise.any()
ES2021(ES12) 引入了Promise.any()方法。该方法接受一组 Promise 实例作为参数，包装成一个新的 Promise 实例返回。只要参数实例有一个变成fulfilled状态，包装实例就会变成fulfilled状态；如果所有参数实例都变成rejected状态，包装实例就会变成rejected状态。
Promise源码
class NewPromise {
constructor(handler) {
this.state = PENDING
this.value = undefined
this.successCallback = []
this.failureCallback = []
try {
handler(this.resolve.bind(this), this.reject.bind(this))
} catch (e) {
// 执行器出现错误需要reject
this.reject(e)
}
}
resolve(value) {
if (this.state !== PENDING) return
this.state = FULFILLED
this.value = value
// 规范中要求then中注册的回调以异步方式执行，保证在resolve执行所有的回调之前，
// 所有回调已经通过then注册完成
setTimeout(() => {
this.successCallback.forEach(item => {
item(value)
})
})
}
reject(reason) {
if (this.state !== PENDING) return
this.state = REJECTED
this.value = reason
setTimeout(() => {
this.failureCallback.forEach(item => {
item(reason)
})
})
}
then(onFulfilled, onRejected) {
const { state, value } = this
return new NewPromise((resolveNext, rejectNext) => {
const resolveNewPromise = value => {
try {
// 正常情况
if (typeof onFulfilled !== 'function') {
// 不是函数，直接忽略，将then所属的promise作为then返回的promise的值resolve来做到值的传递
resolveNext(value)
} else {
// 获取then函数回调的执行结果
const res = onFulfilled(value)
if (res instanceof NewPromise) {
// 当执行结果返回的是一个promise实例，等待这个promise状态改变后再改变then返回的promise的状态
res.then(resolveNext, rejectNext)
} else {
// 当返回值是普通值，将其作为新promise的值resolve
resolveNext(res)
}
}
} catch (e) {
// 出现异常，新promise的状态变为rejected，reason就是错误对象
rejectNext(e)
}
}
const rejectNewPromise = reason => {
try {
// 正常情况
if (typeof onRejected !== 'function') {
// 不是函数，直接忽略，将then所属的promise作为then返回的promise的值reject来做到值的传递
rejectNext(reason)
} else {
// 获取then函数回调的执行结果
const res = onRejected(reason)
if (res instanceof NewPromise) {
// 当执行结果返回的是一个promise实例，等待这个promise状态改变后再改变then返回的promise的状态
res.then(resolveNext, rejectNext)
} else {
// 当返回值是普通值，将其作为新promise的值reject
rejectNext(res)
}
}
} catch (e) {
// 出现异常，新promise的状态变为rejected，reason就是错误对象
rejectNext(e)
}
}
if (state === PENDING) {
this.successCallback.push(resolveNewPromise)
this.failureCallback.push(rejectNewPromise)
}
// 要保证在当前promise状态改变之后，再去改变新的promise的状态
if (state === FULFILLED) {
resolveNewPromise(value)
}
if (state === REJECTED) {
rejectNewPromise(value)
}
})
}
catch(onRejected) {
return this.then(undefined, onRejected)
}
finally(callback) {
// 返回值是promise对象，回调在then中执行，也就符合了promise结束后调用的原则
return this.then(
// then方法的onFulfiled 和 onRejected都会被传入，保证无论resolved或rejected都会被执行
// 获取到promise执行成功的结果，将这个结果作为finally返回的新的promise的值
res => NewPromise.resolve(callback())
.then(() => {
return res
}),
// 获取执行失败的结果。原理同上
error => NewPromise.resolve(callback())
.then(() => {
throw error
})
)
}
static allSettled(instanceList) {
return new NewPromise((resolve, reject) => {
const results = []
let count = 0
if (instanceList.length === 0) {
resolve([])
return
}
// 定义一个函数，来生成结果数组
const generateResult = (result, i) => {
count++
results[i] = result
// 一旦全部执行完成，resolve新返回的promise
if (count === instanceList.length) {
resolve(results)
}
}
instanceList.forEach((item, index) => {
// 在每个promise完成后将状态记录到结果数组中
this.resolve(item).then(
value => {
generateResult({
status: FULFILLED,
value
}, index)
},
reason => {
generateResult({
status: REJECTED,
reason
}, index)
}
)
})
})
}
static resolve(value) {
// value不存在，直接返回一个resolved状态的promise
if (!value) {
return new NewPromise(function (resolve) {
resolve()
})
}
// value是promise实例，直接返回
// 在这里需要首先判断是否是promise实例，再进行下边的判断
// 因为我们自己构造的promise也是是object，也有then方法
if (value instanceof NewPromise) {
return value
}
// 是thenable对象，返回的新的promise实例需要在value状态改变后再改变，且状态跟随value的状态
if (typeof value === 'object' && typeof value.then === 'function') {
return new NewPromise((resolve, reject) => {
value.then(resolve, reject)
})
}
// value是普通值，返回新的promise并resolve这个普通值
return new NewPromise(resolve => {
resolve(value)
})
}
static reject(reason) {
return new NewPromise((resolve, reject) => {
reject(reason)
})
}
static all(instanceList) {
return new NewPromise((resolve, reject) => {
// 定义存放结果的数组
const results = []
let count = 0
if (instanceList.length === 0) {
resolve(results)
return
}
instanceList.forEach((item, index) => {
// 由于实例列表中的每个元素可能是各种各样的，所以要用this.resolve方法包装一层
this.resolve(item).then(res => {
results[index] = res
count++
// 当都执行完，resolve新返回的promise
if (count === instanceList.length) {
resolve(results)
}
}, error => {
// 一旦有一个出错，就reject新返回的promise
reject(error)
})
})
})
}
static race(instanceList) {
return new NewPromise((resolve, reject) => {
if (instanceList.length === 0) {
resolve([])
return
}
instanceList.forEach(item => {
// 由于实例列表中的每个元素可能是各种各样的，所以要用this.resolve方法包装一层
this.resolve(item).then(res => {
// 一旦有一个resolve了，那么新返回的promise状态就被resolve
resolve(res)
}, error => {
reject(error)
})
})
})
}
}
本文大多数内容来自以下ES6教程：
图解 Promise 实现原理（二）—— Promise 链式调用
图解 Promise 实现原理（三）—— Promise 原型方法实现
