/*
尽可能还原 Promise 中的每一个 API, 并通过注释的方式描述思路和原理.
*/
const PENDING = 'pending'
const FULFILLED = 'fulfilled'
const REJECTED = 'rejected'
class MyPromise {
constructor(executor) {
try {
executor(this.resolve, this.reject)
} catch (error) {
this.reject(error)
}
}
// promise状态
status = PENDING
// 成功之后的值
value = undefined
// 失败后的原因
reason = undefined
// 成功回调
successCallback = []
// 失败回调
failCallback = []
resolve = value => {
// 如果状态不是等待 阻止程序继续运行
if (this.status !== PENDING) return
// 状态改为成功
this.status = FULFILLED
// 保存成功之后的值
this.value = value
// 判断成功回调是否存在,如果存在,则调用
// this.successCallback && this.successCallback(value)
while(this.successCallback.length) this.successCallback.shift()(this.value)
}
reject = reason => {
// 如果状态不是等待 阻止程序继续运行
if (this.status !== PENDING) return;
// 状态改为失败
this.status = REJECTED
// 保存失败之后的原因
this.reason = reason
// 判断失败回调是否存在,如果存在,则调用
// this.failCallback && this.failCallback(reason)
while(this.failCallback.length) this.failCallback.shift()(this.reason)
}
then(successCallback, failCallback) {
successCallback = successCallback ? successCallback : value => value
failCallback = failCallback ? failCallback : reason => {throw reason}
let promise2 = new Promise((resolve, reject) => {
// 判断状态
if (this.status === FULFILLED) {
setTimeout(() => {
try {
let x = successCallback(this.value)
// 判断 x 的值是普通值还是promise对象
// 如果是普通值 直接调用resolve
// 如果是promise对象 查看promise对象的返回结果
// 再根据promise对象的返回结果,决定调用resolve还是调用reject
resolvePromise(promise2, x, resolve, reject)
} catch (error) {
reject(error)
}
}, 0)
} else if (this.status === REJECTED) {
setTimeout(() => {
try {
let x = failCallback(this.reason)
resolvePromise(promise2, x, resolve, reject)
} catch (error) {
reject(error)
}
}, 0)
} else {
// 等待状态
// 将成功回调和失败回调存储起来
this.successCallback.push(() => {
setTimeout(() => {
try {
let x = successCallback(this.value)
resolvePromise(promise2, x, resolve, reject)
} catch (error) {
reject(error)
}
}, 0)
})
this.failCallback.push(() => {
setTimeout(() => {
try {
let x = failCallback(this.reason)
resolvePromise(promise2, x, resolve, reject)
} catch (error) {
reject(error)
}
}, 0)
})
}
})
return promise2
}
finally (callback) {
return this.then(value => {
return MyPromise.resolve(callback()).then(() => value)
}, reason => {
return MyPromise.resolve(callback()).then(() => reason)
})
}
catch (failCallback) {
this.then(undefined, failCallback)
}
static all (array) {
let result = []
let index = 0
return new MyPromise((resolve, reject) => {
function addData (key, value) {
index++
result[key] = value
if (index === array.length) {
resolve(result)
}
}
for (let i = 0; i < array.length; i++) {
let current = array[i]
if (current instanceof MyPromise) {
// promise 对象
current.then(value => addData(i, value), reason => (reject(reason)))
} else {
// 普通值
addData(i, array[i])
}
}
})
}
static resolve (value) {
if (value instanceof MyPromise) return value
return new MyPromise(resolve => resolve(value))
}
}
function resolvePromise(promise2, x, resolve, reject) {
if (promise2 === x) {
return reject(new TypeError('错啦'))
}
if (x instanceof MyPromise) {
// promise 对象
x.then(resolve, reject)
} else {
// 普通值
resolve(x)
}
}
module.exports = MyPromise
手写Promise
最新推荐文章于 2024-10-07 09:24:46 发布
本文将详细介绍Promise的基本概念,并通过实践,从零开始手写一个简单的Promise实现,帮助读者深入理解其工作原理。我们将涵盖Promise的状态转换、链式调用以及错误处理等核心特性。
摘要由CSDN通过智能技术生成