js 手写promise
<script>
class MyPromise {
constructor(constr) {
this.status = "pending"
this.thenCallback = undefined
this.catchCallback = undefined
this.value = undefined
try {
constr(this.resolve, this.reject)
} catch {
this.reject(error)
}
}
resolve = (value) => {
if (this.status !== "pending") return
this.status = "resolve"
this.value = value
if (value instanceof MyPromise) {
value.then((res) => {
this.thenCallback(res)
})
} else {
setTimeout(() => {
if (this.thenCallback) {
this.thenCallback(value)
}
})
}
}
reject = (value) => {
if (this.status !== "pending") return
this.status = "reject"
this.value = value
setTimeout(() => {
if (this.catchCallback) {
this.catchCallback(value)
} else if (this.thenCallback) {
this.thenCallback(value)
} else {
throw ("error")
}
})
}
then = (callback) => {
// 实现链式调用,需要return一个promise对象
return new MyPromise((resolve, reject) => {
this.thenCallback = (value) => {
if (this.status == "reject") {
reject(value)
} else {
let result = callback(value)
// 如果then返回的是reject 直接注册catch 拿到结果直接执行catch
if (result instanceof MyPromise && result.status=="reject") {
result.catch((res) => {
reject(result)
})
} else {
resolve(result)
}
}
}
})
}
catch = (callback) => {
return new MyPromise((resolve, reject) => {
this.catchCallback = (value) => {
let res = callback(res)
resolve(res)
}
})
}
static all = (promiseArr) => {
let result = []
return new MyPromise((resolve, reject) => {
for (let i = 0; i < promiseArr.length; i++) {
promiseArr[i].then((res) => {
result.push(res)
let success = promiseArr.every(item => {
return item.status === 'resolve';
})
if (success) {
resolve(result)
}
// if (i == promiseArr.length - 1) {
// resolve(result)
// }
})
}
})
}
static race = (promiseArr) => {
return new MyPromise((resolve, reject) => {
for (let i = 0; i < promiseArr.length; i++) {
promiseArr[i].then((res) => {
resolve(res)
}).tacth((err) => {
reject(err)
})
}
})
}
}
new MyPromise((resolve, reject) => {
setTimeout(() => {
resolve('成功');
console.log(121)
}, 3000)
// reject('失败')
}).then(value => {
console.log('res1', value);
return '12345678'
}).then((res) => {
console.log(res)
return 666
}).then((res) => {
console.log(res)
return 666
}).then((res) => {
console.log(res)
return 777
}).then((res) => {
console.log(res)
return 888
})
let a = new MyPromise((resolve, reject) => {
setTimeout(() => {
resolve(1)
}, 2000)
})
let a2 = new MyPromise((resolve, reject) => {
setTimeout(() => {
resolve(2)
}, 2000)
})
let a3 = new MyPromise((resolve, reject) => {
setTimeout(() => {
resolve(3)
}, 2000)
})
MyPromise.all([a, a2, a3]).then((res) => {
console.log(res)
})
</script>