手写promise

手写promise

class Promoses {
        constructor(executor) {
            this.state = 'pending'//等待
            this.value = undefined // 保存值 then使用的
            this.reson = undefined //失败的值,catch使用的
            this.onFulfilledList = [] // 保存成功的方法
            this.onRejectedList = []// 保存失败的方法
            let resolve = (res) => {
                if (this.state !== 'pending') return false
                this.state = 'fulfilled'
                this.value = res
                //调用成功数组的参数
                this.onFulfilledList.forEach(fn => fn())
            }
            let reject = (fil) => {
                if (this.state !== 'pending') return false
                this.state = 'rejected'
                this.reson = fil
                //调用成功数组的参数
                this.onRejectedList.forEach(fn => fn())
            }
            //如果执行的executor 报错直接reject
            try {
                executor(resolve, reject)
            } catch (error) {
                reject(error)
            }
        }
        then(onFulfilled, onRejected) {
            let promise2 = new Promoses((resolve, reject) => {
                if (this.state === 'pending') {
                    this.onFulfilledList.push(() => {
                        setTimeout(() => {
                            let x = onFulfilled(this.value);
                            resolvePromise(x, resolve, reject, promise2);
                        });
                    })

                    this.onRejectedList.push(() => {
                        setTimeout(() => {
                            let x = onRejected(this.reson);
                            resolvePromise(x, resolve, reject, promise2);
                        });
                    })

                }
                if (this.state === 'fulfilled') {
                    setTimeout(() => {
                        let x = onFulfilled(this.value);
                        resolvePromise(x, resolve, reject, promise2);
                    });

                }
                if (this.state === 'rejected') {
                    setTimeout(() => {
                        let x = onRejected(this.reson);
                        resolvePromise(x, resolve, reject, promise2);
                    });
                }
            })
            function resolvePromise(x, resolve, reject, promise2) {
                //处理循环调用
                if (x === promise2) {
                    console.error("出错");
                    return reject("出错")
                }
                //判断是否是一个promise
                if (x instanceof Promoses) {
                    x.then(resolve, reject)
                } else {
                    resolve(x)
                }
            }

            return promise2
        }
        resolve(val) {
            return new Promoses((resolve, reject) => {
                resolve(val)
            })
        }
        reject(val) {
            return new Promoses((resolve, reject) => {
                reject(val)
            })
        }
        //race 竞速原则
        race(promises) {
            return new Promoses((resolve, reject) => {
                console.log(promises);
                promises.forEach(el => {
                    console.log(el);
                    el.then(resolve, reject)
                    console.log(el);
                })
            })
        }

        all(promises) {
            let arr = [] //存结果
            let i = 0 //计数器 有多少个成功了
            return new Promoses((resolve, reject) => {
                promises.forEach((el, index) => {
                    el.then(res => {
                        processaData(index, res,resolve)
                    }, reject)
                })
            })
            function processaData(index, data,resolve) {
                arr[index] = data//存结果
                i++
                if(i === promises.length){
                    resolve(arr)
                }
            }
        }
    }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
当然可以!以下是一个简单的Promise的示例: ```javascript class Promise { constructor(executor) { this.state = 'pending'; this.value = undefined; this.reason = undefined; this.onResolveCallbacks = []; this.onRejectCallbacks = []; const resolve = (value) => { if (this.state === 'pending') { this.state = 'fulfilled'; this.value = value; this.onResolveCallbacks.forEach(callback => callback()); } }; const reject = (reason) => { if (this.state === 'pending') { this.state = 'rejected'; this.reason = reason; this.onRejectCallbacks.forEach(callback => callback()); } }; try { executor(resolve, reject); } catch (error) { reject(error); } } then(onFulfilled, onRejected) { const fulfilledHandler = typeof onFulfilled === 'function' ? onFulfilled : value => value; const rejectedHandler = typeof onRejected === 'function' ? onRejected : reason => { throw reason; }; const promise2 = new Promise((resolve, reject) => { const fulfillHandlerWrapper = () => { setTimeout(() => { try { const result = fulfilledHandler(this.value); resolvePromise(promise2, result, resolve, reject); } catch (error) { reject(error); } }, 0); }; const rejectHandlerWrapper = () => { setTimeout(() => { try { const result = rejectedHandler(this.reason); resolvePromise(promise2, result, resolve, reject); } catch (error) { reject(error); } }, 0); }; if (this.state === 'fulfilled') { fulfillHandlerWrapper(); } else if (this.state === 'rejected') { rejectHandlerWrapper(); } else { this.onResolveCallbacks.push(fulfillHandlerWrapper); this.onRejectCallbacks.push(rejectHandlerWrapper); } }); return promise2; } catch(onRejected) { return this.then(null, onRejected); } } function resolvePromise(promise, result, resolve, reject) { if (promise === result) { return reject(new TypeError('Chaining cycle detected for promise')); } let thenCalledOrThrow = false; if (result instanceof Promise) { result.then( value => resolvePromise(promise, value, resolve, reject), reason => reject(reason) ); } else if (result !== null && (typeof result === 'object' || typeof result === 'function')) { try { const then = result.then; if (typeof then === 'function') { then.call( result, value => { if (thenCalledOrThrow) return; thenCalledOrThrow = true; resolvePromise(promise, value, resolve, reject); }, reason => { if (thenCalledOrThrow) return; thenCalledOrThrow = true; reject(reason); } ); } else { resolve(result); } } catch (error) { if (thenCalledOrThrow) return; thenCalledOrThrow = true; reject(error); } } else { resolve(result); } } ``` 这只是一个基本的实现,还有很多细节和功能可以改进。希望对你有所帮助!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Vue1024

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值