Deferred 对象的示例代码

下面是一个使用 Deferred 对象的示例代码，该示例代码使用异步请求加载两个 HTML 文件，然后将它们合并到一个 div 元素中：

function loadHtml(url) {
  var defer = $.Deferred();
  $.ajax({
    url: url,
    success: function(data) {
      defer.resolve(data);
    },
    error: function() {
      defer.reject();
    }
  });
  return defer.promise();
}

$.when(loadHtml("html1.html"), loadHtml("html2.html"))
  .then(function(html1, html2) {
    var $div = $("<div>");
    $div.append(html1, html2);
    $("body").append($div);
  })
  .fail(function() {
    console.log("Failed to load html files.");
  });

在这个例子中，我们定义了一个 loadHtml() 函数，它使用 AJAX 请求加载指定的 HTML 文件，并返回一个 Deferred 对象。在该函数内部，我们使用 $.ajax() 函数发送 AJAX 请求，并在请求成功时调用 resolve() 方法，将 Deferred 对象的状态设置为已完成；在请求失败时调用 reject() 方法，将 Deferred 对象的状态设置为已失败。然后我们使用 $.when() 函数等待两个异步请求完成，并使用 then() 方法注册回调函数，在回调函数中将两个 HTML 文件合并到一个 div 元素中，并将该元素添加到 body 元素中。在 fail() 方法中，处理异步请求失败的情况。

需要注意的是，$.when() 函数可以接受任意数量的 Deferred 对象或普通对象作为参数，并返回一个新的 Deferred 对象，它的状态取决于所有参数的状态。如果所有参数的状态都是已完成，它的状态也是已完成；如果有任何一个参数的状态是已失败，它的状态也是已失败。在 then() 方法中，回调函数的参数按照传入 $.when() 函数的参数顺序依次排列。