jQuery的deferred对象使用详解

2020-05-23 06:22:02易采站长站整理

这个功能很重要,未来将成为jQuery的核心方法,它彻底改变了如何在jQuery中使用ajax。为了实现它,jQuery的全部ajax代码都被改写了。


但是,它比较抽象,初学者很难掌握,网上的教程也不多。所以,我把自己的学习笔记整理出来了,希望对大家有用。


本文不是初级教程,针对的读者是那些已经具备jQuery使用经验的开发者。如果你想了解jQuery的基本用法,请阅读我编写的《jQuery设计思想》和《jQuery最佳实践》。



一、什么是deferred对象?


    开发网站的过程中,我们经常遇到某些耗时很长的javascript操作。其中,既有异步的操作(比如ajax读取服务器数据),也有同步的操作(比如遍历一个大型数组),它们都不是立即能得到结果的。


    通常的解决方法是,为它们指定回调函数(callback)。即事先规定,一旦它们运行结束,应该调用哪些函数。


    但是,在回调函数方面,jQuery的功能非常弱。为了改变这一点,jQuery开发团队就设计了deferred对象。


    简单说,deferred对象就是jQuery的回调函数解决方案。 在英语中,defer的意思是”延迟”,所以deferred对象的含义就是”延迟”到未来某个点再执行。


    它解决了如何处理耗时操作的问题,对那些操作提供了更好的控制,以及统一的编程接口。它的主要功能,可以归结为四点。下面我们通过示例代码,一步步来学习。


二、ajax操作的链式写法


    jQuery的ajax操作,传统写法是这样的:


  $.ajax({


    url: “test.html”,


    success: function(){ 
      alert(“哈哈,成功了!”); 
    },


    error:function(){ 
      alert(“出错啦!”); 
    }


  });


(运行代码示例1)


    在上面的代码中,$.ajax()接受一个对象参数,这个对象包含两个方法:success方法指定操作成功后的回调函数,error方法指定操作失败后的回调函数。


$.ajax()操作完成后,如果使用的是低于1.5.0版本的jQuery,返回的是XHR对象,你没法进行链式操作;如果高于1.5.0版本,返回的是deferred对象,可以进行链式操作。


    现在,新的写法是这样的:


  $.ajax(“test.html”)


  .done(function(){ alert(“哈哈,成功了!”); })