promise

最新推荐文章于 2025-11-24 03:12:01 发布

原创最新推荐文章于 2025-11-24 03:12:01 发布 · 293 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

手写promise

class MyPromiseTest {

    static PENDING = '开始';
    static SUCCESS = '成功';
    static FAIL = '失败';
    
    constructor(func){
        this.status = MyPromiseTest.PENDING;
        this.result = null;
        this.resolveFun = [];
        this.rejectFun = [];
        try {
            func(this.resolve.bind(this),this.reject.bind(this))
        } catch (error) {
            this.reject(error)
        }
        
    }
    resolve(result){
        setTimeout(() => {
            if(this.status === MyPromiseTest.PENDING){
                this.status = MyPromiseTest.SUCCESS;
                this.result = result;
                this.resolveFun.forEach(item =>{
                    item(this.result);
                })
            }
        });
        
    }
    reject(result){
        setTimeout(() => {
            if(this.status === MyPromiseTest.PENDING){
                this.status = MyPromiseTest.FAIL;
                this.result = result;
                this.rejectFun.forEach(item =>{
                    item(this.result);
                })
            } 
        });

    then(OnResolve,OnReject){
        OnResolve = typeof OnResolve === 'function' ?  OnResolve : ()=>{};
        OnReject = typeof OnReject === 'function' ?  OnReject : ()=>{};

        if(this.status === MyPromiseTest.PENDING){
            this.resolveFun.push(OnResolve);
            this.rejectFun.push(OnReject);
        }
        if( this.status === MyPromiseTest.SUCCESS){
            setTimeout(() => {
                OnResolve(this.result) 
            });
            
        }
        if(this.status === MyPromiseTest.FAIL){
            setTimeout(() => {
                OnReject(this.result)
            });
            
        }
    }


}

console.log('1');
let pppp = new MyPromiseTest(function (resolve,reject) {
      console.log('2');
      setTimeout(() => {
        resolve('成果时....');
        console.log('4');
      }, 0);
     
     //只写一个reject的话
    //reject('不对');
     // throw new Error('错了');
})

// console.log(pppp);

pppp.then(
    function (d) { 
        console.log(d);
    },
    function(){

    }
)
console.log('3');

遇到的问题

 1. 构造函数调用resolve方法,在构造的时候必须改变this指向

在这里插入图片描述

 2. 在then方法里变边,判断两个参数是否都有值.或者会报函数未定义错误

在这里插入图片描述

 3. 输出顺序问题,异步没有处理好

在这里插入图片描述

 4. 还是异步问题,若我们在创建实例的时候在配置里边添加延迟,延迟调用resolve方法,会出现调用then不输出结果的问题?

在这里插入图片描述