promise手写源码

class PromiseNew{
    constructor(fn){
        this.satate="PENDING"
        this.doneList = []
        this.failList = []
        fn(this.resolve.bind(this) ,this.reject.bind(this))  //fn是外部函数,里面this已经改变,所以要绑定bind
    }
    done(handle){
        if(typeof  handle ==="function"){
            this.doneList.push(handle)
        }else{
            throw new Error("缺少回调函数")
        }
        return this
    }
    fail(handle){
        if(typeof  handle ==="function"){
            this.failList.push(handle)
        }else{
            throw new Error("缺少回调函数")
        }
        return this
    }
    then(success,fail){
        this.done(success  || function(){}).fail(fail || function(){})
        return this
    }

    resolve () {
        this.satate="RESOLVED"
        let args =Array.prototype.slice.call(arguments)
        setTimeout(function(){
            this.doneList.forEach((item, key) => {
                let arg = item.apply(null,args)  //实际上doneList中第一个函数的返回值是第二个函数的参数
                args = [] //清空参数
                args.push(arg)
            });
            this.doneList =[] //清空数据
        }.bind(this), 200)
        return this
    }
    reject(){
        this.satate="REJECTED"
        let args =Array.prototype.slice.call(arguments)
        setTimeout(function(){
            this.failList.forEach((item, key) => {
                let arg = item.apply(null,args)
                args = [] 
                args.push(arg)
            });
            this.failList =[] //清空数据
        }.bind(this), 200)
        console.log("reject 执行")
    }
}
new PromiseNew((resolve,reject)=>{
    resolve("啪啪啪")
    reject()
    console.log("ben")
}).then((value)=>{
    console.log("success",value)
    return 9999
},()=>{
    console.log("fail")
})

 

以下是手写Promise实现: ```javascript class MyPromise { constructor(executor) { this.status = 'pending'; this.value = undefined; this.reason = undefined; this.onResolvedCallbacks = []; this.onRejectedCallbacks = []; const resolve = (value) => { if (this.status === 'pending') { this.status = 'fulfilled'; this.value = value; this.onResolvedCallbacks.forEach(fn => fn()); } }; const reject = (reason) => { if (this.status === 'pending') { this.status = 'rejected'; this.reason = reason; this.onRejectedCallbacks.forEach(fn => fn()); } }; try { executor(resolve, reject); } catch (error) { reject(error); } } then(onFulfilled, onRejected) { onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : value => value; onRejected = typeof onRejected === 'function' ? onRejected : reason => { throw reason }; const promise2 = new MyPromise((resolve, reject) => { if (this.status === 'fulfilled') { setTimeout(() => { try { const x = onFulfilled(this.value); resolvePromise(promise2, x, resolve, reject); } catch (error) { reject(error); } }, 0); } if (this.status === 'rejected') { setTimeout(() => { try { const x = onRejected(this.reason); resolvePromise(promise2, x, resolve, reject); } catch (error) { reject(error); } }, 0); } if (this.status === 'pending') { this.onResolvedCallbacks.push(() => { setTimeout(() => { try { const x = onFulfilled(this.value); resolvePromise(promise2, x, resolve, reject); } catch (error) { reject(error); } }, 0); }); this.onRejectedCallbacks.push(() => { setTimeout(() => { try { const x = onRejected(this.reason); resolvePromise(promise2, x, resolve, reject); } catch (error) { reject(error); } }, 0); }); } }); return promise2; } catch(onRejected) { return this.then(null, onRejected); } } function resolvePromise(promise2, x, resolve, reject) { if (promise2 === x) { return reject(new TypeError('Circular reference')); } if (x instanceof MyPromise) { x.then(value => { resolvePromise(promise2, value, resolve, reject); }, reject); } else if (x !== null && (typeof x === 'object' || typeof x === 'function')) { let then; try { then = x.then; if (typeof then === 'function') { then.call(x, value => { resolvePromise(promise2, value, resolve, reject); }, reason => { reject(reason); }); } else { resolve(x); } } catch (error) { reject(error); } } else { resolve(x); } } ``` 以上是一个基本的Promise实现,它具有Promise的基本特性,包括状态管理、异步操作、链式调用、错误处理等。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [超详细!一次性搞懂手写Promise全过程](https://blog.csdn.net/qq_41852789/article/details/128453341)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* *3* [Promise学习-手写一个promise](https://blog.csdn.net/qq_42161935/article/details/120672260)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值