废话不多说,直接上代码
class myPromise {
// 定义状态
static PENDING = '待定'
static FULFILLED = '成功'
static REJECTED = '失败'
// 构造函数
constructor(fun) {
this.status = myPromise.PENDING
this.result = null
// 定义俩个数组来保存resolve和reject函数
this.resolveCallbacks = []
this.rejectCallbacks = []
// 处理异常
try {
// 解决箭头函数丢失的问题,方法可以用bind(this),或者用箭头函数
fun(this.resolve.bind(this), this.reject.bind(this))
} catch (error) {
this.reject(error.message)
}
}
// resolve方法
resolve(result) {
setTimeout(() => {
if (this.status === myPromise.PENDING) {
this.status = myPromise.FULFILLED
this.result = result
// 执行数组里面的所有方法
this.resolveCallbacks.forEach((callback) => callback(result))
}
})
}
// reject方法
reject(result) {
setTimeout(() => {
if (this.status === myPromise.PENDING) {
this.status = myPromise.REJECTED
this.result = result
// 执行数组里面的所有方法
this.rejectCallbacks.forEach((callback) => callback(result))
}
})
}
// then方法
then(onFULFILLED, onREJECTED) {
// 判断原来的onFULFILLED, onREJECTED是不是函数如果不是函数则转换为空函数
onFULFILLED = typeof onFULFILLED === 'function' ? onFULFILLED : () => {}
onREJECTED = typeof onREJECTED === 'function' ? onREJECTED : () => {}
// 判断待定状态
if (this.status === myPromise.PENDING) {
this.resolveCallbacks.push(onFULFILLED)
this.rejectCallbacks.push(onREJECTED)
}
if (this.status === myPromise.FULFILLED) {
setTimeout(() => {
onFULFILLED(this.result)
})
}
if (this.status === myPromise.REJECTED) {
setTimeout(() => {
onREJECTED(this.result)
})
}
}
}
测试样例:
// 测试
console.log(0)
new myPromise((resolve, reject) => {
console.log(1)
// resolve(2)
setTimeout(() => {
console.log(4)
resolve(5)
reject(6)
})
}).then(
(value) => console.log(value),
(reason) => console.log(reason)
)
console.log(3)
满足条件