文案没编辑好,先上代码吧
const isFunction = variable => typeof variable === 'function'
// 定义Promise的三种常量
const PENDING = 'PENDING'
const FULFILLED = 'FULFILLED'
const REJECTED = 'REJECTED'
class MyPromise {
constructor(handle) {
this._status = PENDING // 当前状态
this._value = undefined // 当前值
this._fulfilledQueues = [] // 添加成功回调函数队列
this._rejectedQueues = [] // 添加失败回调函数队列
try {
handle(this._resolve.bind(this), this._reject.bind(this))
} catch (err) {
this._reject(err)
}
}
static resolve(value) {
// 如果参数是MyPromise实例,直接返回这个实例
if (value instanceof MyPromise) return value
return new MyPromise(resolve => resolve(value))
}
static reject(value) {
return new MyPromise((resolve, reject) => reject(value))
}
static all(list) {
return new MyPromise((resolve, reject) => {
let values = []
let count = 0
for (let [i, p] of list.entries()) {
// 数组参数如果不是MyPromise实例,先调用MyPromise.resolve()
this.resolve(p).then(res => {
values[i] = res
count++
// 所有状态都变成fulfilled时,返回的MyPromise状态就变成fulfilled
if (count === list.length) resolve(values)
}, err => {
// 有一个被rejected时,返回的MyPromise状态就变成rejected
reject(err)
})
}
})
}
static race(list) {
return new MyPromise((resolve, reject) => {
for (let p of list) {
// 只要有一个实例率先改变状态,新的MyPromise状态就跟着改变
this.resolve(p).then(res => {
resolve(res)
}, err => {
reject(err)
})
}
})
}
then(onFulfilled, onRejected) {
const {
_value,
_status
} = this
// 返回一个新的MyPromise对象
return new MyPromise((onFulfilledNext, onRejectedNext) => {
// 封装一个成功时执行的函数
let fulfilled = value => {
try {
if (!isFunction(onFulfilled)) {
onFulfilledNext(value)
} else {
let res = onFulfilled(value)
if (res instanceof MyPromise) {
// 如果当前回调函数返回MyPromise对象,必须等待其状态改变后再执行下一个回调
res.then(onFulfilledNext, onRejectedNext)
} else {
// 否则会将返回结果直接当做参数,传入下一个then的回调函数,并立即执行下一个then的回调函数
onFulfilledNext(res)
}
}
} catch (err) {
// 如果函数执行出错,新的MyPromise对象的状态为失败
onRejectedNext(err)
}
}
// 封装一个失败时执行的函数
let rejected = error => {
try {
if (!isFunction(onRejected)) {
onRejectedNext(error)
} else {
let res = onRejected(error)
if (res instanceof MyPromise) {
// 如果当前回调函数返回MyPromise对象,必须等待其状态改变后再执行下一个回调
res.then(onFulfilledNext, onRejectedNext)
} else {
// 否则会将返回结果直接当做参数,传入下一个then的回调函数,并立即执行下一个then的回调函数
onFulfilledNext(res)
}
}
} catch (err) {
// 如果函数执行出错,新的MyPromise对象的状态为失败
onRejectedNext(err)
}
}
switch (_status) {
// 当状态为pending时,将then方法回调函数加入执行队列等待执行
case PENDING:
this._fulfilledQueues.push(fulfilled)
this._rejectedQueues.push(rejected)
break
// 当状态为改变时,立即执行对应的回调函数
case FULFILLED:
fulfilled(_value)
break
case REJECTED:
rejected(_value)
break
}
})
}
catch (onRejected) {
return this.then(null, onRejected)
}
_resolve(val) {
const run = () => {
// 如果状态是FULFILLED或REJECTED,则中断执行
if (this._status !== PENDING) return
/*
如果resolve的参数为MyPromise对象,则必须等待该MyPromise对象状态改变后,
当前MyPromise的状态才会改变,且状态取决于参数MyPromise对象的状态
*/
if (val instanceof MyPromise) {
val.then(value => {
this._value = value
this._status = FULFILLED
this._runFulfilled()
}, err => {
this._value = err
this._status = REJECTED
this._runRejected()
})
} else {
this._value = val
this._status = FULFILLED
this._runFulfilled()
}
}
// 实现异步,本次事件轮询结束后调用
setTimeout(run, 0)
}
_reject(err) {
// 如果状态是FULFILLED或REJECTED,则中断执行
if (this._status !== PENDING) return
// 依次执行失败队列中的函数,并清空队列
const run = () => {
this._value = err
this._status = REJECTED
this._runRejected()
}
// 为了支持同步的MyPromise,这里采用异步调用
setTimeout(run, 0)
}
// 依次执行成功队列中的函数,并清空队列
_runFulfilled = () => {
let cb;
while (cb = this._fulfilledQueues.shift()) {
cb(this._value)
}
}
// 依次执行失败队列中的函数,并清空队列
_runRejected = () => {
let cb;
while (cb = this._rejectedQueues.shift()) {
cb(this._value)
}
}
}