JavaScript Promise 中怎么实现支持进度通知的 Promise 任务-js教程-PHP中文网

原生 promise 不支持进度通知，但可通过自定义构造函数（如 createprogresspromise）封装实现：执行器接收 resolve、reject 和 progress 三参数，progress 调用外部 onprogress 回调传递进度数据，返回标准 promise；也可结合事件发射器或使用 axios、rxjs 等支持进度的第三方库，注意进度仅为副作用，不参与 promise 状态机。

javascript promise 中怎么实现支持进度通知的 promise 任务

原生 Promise 不支持进度通知，但可以通过自定义构造函数或封装方式实现带进度回调的 Promise 任务。核心思路是：在 Promise 执行过程中主动调用外部传入的 onProgress 回调，并将当前进度（如百分比、步骤描述等）作为参数传递出去。

手动封装支持进度的 Promise 构造函数

你可以创建一个类似 ProgressPromise 的工厂函数，接受执行器（executor）和进度回调：

执行器函数接收 resolve、reject 和 progress 三个参数（第三个是自定义的进度通知函数）
progress 函数内部触发用户传入的 onProgress 回调
返回一个标准 Promise，保持与原生 Promise 兼容

示例代码：

function createProgressPromise(executor, onProgress) {
  return new Promise((resolve, reject) => {
    const progress = (value) => {
      if (typeof onProgress === 'function') {
        onProgress(value);
      }
    };
    executor(resolve, reject, progress);
  });
}

// 使用示例：模拟上传过程
createProgressPromise((resolve, reject, progress) => {
  let i = 0;
  const timer = setInterval(() => {
    i += 10;
    progress({ loaded: i, total: 100, percent: i });
    if (i >= 100) {
      clearInterval(timer);
      resolve('上传完成');
    }
  }, 200);
}, (p) => console.log('进度:', p));

用 async/await + 进度事件模拟更自然的流程

如果你希望在 async 函数中使用进度，可以配合事件发射器或状态对象管理进度，再用 Promise 包装异步操作：

Java Maven Code Review

审查Java Maven项目（ZIP压缩包或GitLab仓库URL），检查代码规范、命名、模块边界、可维护性问题以及重复代码。

下载

定义一个带 onProgress 监听能力的对象（如 UploadTask）
在关键节点调用 this.emit('progress', data) 或直接执行回调
Promise 的 resolve/reject 仍由主逻辑控制，不影响进度通知的独立性

这样写能让业务逻辑更清晰，也方便复用和测试。

借助第三方库简化开发（如 axios、rxjs）

很多成熟库已内置进度支持：

axios：通过 onUploadProgress 配置项监听上传进度（基于 XMLHttpRequest 的 upload.onprogress）
RxJS：用 Subject 或 fromEvent 发送进度流，再用 toPromise() 或 lastValueFrom 转为 Promise
不推荐强行给 Promise 增加“多状态”语义，应区分「最终结果」和「中间反馈」两种关注点