美文网首页学习记录
jQuery中的deferred对象

jQuery中的deferred对象

作者: liuziyang | 来源:发表于2017-02-27 21:04 被阅读20次

deferred对象简单来说就是jQuery的回调函数解决方案。

一、ajax中的链式写法

jQuery中ajax传统的写法是

传统的ajax写法

success方法指定操作成功时执行的函数,error方法指定操作失败时执行的函数。在1.5.0之后的版本中,$.ajax操作完成之后,返回一个deferred对象,可以进行链式操作。

我们可以这样写:

ajax的链式操作

当操作成功时弹出“成功”,当操作失败时弹出“失败”,在这里,done()相当于success方法,fail()相当于error方法。

二、指定同一类操作的多个回调函数

deferred对象可以为同一个操作执行多个回调函数,她们按照指定顺序执行,比如

指定多个回调函数

三、为多个操作指定回调

deferred对象可以为多个事件指定一个回调函数,这是需要使用$.when(),例如

为多个操作指定回调

当两个ajax都执行成功时,弹出“成功”,有一个失败时弹出“失败”

四、普通操作的回调函数接口

deferred对象将这样一套回调函数接口扩展到所有的操作。例如:

普通操作的回调函数接口

在这里wait获取到的返回值是一个deferred对象,可以执行链式操作。

deferred对象有三种执行状态:未完成、已完成、已失败。当状态是未完成时,继续等待;当状态是已完成时则立即调用done()指定的操作,当状态是已失败时会立即执行fail()方法指定的操作。dtd.resolve()方法是修改deferred对象的执行状态为已完成,dtd.reject()方法是修改deferred对象的执行状态为已失败。

总结

$.Deferred() 生成一个deferred对象

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

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

deferred.promise()没有参数时,返回一个新的deferred对象,该对象的状态无法被改变;接受参数时,作用为在对象上部署deferred接口;

deferred.resolve()手动改变deferred对象的状态为已完成

deferred.reject()手动改变deferred对象的状态为已失败

$.when()为多个操作指定回调函数

deferred.then()

可以将done()和fail()结合起来写,就是then()方法,通常接受两个参数,第一个是done()方法的回调函数,第二个参数是fail()方法的回调函数。也可以只接受一个参数,此时等同于done();

deferred.always() 也可以用来指定回调函数,不管deferred对象的状态是已完成还是已失败都会执行always()方法指定的回调函数。

相关文章

  • jQuery.deferred详解

    deferred是什么? deferred 翻译为推迟,在jQuery 1.5中引入的Deferred对象是通过调...

  • Deferred对象

    Deferred对象 什么是Deferred对象?Deferred对象是从jQuery 1.5.0版本开始引入的一...

  • jQuery的deferred对象详解 作者:阮一峰 一、什么是deferred对象? 开发网站的过程中,我们经常...

  • jQuery

    jQuery设计思想 jQuery最佳实践 如何做到jQuery-free jQuery-deferred对象 同...

  • jQuery中的deferred对象

    deferred对象简单来说就是jQuery的回调函数解决方案。 一、ajax中的链式写法 jQuery中ajax...

  • Deferred对象

    jQuery.Deferred 对象 实例上的方法 一共14个 deferred.resolve(args) / ...

  • jQuery-v2.0.3源码浅析05-when

    jQuery提供的when方法可以管理多个Deferred对象。打比方说如果你创建了多个Deferred对象,这个...

  • jQuery-v2.0.3源码浅析04-Deferred

    接下来我们来看下jQuery的延迟对象Deferred。我们前面讲过Callbacks函数,其实Deferred就...

  • JQuery Deferred 对象剖析

    JQuery 中利用 Deferred 对象提供类似 ES2016(aka. es7) 中 Promise 的功能...

  • jQuery Deferred对象

    请移步: https://blog.cdswyda.com/post/20160923

网友评论

    本文标题:jQuery中的deferred对象

    本文链接:https://www.haomeiwen.com/subject/diftgttx.html