function MyPromise(func) {
this.status = 'pending' // resolve, reject
this.thenFuncs = []
this.catchFuncs = []
this.value = undefined
func(MyPromise.resolve.bind(this), MyPromise.reject.bind(this))
}
MyPromise.resolve = function(result) {
this.value = result
this.status = 'resolve'
this.thenFuncs.forEach(func => func(result))
}
MyPromise.reject = function(error) {
this.value = error
this.status = 'reject'
this.catchFuncs.forEach(func => func(error))
}
MyPromise.prototype.then = function(thenFunc) {
if (this.status === 'resolve') {
thenFunc(this.value)
} else {
this.thenFuncs.push(thenFunc)
}
return this
}
MyPromise.prototype.catch = function(catchFunc) {
if (this.status === 'reject') {
catchFunc(this.value)
} else {
this.catchFuncs.push(catchFunc)
}
return this
}
// ----- start ----------
new MyPromise((resolve, reject) => {
if (false) {
setTimeout(() => {
resolve(123)
}, 3000)
} else {
reject('error')
}
}).then(result => {
console.log(result)
}).then(result => {
console.log(result)
}).then(result => {
console.log(result)
}).catch(error => {
console.log(error)
}).catch(error => {
console.log(error)
}).catch(error => {
console.log(error)
})
我们会发现我们用自己封装的 Promise 的时候,当我们 new Promise 里传的不是异步方法,那它的 .then 会优先执行,这和原生的 Promise 有些不符
其实是因为原生的 Promise 将任务添加到了微任务里边
用到了 window 的 queueMicrotask API
queueMicrotask(() => {
/* 微任务中将运行的代码 */
});