Promesa de escritura a mano (2)

Entonces se dice que la realización es difícil, el resto es simple

1. Implementar la captura

catch (failFun) {
    return this.then(undefined, failFun)
  }

catch también devuelve una promesa, cámbiela sobre la base de entonces

2. Implementación de rechazar () y resolver ()

Hablemos primero del uso

Promise.reject(1) // 失败
Promise.resolve(2) // 成功
Promise.resolve(Promise.resolve(2)) // 成功
Promise.resolve(Promise.reject(2)) // 失败

La resolución puede pasar un valor o un objeto Promise, el rechazo solo puede pasar un valor, no un objeto Promise (el documento dice)

// 返回一个失败的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)
      }
    })
  }

utilizar:

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. Implementación de todos y raza

todos:

// 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视为失败
        })
      })
    })
  }

experimentar:


// 使用 实例化一个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)
})

No hay problema ok

carrera:

// race 也返回一个Promise, 谁先有结果就是谁
  static race = (promiseArr) => {
    return new Promise((resolve, reject) => {
      promiseArr.forEach((promiseItem) => {
        promiseItem.then((res) => {
          resolve(res)
        }, (error) => {
          reject(error)
        })
      })
    })
  }

De acuerdo, el código fuente de Promise ha terminado

4. Tarea macro, micro tarea

Micro tarea: promesa

Tarea macro: temporizador

setTimeout(() => {
      console.log(1)
    }, 0)
    new Promise((resolve) => {
      console.log(2)
      resolve()
    }).then(() => {
      console.log(3)
    }).then(() => {
      console.log(4)
    })
    console.log(5)

Mirando el código de arriba a abajo, setTimeout se coloca en la cola de macro de tareas. Cuando cumple con la Promesa, primero genera 2. La nueva Pomise se sincroniza y luego se resuelve, la Promesa tiene éxito, y luego hacia abajo y luego, coloca. Then (console.log ( 3)) Poner en la cola de micro-tareas, en este momento console.log (3) aún no se ha ejecutado, y console.log (4) aún no es su turno, y luego la salida 5, esta vez se ha ejecutado el código sincronizado, primero Mire la micro tarea, se ejecuta la salida 3, 3, las 4 siguientes se colocan en la cola de micro tareas y luego ejecutan 4, la cola de micro tareas está vacía y la cola de macro tareas 1 se ejecuta

2 5 3 4 1

 

Supongo que te gusta

Origin blog.csdn.net/Luckyzhoufangbing/article/details/108688473
Recomendado
Clasificación