class myPromise {
resolve;
reject;
// 构造函数 CustomPromise(executor):在构造函数中初始化 Promise 的状态为 pending,并接受一个执行器函数 executor,
// 该函数包含两个参数 resolve 和 reject,用于改变 Promise 的状态和传递结果或错误。
constructor(excuctor) {
this.status = "pending";
this.value = undefined;
this.error = undefined;
this.onResolveCallbacks = [];
this.onRejectCallbacks = [];
// resolve(value) 和 reject(error) 方法:分别用于将 Promise 状态改变为 fulfilled 和 rejected,并触发相应的回调函数。
const resolve = value => {
if (this.status === "pending") {
this.status = "fulfilled";
this.value = value;
this.onResolveCallbacks.forEach(callback => callback(this.value))
}
}
const reject = error => {
if (this.status === "pending") {
this.status = "rejected";
this.error = error;
this.onRejectCallbacks.forEach(callback => callback(this.error))
}
}
try {
excuctor(resolve, reject);
} catch (error) {
reject(error);
}
}
// then(onFulfilled, onRejected) 方法:用于注册成功和失败的回调函数,并返回一个新的 Promise 对象。
// 根据当前 Promise 的状态,分别处理 fulfilled 和 rejected 的情况,异步执行回调函数并根据返回值决定新 Promise 的状态和结果。
then(onFulfilled, onRejected){
return new myPromise((resolve, reject)=>{
const handleCallback = (callback, value, resolve, reject)=> {
try {
const result = callback(value);
if(result instanceof myPromise ){
result.then(resolve, reject)
}else{
resolve(result)
}
} catch (error) {
reject(error)
}
}
if(this.status === 'fulfilled'){
setTimeout(() => {
handleCallback(onFulfilled, this.value, resolve, reject)
}, 0);
}
if(this.status === 'rejected'){
setTimeout(() => {
handleCallback(onRejected, this.error, resolve, reject)
}, 0);
}
if(this.status === 'pending'){
this.onResolveCallbacks.push(() => {
setTimeout(() => {
handleCallback(onFulfilled, this.value, resolve, reject)
}, 0);
})
this.onRejectCallbacks.push(() => {
setTimeout(() => {
handleCallback(onRejected, this.error, resolve, reject)
}, 0);
})
}
})
}
// catch(onRejected) 方法:用于注册失败的回调函数,实际上是调用 then(null, onRejected)。
catch() {
return this.then(null, onRejected)
}
// 静态方法 resolve(value) 和 reject(error):分别返回一个已经 resolved 或 rejected 的 Promise 对象。
static resolve(value) {
return new myPromise((resolve, reject)=> {
resolve(value)
})
}
static reject(error) {
return new myPromise((resolve, reject) => {
reject(error)
})
}
// 静态方法 all(promises):接受一个 Promise 数组,并返回一个新的 Promise 对象,
// 当所有 Promise 都成功时,返回一个包含所有结果的数组;当任意一个 Promise 失败时,直接返回失败的 Promise。
static all(events) {
return new myPromise((resolve, reject) => {
const results = [];
let completeIndex = 0;
events.forEach((promise, index) => {
promise.then(res => {
results[index] = item;
completeIndex++;
if(completeIndex === results.length){
resolve(results)
}
}).catch(reject)
})
})
}
}
export default myPromise;
自己手动实现promise方法
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
- 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
推荐阅读更多精彩内容
- @property有两个对应的词,一个是 @synthesize,一个是 @dynamic。如果 @synthes...
- 作者:vivo互联网技术-Morrain Promise 是异步编程的一种解决方案,它由社区最早提出和实现,ES6...
- 本文首发于 vivo互联网技术 微信公众号链接: https://mp.weixin.qq.com/s/Lp_5B...
- 前面两节实现了promise的基本功能和链式调用,接下来就这个系列最后一节了,实现4个静态方法。 race方法 a...