それなら実現は難しいと言われ、残りは簡単です
1.キャッチを実装する
catch (failFun) {
return this.then(undefined, failFun)
}
キャッチも約束を返し、それに基づいて変更します
2. react()およびresolve()の実装
最初に使用法について話させてください
Promise.reject(1) // 失败
Promise.resolve(2) // 成功
Promise.resolve(Promise.resolve(2)) // 成功
Promise.resolve(Promise.reject(2)) // 失败
Resolveは値またはPromiseオブジェクトを渡すことができ、rejectは値のみを渡すことができ、Promiseオブジェクトは渡すことができません(ドキュメントによると)
// 返回一个失败的Promise
static reject = (value) => {
return new Promise((resolve, reject) => {
reject(value)
})
}
// 成功的回调 返回一个Promise
static resolve = (value) => {
return new Promise((resolve, reject) => { // 如果是Promise 将结果执行返回
if (value instanceof Promise) {
value.then(resolve, reject)
} else { // 如果是值 直接返回
resolve(value)
}
})
}
使用する:
window.Promise = new Promise
// let p = Promise.resolve(22)
// let p = Promise.resolve(Promise.resolve(2))
let p = Promise.resolve(Promise.reject(2))
p.then((res) => {
console.log(res)
}, (error) => {
console.log(error)
})
3.すべてとレースの実装
すべて:
// Promise.all 接受一个promise数组
// 如果其中有一个执行失败 则整个失败 全部成功才算成功
// 成功的返回值 是一个是数组,数组中是每一个promise的成功返回值,顺序与接受一个promise数组顺序一一对应
// 并返回一个新的Promise
static all = (promiseArr) => {
let values = [] // 接受成功的 Promise 的返回值
let successCount = 0 // 成功个数计数
return new Promise((resolve, reject) => {
// 遍历执行每个promise
promiseArr.forEach((p, index) => {
p.then((res) => {
successCount++
// 如果数组中的promise执行成功,按照传入的数组的顺序来,把返回值放入数组中
values[index] = res
// 每一个都成功的判断
if (successCount === promiseArr.length) {
resolve(values)
}
}, (error) => {
reject(error) // 有一个失败 返回的新的promise视为失败
})
})
})
}
実験:
// 使用 实例化一个Promise 传入一个函数,这个函数有两个参数,每个参数也是一个函数
let p = new Promise((resolve, reject) => {
setTimeout(() => {
var random = Math.random()
if (random > 0.5) {
resolve(`success: ${random}`)
} else {
reject(`fail: ${random}`)
}
}, 1000)
})
window.Promise = new Promise
let p1 = Promise.resolve('success 1')
let p2 = Promise.resolve(Promise.resolve('success 2'))
Promise.all([p, p1, p2]).then((res) => {
console.log(res)
}, (error) => {
console.log(error)
})
問題ありません
人種:
// race 也返回一个Promise, 谁先有结果就是谁
static race = (promiseArr) => {
return new Promise((resolve, reject) => {
promiseArr.forEach((promiseItem) => {
promiseItem.then((res) => {
resolve(res)
}, (error) => {
reject(error)
})
})
})
}
さて、Promiseのソースコードは終わりました
4.マクロタスク、ミクロタスク
マイクロタスク:約束
マクロタスク:タイマー
setTimeout(() => {
console.log(1)
}, 0)
new Promise((resolve) => {
console.log(2)
resolve()
}).then(() => {
console.log(3)
}).then(() => {
console.log(4)
})
console.log(5)
コードを上から下に見ると、setTimeoutはマクロタスクキューに配置されます。Promiseに達すると、最初に2が出力されます。新しいPomiseは同期されてから解決され、Promiseは成功し、次にダウンしてから、.then(console.log(console.log( 3))マイクロタスクキューに入れます。この時点では、console.log(3)はまだ実行されておらず、console.log(4)はまだ順番になっておらず、出力5です。今回は、同期されたコードが最初に実行されました。マイクロタスクを見ると、出力3、3が実行され、それに続く4がマイクロタスクキューに入れられ、次に4が実行されます。マイクロタスクキューは空で、マクロタスクキュー1が実行されます。
2 5 3 4 1