概念
这个主要是用于解决异步回调代码的噩梦，在ES6新增了Promise对象，可以直接使用。因为当多层异步代码存在时，可能会造成代码嵌套多层难以维护。比如：
todo(function () {
todo(function () {
todo(function () {
//...
})
})
})
其特点如下：
- 一旦创建实例则马上执行
- 状态只能从pending => resolved或者pending => rejected
- 状态一旦改变就不可更改
- 使用同步代码的方式来处理异步回调
当然这里只是实现了一个简易版，更详细的Promise对象信息你可以访问http://es6.ruanyifeng.com/#docs/promise
实现
const MyPromise = (function () {
const PENDING = "pending"; //初始状态
const RESOLVED = "resolved"; //已正确完成
const REJECTED = "rejected"; //抛出错误、失败
function F(fn) {
const that = this;
this.state = PENDING; //初始化状态
this.value = null; //保存传递的值
this.resolvedFnStack = []; //正确完成后要调用的方法栈
this.rejectedFnStack = []; //出现错误或者失败时要调用的方法栈
typeof fn === 'function' && fn(resolve, reject); //创建对象立刻调用传入的函数
function resolve(v) { //正确完成时，内部调用方法
if (that.state === PENDING) { //首先要判断是否是初始状态，因为状态只有两种变化，不能逆转
that.value = v; //保存传递的值
that.state = RESOLVED; //将状态置为 已正确完成
that.resolvedFnStack.forEach(item => item(that.value)); //调用方法栈中的方法
}
}
function reject(v) {
if (that.state === PENDING) {
that.value = v;
that.state = REJECTED;
that.rejectedFnStack.forEach(item => item(that.value));
}
}
};
F.prototype.then = function(resolvedFn) { //异步执行，同步写法的关键。成功会调用的方法
if (typeof resolvedFn === 'function') {
if (this.state === RESOLVED) resolvedFn(this.value);
else this.resolvedFnStack.push(resolvedFn);
}
return this;
};
F.prototype.catch = function(rejectedFn) {
if (typeof rejectedFn === 'function') {
if (this.state === REJECTED) rejectedFn(this.value);
else this.resolvedFnStack.push(rejectedFn);
}
return this;
};
return F;
})();
测试
new MyPromise((resolve, reject) => {
console.log("run");
console.log(new Date().getTime());
setTimeout(_ => {
resolve("then run");
console.log(new Date().getTime());
}, 3000)
}).then(val => {
console.log(val);
});
// run
// 1556420154593
// then run
// 1556420157593
