1实现异步调用
const PENDDING = 'pendding',
RESOLVED = 'resolved',
REJECTED = 'rejected'
class myPromise {
constructor(handler){
this.status = PENDDING
this.value = undefined
this.resolveCallback = []
this.rejectCallback = []
let resolve = (value)=>{
if(this.status === PENDDING){
this.status = RESOLVED
this.value = value
this.resolveCallback.forEach((cb)=>{
cb()
})
}
}
let reject = (error)=>{
if(this.status === PENDDING){
this.status = REJECTED
this.reason = error
this.rejectCallback.forEach((cb)=>{
cb()
})
}
}
try{
handler(resolve,reject)
}catch{
reject(error)
}
}
then(onResolve=val=>val,onReject){
if(this.status === PENDDING){
this.resolveCallback.push(()=>onResolve(this.value))
}
if(this.status === RESOLVED){
onResolve(this.value)
}
if(this.status === REJECTED){
onReject(this.reason)
}
}
}
new myPromise((resolve)=>{
setTimeout(()=>{
resolve(123)
},2000)
}).then((res)=>{
console.log(res)
})
2.实现 链式调用并返回普通值 主要是promiseResultProduce这个函数
const PENDDING = 'pendding',
RESOLVED = 'resolved',
REJECTED = 'rejected'
class myPromise {
constructor(handler){
this.status = PENDDING
this.value = undefined
this.resolveCallback = []
this.rejectCallback = []
let resolve = (value)=>{
if(this.status === PENDDING){
this.status = RESOLVED
this.value = value
this.resolveCallback.forEach((cb)=>{
cb()
})
}
}
let reject = (error)=>{
if(this.status === PENDDING){
this.status = REJECTED
this.reason = error
this.rejectCallback.forEach((cb)=>{
cb()
})
}
}
try{
handler(resolve,reject)
}catch{
reject(error)
}
}
promiseResultProduce(promise2,val,resolve,reject){
if(val instanceof myPromise){
}else if((typeof val === 'object' || typeof val === 'function')){
if(typeof val.then === 'function'){
}else{
resolve(val)
}
}else{
resolve(val)
}
}
then(onResolve=val=>val,onReject){
if(this.status === PENDDING){
const promise2 = new myPromise((resolve,reject)=>{
this.resolveCallback.push(()=>{
let val = onResolve(this.value)
setTimeout(()=>{
this.promiseResultProduce(promise2,val,resolve,reject)
},0)
})
})
return promise2
}
if(this.status === RESOLVED){
const promise2 = new myPromise((resolve,reject)=>{
let val = onResolve(this.value)
setTimeout(()=>{
this.promiseResultProduce(promise2,val,resolve,reject)
},0)
})
return promise2
}
if(this.status === REJECTED){
onReject(this.reason)
}
}
}
new myPromise((resolve)=>{
setTimeout(()=>{
resolve(123)
},2000)
}).then((res)=>res)
.then((res)=>{
console.log(res)
return res
}).then((res)=>{
console.log(res)
})
3 实现 支持promise对象
const PENDDING = 'pendding',
RESOLVED = 'resolved',
REJECTED = 'rejected'
class myPromise {
constructor(handler){
this.status = PENDDING
this.value = undefined
this.resolveCallback = []
this.rejectCallback = []
let resolve = (value)=>{
if(this.status === PENDDING){
this.status = RESOLVED
this.value = value
this.resolveCallback.forEach((cb)=>{
cb()
})
}
}
let reject = (error)=>{
if(this.status === PENDDING){
this.status = REJECTED
this.reason = error
this.rejectCallback.forEach((cb)=>{
cb()
})
}
}
try{
handler(resolve,reject)
}catch{
reject(error)
}
}
promiseResultProduce(promise2,val,resolve,reject){
if(val instanceof myPromise){
if(val.status === PENDDING){
console.log(222)
val.then(y=>{
console.log(y)
this.promiseResultProduce(promise2,y,resolve,reject)
},reject)
}else{
/*注意此时val是promise自然有this.value,this.status,this.reason属性*/
val.status === RESOLVED && resolve(val.value)
val.status === REJECTED && reject(val.reason)
}
} else if((typeof val === 'object' || typeof val === 'function')){
} else{
console.log(1111)
resolve(val)
}
}
then(onResolve=val=>val,onReject){
if(this.status === PENDDING){
const promise2 = new myPromise((resolve,reject)=>{
this.resolveCallback.push(()=>{
let val = onResolve(this.value)
setTimeout(()=>{
this.promiseResultProduce(promise2,val,resolve,reject)
},0)
})
})
return promise2
}
if(this.status === RESOLVED){
const promise2 = new myPromise((resolve,reject)=>{
let val = onResolve(this.value)
this.resolveCallback.push(()=>{
setTimeout(()=>{
this.promiseResultProduce(promise2,val,resolve,reject)
},0)
})
})
return promise2
}
if(this.status === REJECTED){
onReject(this.reason)
}
}
}
new myPromise((resolve)=>{
setTimeout(()=>{
resolve(123)
},2000)
})
.then((res)=>{
console.log(res)
return new myPromise((resolve,reject)=>{
setTimeout(()=>{
resolve(666)
},2000)
})
})
.then((res)=>{
console.log(res)
})
4支持thenable对象
const PENDDING = 'pendding',
RESOLVED = 'resolved',
REJECTED = 'rejected'
class myPromise {
constructor(handler){
this.status = PENDDING
this.value = undefined
this.resolveCallback = []
this.rejectCallback = []
let resolve = (value)=>{
if(this.status === PENDDING){
this.status = RESOLVED
this.value = value
this.resolveCallback.forEach((cb)=>{
cb()
})
}
}
let reject = (error)=>{
if(this.status === PENDDING){
this.status = REJECTED
this.reason = error
this.rejectCallback.forEach((cb)=>{
cb()
})
}
}
try{
handler(resolve,reject)
}catch{
reject(error)
}
}
promiseResultProduce(promise2,val,resolve,reject){
if(val instanceof myPromise){
if(val.status === PENDDING){
val.then(y=>{
this.promiseResultProduce(promise2,y,resolve,reject)
},reject)
}else{
/*注意此时val是promise自然有this.value,this.status,this.reason属性*/
val.status === RESOLVED && resolve(val.value)
val.status === REJECTED && reject(val.reason)
}
} else if((typeof val === 'object' || typeof val === 'function')){
if(typeof val.then === 'function'){
val.then(y=>{
this.promiseResultProduce(promise2,y,resolve,reject)
},reject)
}else{
resolve(val)
}
} else{
resolve(val)
}
}
then(onResolve=val=>val,onReject){
if(this.status === PENDDING){
const promise2 = new myPromise((resolve,reject)=>{
this.resolveCallback.push(()=>{
let val = onResolve(this.value)
setTimeout(()=>{
this.promiseResultProduce(promise2,val,resolve,reject)
},0)
})
})
return promise2
}
if(this.status === RESOLVED){
const promise2 = new myPromise((resolve,reject)=>{
let val = onResolve(this.value)
this.resolveCallback.push(()=>{
setTimeout(()=>{
this.promiseResultProduce(promise2,val,resolve,reject)
},0)
})
})
return promise2
}
if(this.status === REJECTED){
onReject(this.reason)
}
}
}
// 支持thenable对象
// let result = {
// then(r){
// r(444)
// }
// }
// result.then(y=>{
// console.log(y)
// })
/*穿透的原理*/
// new myPromise((resolve)=>{
// setTimeout(()=>{
// resolve(123)
// },2000)
// }).then((res)=>res).then((res)=>{
// console.log(res)
// })
本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
