Promise 异步分离实现 cancel request

巧妙的通过改变 Promise 状态实现取消请求

封装之后外部拿不到 xhr 实例，内部通过判断传入的 cancelToken.promise 的状态达到取消请求的效果

// class CannelToken
class CannelToken {
  promise
  reason

  constructor(executor) {
    let resolvePromise
    this.promise = new Promise(resolve => {
      // 将 resolve 函数保存，需要将 promise 状态改为 resolved 的时候再调用
      resolvePromise = resolve
    })
    // 执行实例化时传入的函数，(message) => { // ... } 作为参数
    // 将 resolvePromise 暴露
    executor(message => {
      if (this.reason) {
        return
      }
      this.reason = message
      resolvePromise(this.reason)
    })
  }
}

// xhr.ts
// 请求配置 config 中可能有 cancelToken 属性 
// config.cancelToken 是类 CancelToken 的实例，保存了 promise
if (config.cancelToken) {
  // 当 promise 从 pending 状态变为 fulfilled 就会执行以下代码
  config.cancelToken.promise.then(res => {
    request.abort()
    reject(res)
  })
}
request.sent()

// demo 发请求
let cancel
axios.get('cancel/get', {
  cancelToken: new CancelToken(function (c) {
    // 参数 c 就是 (message) => { // ... }
    cancel = c
  })
})

// 调用 cancel 就可以调用 resolvePromise，从而改变 promise 的状态
// 然后执行 xhr.ts 中的 promise.then
cancel()