all-of-javascript
all-of-javascript copied to clipboard
实现一个 Promise
/**
* promise 实现
* copyed from https://juejin.im/post/5b83cb5ae51d4538cc3ec354
*/
isFunction = (f) => typeof f === 'function'
// promise 状态
const PENDING = 'PENDING'
const FULFILLED = 'FULFILLED'
const REJECTED = 'REJECTED'
class MyPromise {
constructor(handle){
if(!isFunction(handle)){
throw new Error('my promise must accept a function as a parameter')
}
// 初始状态都是 pending
this._status = PENDING
// 初始值
this._value = undefined
// 成功回调队列
this._fulfilledQueues = []
// 失败回调队列
this._rejectedQueues = []
// 构造初始化(handle函数并不会放进 micro tasks中,而是在主线程直接执行)
try {
handle(this._resolve.bind(this), this._reject.bind(this))
} catch (error) {
this._reject(error)
}
}
_resolve(val){
const run = () => {
if(this._status !== PENDING) return
this._status = FULFILLED
// 执行成功队列
const runFulFilled = (value) => {
let cb
while(cb = this._fulfilledQueues.shift()){
cb(value)
}
}
// 失败队列
const runRejected = error => {
let cb
while(cb = this._rejectedQueues.shift()){
cb(error)
}
}
// 如果 resolve 的是一个 promise
if(val instanceof MyPromise){
val.then(value => {
this._value = value
runFulFilled(value)
},err => {
this._value = err
runRejected(err)
})
}else{
this._value = val
runFulFilled(val)
}
}
setTimeout(run, 0)
}
_reject(err){
if(this._status !== PENDING) return
const run = () => {
this._status = REJECTED
this._value = err
let cb
while(cb = this._rejectedQueues.shift()){
cb(err)
}
}
setTimeout(() => run(), 0)
}
// 抓住的是 之前-现在-未来
then(onFulfilled, onRejected){
const { _value, _status } = this
// 再返回一个 promise 对象,以支持链式调用
return new MyPromise((onFulfilledNext, onRejectedNext) => {
// 封装成功执行的函数
let fulfilled = value => {
try {
// 如果不是函数的话,忽略并改变状态,返回上一个promise值
if(!isFunction(onFulfilled)){
onFulfilledNext(value)
}else{
let res = onFulfilled(value)
if(res instanceof MyPromise){
// 如果当前回调函数返回MyPromise对象,必须等待其状态改变后在执行下一个回调
res.then(onFulfilledNext, onRejectedNext)
}else{
onFulfilledNext(res)
}
}
} catch (error) {
onRejectedNext(error)
}
}
// 封装失败执行的函数
let rejected = error => {
try {
// 如果不是函数的话,忽略并改变状态,返回上一个promise值
if(!isFunction(onRejected)){
onRejectedNext(error)
}else{
let res = onRejected(error)
if(res instanceof MyPromise){
// 如果当前回调函数返回MyPromise对象,必须等待其状态改变后在执行下一个回调
res.then(onFulfilledNext, onRejectedNext)
}else{
onFulfilledNext(res)
}
}
} catch (error) {
onRejectedNext(error)
}
}
switch(_status){
case PENDING:
this._fulfilledQueues.push(fulfilled)
this._rejectedQueues.push(rejected)
break
case FULFILLED:
fulfilled(_value)
break
case REJECTED:
rejected(_value)
break
}
})
}
catch(onRejected){
return this.then(undefined, onRejected)
}
static resolve(value){
if(value instanceof MyPromise) return value
return new MyPromise(resolve => resolve(value))
}
static reject(value){
return new MyPromise((resolve, reject) => reject(value))
}
static all(list){
return new MyPromise((resolve, reject) => {
let values = []
let count = 0
for(let [i, p] of list.entries()){
this.resolve(p).then(res => {
values[i] = res
count++
if(count === list.length) resolve(values)
},err => {
reject(err)
})
}
})
}
static race(list){
return new MyPromise((resolve, reject) => {
for(let p of list){
this.resolve(p).then(res => {
resolve(res)
},err => {
reject(err)
})
}
})
}
finally(cb){
return this.then(
value => MyPromise.resolve(cb()).then(() => value),
reason => MyPromise.resolve(cb()).then(() => {throw reason})
)
}
}