jQuery的deferred对象讲解

今天，讲解下jQuery的deferred对象

 

首先，有的人可能不知道deferred对象是干嘛的：

我们在前端编程过程中，有些比较耗时的操作，不管是异步还是同步，尤其是异步，我们总是希望不管在它耗时多久之后，不管执行多久，都可以调用到回调函数，最常用的就是ajax了，发送一个异步请求后，继续执行下面的，如果执行完毕，会去判断执行成功还是失败，然后去自动调用success/error回调函数，deferred对象也是这样，但不仅仅是这样。

最通俗易懂的解释：可以让你前端开发时进行链式编程，还有就是监听耗时操作，执行指定回调

 

例如：

还有一种写法，使用then：

 

还有一个

always：不管成功还是失败，都会执行，等价于complete

 

此时小伙伴们有疑问了，讲了这么半天，一直没有看到哪里提到了deferred啊，

其实这些操作都是deferred对象才拥有的，只不过$.ajax()方法，会返回一个deferred对象，然后进行监听

解析开等价于：

 

ok，接下来说一下deferred对象的状态，deferred对象共有三种状态：

1.未完成：一直监听，不做任何操作

2.已完成：执行done回调

3.已失败：执行fail回调

上述的状态是一个deferred对象拥有的状态，$.when就监听这个状态，然后根据不同状态进行不同的回调操作

 

说一说deferred对象有哪些方法：

1.$.Deferred()：构建一个deferred对象返回

可以接受一个参数（方法）：构建一个deferred对象，并将该deferred对象作用于该方法上，会将生成的deferred对象作为该方法的默认参数去使用（如果该方法多个参数，请注意）

2.deferred.done(function)：指定操作成功时的回调函数

3.deferred.fail(function)：指定操作失败时的回调函数

4.deferred.always(function)：指定操作执行完毕时的回调函数，无论成功失败，都会执行

5.deferred.promise()：

a.无参数时：返回一个deferred对象，除了该操作，其他地方无法修改该deferred的状态

b.有参数时：将该deferred作用于方法上，然后方法就可以被监听，去执行done，fail....回调

6.deferred.resolve()：手动改变deferred对象的运行状态为”已完成”，从而立即触发done()方法

7.deferred.reject()：手动改变deferred对象的运行状态变为”已失败”，从而立即触发fail()方法

8.$.when()：

a.监听指定的deferred对象

b.为多个操作指定回调函数

9.deferred.then()：上面已经说了，这里不重复

 

讲一下监听一个耗时操作，但是该对象又不是deferred对象：

需求：我想要监听这样一个耗时操作，在执行完毕后，输出执行成功 or 执行失败

 

思路：

1.想要在执行完毕去判断执行成功还是失败，然后做回调操作，就要去监听

2.wait方法不是个deferred对象，无法直接去监听

3.将wait方法变成deferred对象然后去监听，ok

 

解答：

一、最基础的实现需求

缺陷：除了wait1方法内部可以修改deferred的状态，其他地方只要能读取到deferred的，也可以修改状态，监听又是在监听状态，有时候可能会出现意料之外的错误

 

二、修改思路：让除了wait1方法内部，其他地方无法修改deferred的状态

解决：使用promise

 

三、还有一种解决办法，部署接口

 

四、还是一个方法，在构建deferred对象的时候就传递方法进去，然后直接监听

 

我个人还是喜欢用第二种方法，都可以使用，看个人喜好了，Ending~