延时工具

利用 Promise 可以实现一个通用延时工具

function delay (time) {
  return new Promise(resolve => {
    let timeId = setTimeout(() => {
      timeId = null
      resolve()
    }, time)
  })
}

使用起来很简单，但似乎跟直接使用 setTimeout 没减少多少代码量[捂脸]，甚至多此一举

// 2s 后做一些事情
delay(2000).then(() => {
  // do something here
})

超时工具

如果前端想对一些异步操作设置时间限制，超过指定时间异步操作未结束就做特殊处理，可以使用 Promise.race 特性实现一个超时工具

function timeout (p, time) {
  let tp = new Promise((resolve, reject) => {
    let timeId = setTimeout(() => {
      timeId = null
      reject('timeout')
    }, time)
  })
  return Promise.race([p, tp])
}

使用起来稍微有些复杂，具体代码如下

let p = getData()

timeout(p, 3000)
// 未超时且请求成功
.then(data => {
  console.log(data)
})
// 超时或请求失败
.catch(err => {
  console.log(err)
})

// 模拟一个耗时 2s 的成功的异步请求
function getData () {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve('success')
      // reject('error')
    }, 2000)
  })
}