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实现Select下拉列表进行状态选择功能
Mar 30 jQuery
jQuery UI Grid 模态框中的表格实例代码
Apr 01 jQuery
jquery拖动改变div大小
Jul 04 jQuery
jQuery实现的简单无刷新评论功能示例
Nov 08 jQuery
jQuery除指定区域外点击任何地方隐藏DIV功能
Nov 13 jQuery
jQuery实现右侧抽屉式在线客服功能
Dec 25 jQuery
jQuery实现的监听导航滚动置顶状态功能示例
Jul 23 jQuery
jQuery实现的淡入淡出图片轮播效果示例
Aug 29 jQuery
Jquery的autocomplete插件用法及参数讲解
Mar 12 jQuery
JQuery常用简单动画操作方法回顾与总结
Dec 07 jQuery
jQuery实现朋友圈查看图片
Sep 11 jQuery
jQuery实现鼠标拖拽登录框移动效果
Sep 13 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 mysql数据库操作类
2008/06/04 PHP
php csv操作类代码
2009/12/14 PHP
使用GDB调试PHP代码,解决PHP代码死循环问题
2015/03/02 PHP
PHPStrom中实用的功能和快捷键大全
2015/09/23 PHP
详解WordPress中添加和执行动作的函数使用方法
2015/12/29 PHP
php如何修改SESSION的生存存储时间的实例代码
2017/07/05 PHP
ThinkPHP5.1的权限控制怎么写?分享一个AUTH权限控制
2021/03/09 PHP
基于jquery的兼容各种浏览器的iframe自适应高度的脚本
2010/08/13 Javascript
jQuery创建平滑的页面滚动(顶部或底部)
2013/02/26 Javascript
js(JavaScript)实现TAB标签切换效果的简单实例
2014/02/26 Javascript
Jquery焦点与失去焦点示例应用
2014/06/10 Javascript
提高NodeJS中SSL服务的性能
2014/07/15 NodeJs
JS+CSS实现淡入式焦点图片幻灯切换效果的方法
2015/02/26 Javascript
你所不了解的javascript操作DOM的细节知识点(一)
2015/06/17 Javascript
js控制元素显示在屏幕固定位置及监听屏幕高度变化的方法
2015/08/11 Javascript
React服务端渲染(总结)
2017/07/01 Javascript
详解vue-router和vue-cli以及组件之间的传值
2017/07/04 Javascript
JavaScript文件的同步和异步加载的实现代码
2017/08/19 Javascript
vue多次循环操作示例
2019/02/08 Javascript
基于AngularJS拖拽插件ngDraggable.js实现拖拽排序功能
2019/04/02 Javascript
vue实现的多页面项目如何优化打包的步骤详解
2020/07/19 Javascript
vue实现几秒后跳转新页面代码
2020/09/09 Javascript
小小聊天室Python代码实现
2016/08/17 Python
Python中shape计算矩阵的方法示例
2017/04/21 Python
TensorFlow损失函数专题详解
2018/04/26 Python
django admin 自定义替换change页面模板的方法
2019/08/23 Python
pytorch 实现将自己的图片数据处理成可以训练的图片类型
2020/01/08 Python
基于python实现数组格式参数加密计算
2020/04/21 Python
Python+Dlib+Opencv实现人脸采集并表情判别功能的代码
2020/07/01 Python
Python用requests库爬取返回为空的解决办法
2021/02/21 Python
HTML5开发动态音频图的实现
2020/07/02 HTML / CSS
高一英语教学反思
2014/01/22 职场文书
学校运动会通讯稿
2015/07/18 职场文书
离婚起诉书范文2016
2015/11/26 职场文书
go 原生http web 服务跨域restful api的写法介绍
2021/04/27 Golang
ubuntu端向日葵键盘输入卡顿问题及解决
2022/12/24 Servers