JS 中如何为执行时长不确定的回调函数设置超时或终止执行

一、设置超时回调的实现方法 #

这个需求可以通过Promise.race轻松实现，核心思路是把原回调函数和超时触发器放在一起竞速，哪个先触发就执行对应的逻辑：

1. 先将原回调式函数封装为Promise

// 假设你原有函数是这个形式，执行完成后调用callback
function yourAsyncTask(callback) {
  // 你的原有业务逻辑
}

// 封装为Promise
const taskInstance = new Promise((resolve, reject) => {
  yourAsyncTask((error, result) => {
    if (error) return reject(error)
    resolve(result)
  })
})

2. 构造超时Promise

// 超时时间可自行调整，示例为5000ms即5秒
const timeoutTrigger = new Promise((_, reject) => {
  setTimeout(() => {
    reject(new Error('TASK_TIMEOUT'))
  }, 5000)
})

3. 竞速执行实现超时回调

Promise.race([taskInstance, timeoutTrigger])
  .then(taskResult => {
    // 原函数正常执行完成的后续逻辑
  })
  .catch(error => {
    if (error.message === 'TASK_TIMEOUT') {
      // 这里写你要执行的超时回调逻辑
    } else {
      // 原函数执行报错的处理逻辑
    }
  })

二、终止函数运行的相关说明 #

能否终止函数运行取决于你函数的实际类型：

• 如果是纯同步执行的计算密集型函数：JS单线程执行的特性决定了无法从外部直接中断正在运行的同步逻辑，除非你在函数内部提前预埋了终止判断位，并且将长任务拆分为多个宏任务分段执行，给外部修改终止位的机会。示例如下：

let taskStopFlag = false
// 预埋了终止判断的长执行函数
function longRunTask(callback) {
  let count = 0
  function executeStep() {
    // 每次执行前判断是否要终止
    if (taskStopFlag) return callback(new Error('TASK_ABORTED'))
    if (count < 1000000) {
      count += 1
      // 拆分任务为宏任务，让出线程控制权
      setTimeout(executeStep, 0)
    } else {
      callback(null, '执行完成')
    }
  }
  executeStep()
}

// 需要终止时直接修改标志位即可
// taskStopFlag = true

• 如果是内置终止能力的IO异步任务：比如网络请求、文件读写这类调用系统能力的异步任务，直接调用对应API的终止方法即可，比如XMLHttpRequest的abort()、fetch请求的AbortController、Node.js文件操作的abort()，调用后原函数的回调不会再被触发。
• 如果是放在WebWorker中运行的独立任务：可以直接调用worker.terminate()直接销毁Worker线程，彻底终止任务执行。

注意：如果没有做上述特殊处理，仅通过Promise.race触发超时回调时，原函数本身还是会继续执行到结束，只是你不再处理它的执行结果而已，不会自动终止。

内容的提问来源于stack exchange，提问作者Mark