jQuery Promise与标准JS Promise执行顺序差异及兼容方案咨询

好问题！这确实是jQuery Deferred（它的Promise实现）和ES6标准Promise之间一个关键的行为差异——jQuery的then方法不会自动解析返回的嵌套Promise，而标准Promise会等待这个嵌套Promise完成后，再把结果传递给下一个链式调用的then，这就是为什么你看到了不同的执行顺序。

为什么会出现0 2 1的顺序？ #

当你在jQuery Promise的then回调里返回另一个Promise时，jQuery不会识别这个返回值是一个异步操作，它会直接把这个Promise对象作为值，立刻传递给下一个then回调，所以下一个then会马上执行（输出2）；而嵌套的Promise完成后，才会执行它自身的then回调（输出1）。

实现标准Promise行为的几种方法 #

方法1：用$.when()包装返回的Promise

$.when()是jQuery用来处理异步操作并行的工具，但它也能接受单个Promise/Deferred对象，并等待它完成后再传递状态。通过在then里返回$.when(你的嵌套Promise)，就能让jQuery链式调用等待嵌套Promise完成：

$.Deferred().resolve()
  .then(function() {
    console.log(0);
    // 用$.when包装嵌套Promise，强制jQuery等待它完成
    return $.when($.Deferred().resolve().then(function() {
      console.log(1);
    }));
  })
  .then(function() {
    console.log(2);
  });

执行这段代码，你会得到预期的0 1 2顺序。

方法2：将jQuery Promise转换为标准ES6 Promise

ES6的Promise.resolve()方法可以接受任何thenable对象（包括jQuery的Deferred），并将其转换为标准Promise。一旦转换完成，后续的链式调用就会完全遵循标准Promise的行为，自动解析嵌套的Promise：

Promise.resolve($.Deferred().resolve())
  .then(function() {
    console.log(0);
    return Promise.resolve().then(function() {
      console.log(1);
    });
  })
  .then(function() {
    console.log(2);
  });

这种方法最简洁，也最彻底——只要转换一次，整个后续链式都能按照标准规则执行，避免后续再遇到类似的异步顺序问题。

方法3：封装符合标准的then方法

如果你不想依赖ES6 Promise，也可以自己封装一个模拟标准Promise行为的then工具函数，手动处理嵌套Promise的解析：

function standardThen(deferred, handler) {
  const newDeferred = $.Deferred();
  deferred.then(function() {
    const result = handler.apply(this, arguments);
    // 检查返回值是否是thenable对象（Promise/Deferred）
    if (result && typeof result.then === 'function') {
      // 将嵌套Promise的状态绑定到新的Deferred
      result.then(newDeferred.resolve, newDeferred.reject, newDeferred.notify);
    } else {
      // 普通值直接resolve
      newDeferred.resolve(result);
    }
  }, newDeferred.reject, newDeferred.notify);
  return newDeferred.promise();
}

// 使用示例
const dfd = $.Deferred().resolve();
standardThen(dfd, function() {
  console.log(0);
  return $.Deferred().resolve().then(function() {
    console.log(1);
  });
}).then(function() {
  console.log(2);
});

这个函数模拟了标准Promisethen的核心逻辑：自动解析返回的thenable对象，等待其完成后再传递状态。

总结 #

如果你的环境支持ES6 Promise，优先选择方法2，它是最省心的解决方案；如果不能使用ES6特性，方法1的$.when()包装是最简单的适配方式；方法3适合需要完全自定义Promise行为的场景，但代码量相对大一些。

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