手动实现简单Promise

6 篇文章 0 订阅
本文详细解析了如何手动实现一个简单的Promise,从构造函数到resolve、reject的调用,再到then方法的处理,深入探讨了Promise的工作原理。
摘要由CSDN通过智能技术生成
ffunction promise(exector) {
    let self = this
    self.value = null;
    self.status = 'pedding';
    self.callbacks = [];

    function resolve(value) {
        if (self.status == 'pedding') {
            self.status = 'resolved';
            self.value = value;
            // 此处为异步方法,应比同步晚执行,放入异步队列。
            setTimeout(() => {
                self.callbacks.forEach(fn => {
                    fn.onResolved(self.value);
                })
            }, 0);
        }
    }
    function reject(error) {
        if (self.status == 'pedding') {
            self.status = 'rejected';
            self.value = error;
            // 此处为异步方法,应比同步晚执行,放入异步队列。
            setTimeout(() => {
                self.callbacks.forEach(fn => {
                    fn.onRejected(self.value);
                })
            }, 0);
        }
    }
    try {
        exector(resolve, reject)
    } catch (e) {
        reject(e)
    }
}

promise.prototype.then = function (onResolved, onRejected) {
    let self = this
    // 穿透
    onResolved = typeof onResolved == 'function' ? onResolved : function () {return self.value }
    onRejected = typeof onRejected == 'function' ? onRejected : function () {return self.value }
    // 链式返回仍是 promise
    return new promise((resolve, reject) => {
        // 为了解决 resolve 被放入异步队列,状态还处于pedding的时候无法执行下面的方法。
        if (self.status == 'pedding') {
            self.callbacks.push({
                onResolved: val => {
                    try {
                        let res = onResolved(self.value);
                        resolve(res)
                    } catch (e) {
                        reject(e)
                    }
                },
                onRejected: val => {
                    try {
                        let res = onRejected(self.value);
                        resolve(res)
                    } catch (e) {
                        reject(e)
                    }
                }
            })
        }
        if (self.status == 'resolved') {
            setTimeout(() => {
                try {
                    let res = onResolved(self.value);
                    resolve(res)
                } catch (e) {
                    reject(e)
                }
            }, 0);
        }
        if (self.status == 'rejected') {
            setTimeout(() => {
                try {
                    let res = onRejected(self.value);
                    resolve(res)
                } catch (e) {
                    reject(e)
                }
            }, 0);
        }
    })
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值