原生JS实现简单的Promise

javascript es6 标准中的 Promise 对象在 js 编程中使用量很大，使用 Promise 可以让异步逻辑在开发中清晰很多，了解其原理则有益在开发过程中更清晰的使用 Promise 对象，或者能在没有 Promise 原生支持的 es5 标准下简单的造一个 Promise 对象出来。下边就手写一个简单版本的 Promise。首先要了解 Promise 的基本用法，Promise 是一个原生支持的构造函数，需要传入一个自定义函数，接受两个参数 resolve 和 reject，resolve 接受成功数据回调，reject 用于处理异常。基本用法为：

var exp1 = new Promise(function(resolve,reject){
    try{setTimeout(function(){
            xxx
            resolve(xx)
        },3000)
    }catch(e){reject(e)
    }
})

exp1.then(function(data){xxx})

以下为 es5 的原生简单实现，满足了 then 的简单调用

function PromiseX(fun){
    var _this = this;
    this.status = 'pendding';
    this.data = null;
    this.error = null;
    var resolve = function(data){_this.changeStatus('success');
        _this.thenCb&&_this.thenCb(data);
        _this.data = data;
    }
    var reject = function(e){_this.changeStatus('error');
        _this.thenErrCb&&_this.thenErrCb(e);
        _this.error = e;
    }
    fun&&fun(resolve,reject)
}
PromiseX.prototype.then = function(cb,errCb){if(this.data){cb&&cb(this.data);
    }
    if(this.error){errCb&&errCb(this.error);
    }
    this.thenCb = cb;
    this.thenErrCb = errCb;
    return this;
}
PromiseX.prototype.changeStatus = function(status){this.status = status;}

使用方法同 es6 的使用方法一样

var testPromiseX = new PromiseX(function(resolve){setTimeout(function(){resolve(1)
    },3000)
})
testPromiseX.then(function(res){alert(res)
})