function MyPromise(executor) {
this.PromiseState = 'pending'
this.PromiseResult = null
this.callbacks = []
const self = this;
//成功函数
function resolve(value) {
if (self.PromiseState !== 'pending') return
self.PromiseState = 'fulfilled'
self.PromiseResult = value
setTimeout(() => {
self.callbacks.forEach(element => {
element.onResolved(value)
})
});
}
//失败函数
function reject(reson) {
if (self.PromiseState !== 'pending') return
self.PromiseState = 'rejected'
self.PromiseResult = reson
setTimeout(() => {
self.callbacks.forEach(element => {
element.onRejected(resolve)
})
});
}
try {
executor(resolve, reject)
} catch (e) {
reject(e)
}
}
//绑定then到原型链上
MyPromise.prototype.then = function (onResolved, onRejected) {
if (typeof onRejected !== 'function') {
onRejected = reson => {
throw reson
}
}
if (typeof onResolved !== 'function') {
onResolved = value => value
}
//返回一个新的MyPromise方便以后链式调用
return new MyPromise((resolve, reject) => {
let self = this;
function handle(callback) {
try {
let result = callback(self.PromiseResult)
if (result instanceof MyPromise) {
result.then(v => {
resolve(v)
}, r => {
reject(r)
})
} else {
resolve(result)
}
} catch (e) {
reject(e)
}
}
if (this.PromiseState == 'pending') {
this.callbacks.push({
onResolved(value) {
handle(onResolved)
},
onRejected(value) {
handle(onRejected)
}
})
}
if (this.PromiseState === 'fulfilled') {
setTimeout(() => {
handle(onResolved)
});
}
if (this.PromiseState === 'rejected') {
setTimeout(() => {
handle(onRejected)
});
}
})
}
//绑定catch到原型链上
MyPromise.prototype.catch = function (onRejected) {
return this.then(undefined, onRejected)
}
Es6 Class
class MyPromise {
constructor(executor) {
this.PromiseState = 'pending' //执行状态
this.reason = '' //错误信息
this.PromiseResult = null //返回值
this.callbacks = [] //函数组
executor(this.resolve.bind(this), this.reject.bind(this))
}
//成功的回调
resolve(value) {
if (value instanceof MyPromise) {
value.then(this.resolve.bind(this),this.reject.bind(this));
return;
}
this.PromiseState = 'fulfilled'
this.PromiseResult = value
this.callbacks.forEach(callback => {
this._handler(callback)
})
}
//失败回调函数
reject(reson) {
if (reson instanceof MyPromise) {
reson.then(this.resolve.bind(this),this.reject.bind(this));
return;
}
this.PromiseState = 'rejected'
this.PromiseResult = reson
this.callbacks.forEach(callback => {
this._handler(callback)
})
}
then(onResolved, onRejected) {
return new MyPromise((nextResolve, nextReject) => {
// 这里之所以把下一个Promsie的resolve函数和reject函数也存在callback中
// 是为了将onResolved的执行结果通过nextResolve传入到下一个Promise作为它的value值
this._handler({
nextResolve,
nextReject,
onResolved,
onRejected
});
});
}
//失败函数
catch(onRejected) {
return this.then(undefined, onRejected)
}
_handler(callback) {
const {
onResolved,
onRejected,
nextResolve,
nextReject
} = callback;
if (this.PromiseState === 'pending') {
this.callbacks.push(callback);
return;
}
if (this.PromiseState === 'fulfilled') {
// 传入存储的值
// 未传入onResolved时,value传入
const nextValue = onResolved ? onResolved(this.PromiseResult) : this.PromiseResult;
nextResolve(nextValue);
return;
}
if (this.PromiseState === 'rejected') {
// 传入存储的错误信息
// 同样的处理
const nextReason = onRejected ? onRejected(this.reason) : this.reason;
nextReject(nextReason);
}
}
}