共计 2260 个字符，预计需要花费 6 分钟才能阅读完成。
极简版 Promise 满足的使用方式
生成实例对象的方式：new MyPromise()
通过类直接调用静态方法：MyPromise.resolve()，目前静态方法仅支持 resolve & reject
亲测使用 OK，欢迎指教，互相学习，github 链接，欢迎 star。附赠利用构造函数手写 Promise 的方法，github 链接。
class MyPromise {
constructor(fn) {
// 定义 Promise 三种状态
this.states = {
PENDING: ‘PENDING’, RESOLVED: ‘RESOLVED’, REJECTED: ‘REJECTED’
}
// 定义传递到 then 的 value
this.value = null
// 定义当前 Promise 运行状态
this.state = this.states.PENDING
// 定义 Promise 失败状态的回调函数集合
this.resolvedCallBacks = []
// 定义 Promise 成功状态的回调函数集合
this.rejectedCallBacks = []
// 为静态方法定义其内部使用的指向实例的 that
MyPromise.that = this
try {
// 执行 new MyPromise() 内传入的方法
fn(MyPromise.resolve, MyPromise.reject)
} catch (error) {
MyPromise.reject(this.value)
}
}
// 静态 resolve 方法，MyPromise 实例不可访问；
// 支持类 MyPromise 访问，例：MyPromise.resolve(‘success’).then(e=>e)
static resolve(value) {
// 由于静态方法内部的 this 指向 类 而不是 实例，所以用下面的方法访问实例对象
const that = MyPromise.that
// 判断是否是 MyPromise 实例访问 resolve
const f = that instanceof MyPromise
// MyPromise 实例对象访问 resolve
if (f && that.state == that.states.PENDING) {
that.state = that.states.RESOLVED
that.value = value
that.resolvedCallBacks.map(cb => (that.value = cb(that.value)))
}
// MyPromise 类访问 resolve
if (!f) {
const obj = new MyPromise()
return Object.assign(obj, {
state: obj.states.RESOLVED,
value
})
}
}
// 静态 reject 方法，MyPromise 实例不可访问；
// 支持类 MyPromise 访问，例：MyPromise.reject(‘fail’).then(e=>e)
static reject(value) {
const that = MyPromise.that
const f = that instanceof MyPromise
if (f && that.state == that.states.PENDING) {
that.state = that.states.REJECTED
that.value = value
that.rejectedCallBacks.map(cb => (that.value = cb(that.value)))
}
if (!f) {
const obj = new MyPromise()
return Object.assign(obj, {
state: obj.states.REJECTED,
value
})
}
}
// 定义在 MyPromise 原型上的 then 方法
then(onFulfilled, onRejected) {
const {PENDING, RESOLVED, REJECTED} = this.states
const f = typeof onFulfilled == “function” ? onFulfilled : c => c;
const r =
typeof onRejected == “function”
? onRejected
: c => {
throw c;
};
switch (this.state) {
case PENDING:
//‘PENDING’状态下向回调函数集合添加 callback
this.resolvedCallBacks.push(f)
this.rejectedCallBacks.push(r)
break;
case RESOLVED:
// 将回调函数的返回值赋值给 实例的 value，满足链式调用 then 方法时传递 value
this.value = f(this.value)
break;
case REJECTED:
// 同上
this.value = r(this.value)
break;
default:
break;
}
// 满足链式调用 then，返回 MyPromise 实例对象
return this
}
}
MyPromise.resolve(‘success’).then((e) => {
console.log(e);
return e + 1
}).then(res=> {
console.log(res);
})
new MyPromise(resolve => {
setTimeout(() => {
resolve(1);
}, 2000);
})
.then(res1 => {
console.log(res1);
return 2;
})
.then(res2 => console.log(res2));
