手动实现Promise

手写promise

export default class Promise{
    constructor(execute) {
        // 状态, 初始为pending, 成功状态fulfilled, 失败状态rejected
        this.PromiseState  = 'pending'
        // 结果
        this.PromiseResult = null
        // 多次then回调函数组
        this.callBacks = []

        // 成功回调
        const resolve = (data)=> {
            //只执行一次
            if(this.PromiseState !== 'pending') return 
            // 改变状态
            this.PromiseState = 'fulfilled'
            // 赋值
            this.PromiseResult = data
            // 异步then调用
            setTimeout(() => {
                this.callBacks.forEach(x=>{
                    x.onResolved(data)
                })
            });
        }

        // 失败回调
        const reject = (data)=> {
            //只执行一次
            if(this.PromiseState !== 'pending') return
            this.PromiseState = 'rejected'
            this.PromiseResult = data
            setTimeout(() => {
                this.callBacks.forEach(x=>{
                    x.onRejected(data)
                })
            });
        }
        try {
            execute(resolve, reject)
        } catch (error) {
            reject(error)
        }
    }

    // 添加then方法
    then(onResolved, onRejected){
        // 默认onRejected
        if(typeof onRejected !== 'function') {
            onRejected = reason =>{
                throw reason
            }
        }
        // 默认onResolved
        if(typeof onResolved !== 'function') {
            onResolved = value => value
        }
    
        return new Promise((resolve, reject)=>{
            // 封装函数
            const callBack = (type)=>{
                try{
                    let result = type(this.PromiseResult)
                    if(result instanceof Promise) {
                        result.then(r=>{
                            resolve(r)
                        },v=>{
                            reject(v)
                        })
                    }else {
                        resolve(result)
                    }
                }catch(e){
                    reject(e)
                }
            }
            // 判断fulfilled状态
            if(this.PromiseState === 'fulfilled') {
                setTimeout(() => {
                    callBack(onResolved)
                });
            }
            // 判断rejected状态
            if(this.PromiseState === 'rejected') {
                setTimeout(() => {
                    callBack(onRejected)
                });
            }
            // 判断pending状态
            if(this.PromiseState === 'pending') {
                this.callBacks.push({
                    onResolved: ()=>{
                        callBack(onResolved)
                    },
                    onRejected: ()=>{
                        callBack(onRejected)
                    }
                })
            }
        })
    }

    // 添加catch方法
    catch(onRejected) {
        return this.then(undefined, onRejected)
    }
    
    // 添加resolve方法
    static resolve(value) {
        return new Promise((resolve, reject)=>{
            if(value instanceof Promise) {
                value.then(v=>{
                    resolve(v)
                },r=>{
                    reject(r)
                })
            }else{
                resolve(value)
            }
        })
    }
    // 添加reject方法
    static reject(value) {
        return new Promise((resolve, reject)=>{
            reject(value)
        })
    }

    // 添加 all 方法
    static all(promises) {
        let arr = [], count = 0
        return new Promise((resolve, reject)=>{
            for(let i=0;i<promises.length;i++) {
                promises[i].then(v=>{
                    arr[i] = v // 保存成功结果
                    count++ // 计数
                    // 判断
                    if(count === promises.length) {
                        // 修改状态
                        resolve(arr)
                    }
                },r=>{
                    reject(r)
                })
            }
        })
    }

    // 添加race 方法
    static race(promises) {
        return new Promise((resolve, reject)=>{
            for(let i=0; i<promises.length; i++) {
                promises[i].then(v=>{
                    resolve(v)
                },r=>{
                    reject(r)
                })
            }
        })
    }
}
posted @   含光~~仌槑槑仌  阅读(40)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 单元测试从入门到精通
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 上周热点回顾(3.3-3.9)
· winform 绘制太阳,地球,月球 运作规律
点击右上角即可分享
微信分享提示