面试官：用Promise.race方法来实现一个，接口调用超时，放弃结果的方法。「这是我参与11月更文挑战的第21天，活

const PENDING = 'pending'
const FULFILLED = 'fulfilled'
const REJECTED = 'rejected'
const resolvePromise = (promise, x, resolve, reject) => {
  //*******************************************************判断x与promsie是否是同一个promise，防止进入死循环*********************//////*********
  if(x === promise) throw new TypeError('Chaining cycle detected for promise #<Promise>')
  // 1.首先判断`x`是基础类型数据，还是引用类型，基础类型的数据直接`resolve`,即可。  
  if(x !== null && /^(object|function)$/.test(typeof x)){
    let then 
    // 2. 如果是引用类型的数据，尝试获取`x`上的`then`属性(`x.then`)，如果在获取属性的时候报异常则`reject`
    try{
      then = x.then
    }catch(e){
      reject(e)
    }
    //3. 判断`then`是否是函数，如果是一个函数则我们认定它为`Promise`,如果不是则`resolve`
    if(typeof then === 'function'){
      let called = false //**************************************这里加了变量*************************//////
      try{
        then.call(x, (y) => {
          if(called) return //**************************************这里加了变量*************************//////
          called = true
          resolvePromise(promise, y, resolve, reject)
        },(r) => {
          if(called) return//**************************************这里加了变量*************************//////
          reject(r)
        })
      }catch(e){
        if(called) return//**************************************这里加了变量*************************//////
        reject(e)
      }
    }else{
      resolve(x)
    }
  }else{
    //基础类型数据直接resolve
    resolve(x)
  }
}
class Promise{
  constructor(executor){

    this.state = PENDING
    this.value = undefined
    this.reason = undefined
    //存放onFulfilled
    this.onResolvedCallbacks = []
    //存放onRejected
    this.onRejectedCallbacks = []
    const resolve = (value) => {
       //如果发现value是一个Promise，我们需要调用value的then方法去递归解析
      if(value instanceof Promise){
          return value.then(resolve,reject); // 递归解析
      }
      if (this.state === PENDING) {
        this.value = value
        this.state = FULFILLED
        //promise实例状态改变后调用暂存的onFulfilled
        this.onResolvedCallbacks.forEach(fn => fn())
      }
    }

    const reject = (reason) => {
      if (this.state === PENDING) {
        this.reason = reason
        this.state = REJECTED
        //promise实例状态改变后调用的onRejected
        this.onRejectedCallbacks.forEach(fn => fn())
      }
    }
    try {
      //executor函数执行过程中出错，将会导致Promise失败
      executor(resolve,reject)
    } catch (error) {
      reject(error)
    }
  }
  then(onFulfilled, onRejected){
    onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : v => v
    onRejected = typeof onRejected === 'function' ? onRejected : err => { throw err }
    let promise = new Promise((resolve, reject) => {
        
        switch(this.state){
          case FULFILLED:
              setTimeout(() => {
                try{
                  let x = onFulfilled(this.value)
                  resolvePromise(promise, x, resolve, reject)
                } catch(e){
                  reject(e)
                }
              })   
              break
          case REJECTED:
              setTimeout(() => {
                try{
                  let x = onRejected(this.reason)
                  resolvePromise(promise, x, resolve, reject)
                } catch(e){
                  reject(e)
                }
              })   
              break
          default:
            this.onResolvedCallbacks.push(() => {
              setTimeout(() => {
                try{
                  let x = onFulfilled(this.value)
                  resolvePromise(promise, x, resolve, reject)
                } catch(e){
                  reject(e)
                }
              })
            })
            this.onRejectedCallbacks.push(() => {
              setTimeout(() => {
                try{
                  let x = onRejected(this.reason)
                  resolvePromise(promise, x, resolve, reject)
                } catch(e){
                  reject(e)
                }
              })
            })
        }
    })
    return promise
  }
  catch(onRejected){
    return this.then(null, onRejected)
  }

  finally(cb){
    return this.then(
        (y) => {
        return Promise.resolve(cb()).then(() => y)
        },
        (r) => {
        return Promise.resolve(cb()).then(() => {throw r})
        }
    )
  }  

  static rsolve(value){
    return new Promise((resolve,reject)=>{
              resolve(value);
    })
  }
  static reject(reason){
      return new Promise((resolve,reject)=>{
          reject(reason);
      })
  }

  static all (promsies){
        return new Promise((resolve, reject) => {
            const arr = []

            let count = 0
            const processResult = (i, val) => {
                arr[i] = val
                if(++times === promises.length) resolve(arr)
            }

            for(let i = 0; i < promises.length; i++){
                let val = promises[i]
                if(typeof val.then === 'function'){
                    val.then(y => processResult(i, y), reject)
                }else{
                    processResult(i, val)
                }
            }
        })
  }
  static race(promises) {
        return new Promsie((resolve, reject)=>{
            for(let i = 0; i < promise.length; i++){
                let p = promises[i]
                Promise.resolve(p).then(resolve, reject)
            }
        })
  }

}

本篇文章介绍

我们本篇文章，主要是使用Promise.race方法来实现调用接口超时放弃的功能，我们把他来封装成一个工具方法。

我们通过一个函数（wrap）来实现, 函数的返回值是Promise。
wrap函数的参数p表示我们需要传入的Promise，我们在wrap内部声明一个p1的Promsie将p1的reject方法暴露出去，利用Promise.race的特点，哪个Promise先完成就采用那个Promise的结果，假如我们传入的p，响应的时间超过了我们的期望，那我们就可以调用r.abort来放弃本次结果。

const wrap = (p) => {
  let abort = null

  let p1 = new Promise((resolve, reject) => {
    abort = reject
  })
  let r = Promise.race([p,p1])

  r.abort = abort
  
  return r
}

事例

通过一个小事例来更好的理解wrap方法。

let p = new Promise((resolve,reject) => {
  setTimeout(() => {
    resolve('模拟请求结果')
  },4000)
})

let newP = wrap(p)

setTimeout(() => {
  newP.abort('超过了3s放弃')//超时就不采用成功的结果了,调用abort让promsie走失败的回调
},3000)

newP.then(data => {
  cosole.leg('成功'，data)
}, reason => {
  cosole.leg('失败'，reason)
})