jquery中done和then的区别(详解)


Posted in jQuery onDecember 19, 2017

jquery的deferred对象的done方法和then方法都能实现链式调用,但是他们的作用是有区别的,then方法中如果你传递的方法有返回值,那么他会传递给下一个链式调用的方法。而done方法与此相反,你传递的方法就算有返回值,done方法也不会把你的返回值传给下一个链式调用的方法的,

话不多说,直接上实例:

var defer = jQuery.Deferred();
defer.done(function(a,b){
  console.log("a = " + a+"b = " + b);
  return a * b;
}).done(function( result ) {
  console.log("result = " + result);
}).then(function( a, b ) {
  console.log("a = " + a+"b = " + b);
  return a * b;
}).done(function( result ) {
      console.log("result = " + result);
}).then(function( a, b ) {
  console.log("a = " + a+"b = " + b);
  return a * b;
}).done(function( result ) {
  console.log("result = " + result);
});
defer.resolve( 2, 3 );

输出结果如下:

jquery中done和then的区别(详解)

结果分析:

1、第一个done和第二个done都返回了defer.resolve( 2, 3 )

2、done中callback的返回值不会被传递

3、第二个done只有一个参数,接收了defer.resolve( 2, 3 )的第一个参数2,所以result是2

4、第一个then接收defer.resolve( 2, 3 ),接收两个参数,result是6,同时新建一个deferred object,传递result给deferred object

5、第三个done接收到了这个新的deferred object和传递的result,打印结果是6,并把这个新的deferred object传递给第二个then

6、第二个then现在接收新的deferred object,它只有一个参数,是result,所以参数b没有定义,返回的结果是NaN,同时又新建一个deferred object

7、第四个done接收一个新建的deferred object,传递的参数是NaN,打印的结果自然就是NaN

以上这篇jquery中done和then的区别(详解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
最常用的jQuery表单验证(简单)
May 23 jQuery
jQuery导航条固定定位效果实例代码
May 26 jQuery
jQuery实现动态删除LI的方法
May 30 jQuery
jQuery动态添加元素无法触发绑定事件的解决方法分析
Jan 02 jQuery
jQuery中库的引用方法
Jan 06 jQuery
jQuery中的for循环var与let的区别
Apr 21 jQuery
jQuery实现遍历XML节点和属性的方法示例
Apr 29 jQuery
jQuery模拟12306城市选择框功能简单实现方法示例
Aug 13 jQuery
jquery分页插件pagination使用教程
Oct 23 jQuery
jQuery实现根据身份证号获取生日、年龄、性别等信息的方法
Jan 09 jQuery
jQuery列表动态增加和删除的实现方法
Nov 05 jQuery
jQuery实现增删改查
Dec 22 jQuery
jQuery实现弹窗下底部页面禁止滑动效果
Dec 19 #jQuery
jQuery实现点击DIV同时点击CheckBox,并为DIV上背景色的实例
Dec 18 #jQuery
HTML5+JS+JQuery+ECharts实现异步加载问题
Dec 16 #jQuery
利用JQUERY实现多个AJAX请求等待的实例
Dec 14 #jQuery
jquery获取transform里的值实现方法
Dec 12 #jQuery
jquery手机触屏滑动拼音字母城市选择器的实例代码
Dec 11 #jQuery
jQuery实现简单的下拉菜单导航功能示例
Dec 07 #jQuery
You might like
PHP及Zend Engine的线程安全模型分析
2011/11/10 PHP
基于php中使用excel的简单介绍
2013/08/02 PHP
Smarty使用自定义资源的方法
2015/08/08 PHP
多个Laravel项目如何共用migrations详解
2018/09/25 PHP
javascript 密码强弱度检测万能插件
2009/02/25 Javascript
js判断undefined变量类型使用typeof
2013/06/03 Javascript
基于Three.js插件制作360度全景图
2016/11/29 Javascript
基于jPlayer三分屏的制作方法
2016/12/21 Javascript
Angular企业级开发——MVC之控制器详解
2017/02/20 Javascript
vuejs2.0子组件改变父组件的数据实例
2017/05/10 Javascript
JavaScript使用math.js进行精确计算操作示例
2018/06/19 Javascript
JavaScript设计模式之代理模式简单实例教程
2018/07/03 Javascript
elementUI table表格动态合并的示例代码
2019/05/15 Javascript
vue.js 2.0实现简单分页效果
2019/07/29 Javascript
ES6 proxy和reflect的使用方法与应用实例分析
2020/02/15 Javascript
JS监听组合按键思路及实现过程
2020/04/17 Javascript
[06:04]DOTA2英雄梦之声Vol19卓尔游侠
2014/06/20 DOTA
[01:22:19]EG vs TNC Supermajor小组赛B组败者组第一轮 BO3 第二场 6.2
2018/06/03 DOTA
在服务器端实现无间断部署Python应用的教程
2015/04/16 Python
python密码错误三次锁定(实例讲解)
2017/11/14 Python
Python简单实现两个任意字符串乘积的方法示例
2018/04/12 Python
使用Python实现租车计费系统的两种方法
2018/09/29 Python
解决新版Pycharm中Matplotlib图像不在弹出独立的显示窗口问题
2019/01/15 Python
django使用haystack调用Elasticsearch实现索引搜索
2019/07/24 Python
Python csv模块使用方法代码实例
2019/08/29 Python
Python 实现opencv所使用的图片格式与 base64 转换
2020/01/09 Python
python列表删除和多重循环退出原理详解
2020/03/26 Python
Idea安装python显示无SDK问题解决方案
2020/08/12 Python
解决pytorch 保存模型遇到的问题
2021/03/03 Python
CSS实现鼠标滑过鼠标点击代码写法
2016/12/26 HTML / CSS
澳大利亚工具仓库:Tools Warehouse
2018/10/15 全球购物
医药营销专业个人自荐信
2013/09/29 职场文书
学校门卫岗位职责范本
2014/06/30 职场文书
暑假安全教育广播稿
2014/09/10 职场文书
如何使用Python对NetCDF数据做空间相关分析
2021/04/21 Python
关于pytest结合csv模块实现csv格式的数据驱动问题
2022/05/30 Python