Open wucuiping opened 3 years ago
// 简易版
// 首先创建三个常量表示状态
const PENDING = 'pending'
const RESOLVED = 'resolved'
const REJECTED = 'rejected'
function MyPromise(fn) {
const that = this
that.state = PENDING
that.value = null
// 用于保存 then 中的回调,因为当执行完Promise时状态可能还在等待中,这是需要把 then 中的回调保存用于状态改变时使用
that.resolvedCallbacks = []
that.rejectedCallbacks = []
// 完善 resolve 和 reject 函数
// 两个函数都得判断当前状态是否等待中,规范规定只有等待才能改变状态
// 将当前状态更改为对应状态,并将传入的值赋给 value
// 遍历回调函数并执行
function resolve(value) {
if (that.state === PENDING) {
that.state = RESOLVED
that.value = value
that.resolvedCallbacks.map(cb => cb(that.value))
}
}
function reject(value) {
if (that.state === PENDING) {
that.state = REJECTED
that.value = value
that.rejectedCallbacks.map(cb => cb(that.value))
}
}
// 完善执行 fn 函数
// 执行传入的参数并将之前两个函数当作参数传进去
//! 可能执行函数过程会遇到错误,需要捕获并执行 reject 函数
try {
fn(resolve, reject)
} catch (e) {
reject(e)
}
}
// then
MyPromise.prototype.then = function(onFulfilled, onRejected) {
const that = this
onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : v => v
onRejected =
typeof onRejected === 'function'
? onRejected
: r => {
throw r
}
if (that.state === PENDING) {
that.resolvedCallbacks.push(onFulfilled)
that.rejectedCallbacks.push(onRejected)
}
if (that.state === RESOLVED) {
onFulfilled(that.value)
}
if (that.state === REJECTED) {
onRejected(that.value)
}
}
new MyPromise((resolve, reject) => {
setTimeout(() => {
resolve(1)
}, 3000)
}).then(value => {
console.log(value)
})
https://juejin.cn/post/6844903625769091079