在AJAX Promise的.done()前使用回调函数的问题求助

这个问题我之前也碰到过，核心原因是你对jQuery $.ajax 返回的Deferred对象的工作机制理解有点偏差：success 回调只是一个触发执行的钩子，它的返回值不会改变Deferred最终resolve的数据，所以不管你在success里return什么，.done() 拿到的始终是AJAX请求返回的原始数据。

正确的解决方案：用 .then() 转换Deferred的值 #

jQuery的Deferred提供了 .then() 方法，它会返回一个新的Deferred对象，并且这个新对象的resolve值就是你在.then()回调里的返回结果。我们可以用它来替代success回调，实现数据的预处理，然后把处理后的数据传递给后续的.done()。

修改后的完整代码如下：

function loadLotsofSomething() {
  var results = [];
  for (var i=0;i<1000;i++) {
    results.push(loadOneSomething(i));
  }
  $.when.apply(this,results).done(function() {
    for (var i = 0; i < arguments.length; i++) {
      // 这里拿到的就是doSomething处理后的结果了！
      console.log(arguments[i]);
    }
  })
}

function loadOneSomething(i) {
  return $.ajax({
    async : true,
    url: url // 这里替换成你的实际请求地址
  }).then(function(data){
    // 在这里用doSomething处理数据，return的结果会传递给后续的done
    return doSomething(data);
  });
}

function doSomething (x) {
  // 这里可以写你的数据处理逻辑，比如修改、过滤x
  return x;
}

为什么这样可行？ #

• .then() 是Deferred的链式方法，它接收一个回调函数，当原始AJAX请求成功时，会把原始数据传给这个回调，然后将回调的返回值作为新Deferred的resolve值。
• 这样loadOneSomething返回的就是一个已经处理过数据的Deferred对象，当$.when等待所有请求完成后，.done()里拿到的自然就是处理后的结果了。

额外提示 #

如果需要处理请求失败的情况，还可以给.then()传入第二个回调函数（处理reject的情况），比如：

return $.ajax({...})
  .then(function(data){
    return doSomething(data);
  }, function(error){
    // 处理请求失败的逻辑，比如返回默认值或者抛出错误
    console.error('请求失败:', error);
    return null;
  });

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