jQuery的延迟对象（十一）

在前端这个领域里面，ajax请求非常常见。

// 前提引入jquery

$.ajax({
    type: 'get',
    url: '/path/to/data',
    success: function (response) {
    
    },
    error: function (errMsg) {

    }
})

上面这段代码中的success和error被称为回调函数。基于js异步IO的特点，代码的意思就是在ajax请求成功之后，执行success函数，而在ajax失败时，执行error函数。

然而在有些情况下，业务逻辑可能需要我们产生多个success状态下的回调函数，或者多个ajax请求同时发送，全部success状态后执行回调，这样的方法就显得有些捉襟见肘。

 单次ajax请求有多个回调响应

$.ajax({
    type: 'get',
    url: '/path/to/data',
    success: function (response) {
        // todo
        
        successCallback2(response);
        successCallback3(response);
    }
})

继续使用上面的写法，就会让回调进行嵌套，如果需要在successCallback2完成后继续回调，就要一层一层的嵌套。代码不是纵向发展，而是横向发展，这就是js中的回调地狱。

当然，jquery团队也发现了这个问题，在2011年，也就是jquery 1.5版本之后，jQuery.Deferred对象为解决这类问题应运而出。

在jquery 1.5 版本之后，ajax请求的内部实现被重写。$.ajax方法返回的不再是一个jqXHR对象，而是一个Deferred对象。

var fetchData = function (url) {
    return $.ajax({
        type: 'get',
        url: url
    });
}

这样一次请求的内容就已经完成，$.ajax返回一个$.Deferred对象，那么我们就可以使用$.Deferred对象的api进行一些异步操作。

对于每一个$.Deferred对象来说，实例有多个方法，其中done方法代表异步完成时执行的方法，fail代表异步失败时执行的方法，这两个方法同时仍旧返回一个$.Deferred对象的实例。

 1. done(doneCallbacks[,doneCallbacks])

当请求成功时调用一个函数或者数组函数。

该参数可以是一个函数或一个函数的数组。当请求成功时，doneCallbacks被调用。回调执行是依照他们添加的顺序。

$.get("test.php").done(function() { 
  alert("$.get succeeded"); 
});

2. fail(failCallbacks[,failCallbacks])

当请求失败时调用一个函数或者数组函数。

该参数可以是一个函数或一个函数的数组。当请求失败时，doneCallbacks被调用。回调执行是依照他们添加的顺序。

$.get("test.php")
  .done(function(){ alert("$.get succeeded"); })//延迟成功
  .fail(function(){ alert("$.get failed!"); });//延迟失败

3. then(doneFilter [, failFilter ] )

doneCallbacks: 一个函数或函数数组，当延迟成功时调用。

failCallbacks: 一个函数或函数数组，当延迟失败时调用。

$.get("test.php").then(
    function(){ alert("$.get succeeded"); },
    function(){ alert("$.get failed!"); }
);

4. always(alwaysCallbacks,[alwaysCallbacks])

无论是成功还是失败都进行回调

$.get("test.php").always( function() { 
  alert("$.get completed with success or error callback arguments"); 
} );