jQuery中的Deferred和promise
promise:http://www.alloyteam.com/2014/05/javascript-promise-mode/
1
jQuery 中的 Deferred 和 Promises :
http://www.css88.com/archives/4750
function getData(){
var dtd = $.Deferred();
$.ajax({
url: "https://api.flightstats.com/flex/schedules/rest/v1/jsonp/flight/AA/100/departing/2013/10/4",
type: 'GET',
dataType: 'jsonp',
data:{
},
crossDomain: true,
success: function(res) {
if (res) {
console.log(res);
};
dtd.resolve();
}
})
return dtd;
}
function init(){
getData().done(function(){
console.log(1111);
})
}
init();
function getData(){
var promise = $.ajax({
url: "https://api.flightstats.com/flex/schedules/rest/v1/jsonp/flight/AA/100/departing/2013/10/4",
type: 'GET',
dataType: 'jsonp',
data:{
},
crossDomain: true
})
promise.done(function(){
console.log(111);
}).then(function(){
console.log(222)
}).then(function(){
console.log(3333);
})
}
function result(){
$("#result").html("done")
};
function wait(){
var dtd = $.Deferred();//Deferred（延迟）对象
setTimeout(function(){
dtd.resolve();
},2000)
return dtd;
}
wait().done(result);
promise对象
大多数情况下，我们不想让用户从外部更改deferred对象的状态。这时，你可以在deferred对象的基础上，返回一个针对它的promise对象。我们可以把后者理解成，promise是deferred的只读版，或者更通俗地理解成promise是一个对将要完成的任务的承诺。
jQuery的ajax() 方法返回的就是一个promise对象。此外，Animation类操作也可以使用promise对象。
var deferred = $.Deferred();
deferred.resolve("hello world!")
deferred.done(function(value){
alert(value);
}).fail(function(value){
alert("failed");
}).then(function(){
alert("then")
})
console.log(deferred.state());
$.when(
$.ajax( "/main.php" ),
$.ajax( "/modules.php" ),
$.ajax( "/lists.php" )
).then(function (resp1, resp2, resp3){
console.log(resp1);
console.log(resp2);
console.log(resp3);
});
deferred的几种用法
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>deferred使用实例</title>
<script src="jquery.js"></script> </head>
<body>
<button id="btn1">例一：基本用法</button>
<button id="btn2">例二：过滤器</button>
<button id="btn3">例三：promise方法</button>
<script>
function show(str){
$("body").append(str);
}
//基本用法
$("#btn1").click(function(){
var dtd = $.Deferred();
dtd.done(function(){
show("成功！");
});
setTimeout(function(){
//这是一个耗时任务
dtd.resolve();
}, 2000)
})
//过滤器
$("#btn2").click(function(){
var defer = $.Deferred();
var filtered = defer.then(function(value){
return value*2;
})
defer.resolve(5);
filtered.done(function(value){
show("value is " + value);
})
})
//实现promise方法
$("#btn3").click(function(){
var obj = {
hello: function(name){
show("您好" + name)
}
};
var defer = $.Deferred();
//return obj != null ? jQuery.extend( obj, promise ) : promise;
defer.promise(obj);
defer.resolve("ssss");
obj.done(function(value){
obj.hello(value);
}).hello("aaaa");
})
</script>
</body>
</html>
$.when()
jQuery的Deferred最好用的地方，就是模块化程度非常高，可以任意配合使用。
function task(name) {
var dtd = $.Deferred();
setTimeout(function() {
dtd.resolve(name)
}, 1000)
return dtd;
}
$.when(task('任务一'), task('任务二')).done(function() {
alert('成功')
})
把需要处理的异步操作，用Deferred对象给包装一下，然后通过when方法收集异步的操作，最后再返回出done的成功，这样的处理太赞了！
所以说，Deferred的引入，为处理事件回调提供了更加强大并且更灵活的编程模型。
jQuery中的Deferred和promise的更多相关文章
- javascript 学习笔记之JQuery中的Deferred对象
Deffered是Jquery中的一个非常重要的对象,从1.5版本之后,Jquery中的ajax操作都基于Deffered进行了重构,这个对象的处理模式就像其他Javascript框中的Promise ...
- 深入理解jQuery中的Deferred
引入 1 在开发的过程中,我们经常遇到某些耗时很长的javascript操作,并且伴随着大量的异步. 2 比如我们有一个ajax的操作,这个ajax从发出请求到接收响应需要5秒,在这5秒内我们可以 ...
- jQuery 中的 Deferred 和 Promises(转)
转自:http://www.css88.com/archives/4750/comment-page-1 看前首先了解:Promises/A规范,具体可以看这里,http://www.css88.co ...
- jquery中的 deferred之 deferred对象 （一）
案例: var def=$.Deferred(); console.log(def);//答案见 图1 图1: deferred就是一个有这些方法的对象. 看源码分析: Deferred: funct ...
- jquery中的 deferred之 when (三)
先来看使用案例: var def1 = $.Deferred(); var def2 = $.Deferred(); var def3 = $.Deferred(); var def4 = $.Def ...
- jquery中的 deferred之 then (二)
例: var def = $.Deferred(); var prs1 = def.then(function (val) { var result = val + "_123" ...
- jQuery中的deferred对象和extend方法
1⃣️deferred对象 deferred对象是jQuery的回调函数解决方案,它是从jQuery1.5.0版本开始引入的功能 deferred对象的方法 (1) $.Deferred() 生成一个 ...
- Jquery中的 Deferred分析
参考:https://www.idaima.com/a/1627.html http://www.cnblogs.com/aaronjs/p/3356505.html 未完!
- 使用 jQuery Deferred 和 Promise 创建响应式应用程序
这篇文章,我们一起探索一下 JavaScript 中的 Deferred 和 Promise 的概念,它们是 JavaScript 工具包(如Dojo和MochiKit)中非常重要的一个功能,最近也首 ...
随机推荐
- 通达OA 小飞鱼在线开发培训第一讲介绍（图文）
培训课件的主要内容.须要參加培训的同学要注意了.课程内容以有用为主.课件仅供參考.
- 去哪网实习总结：用到的easyui组件总结（JavaWeb）
本来是以做数据挖掘的目的进去哪网的,结构却成了系统开发... 只是还是比較认真的做了三个月,老师非常认同我的工作态度和成果.. . 实习立即就要结束了,总结一下几点之前没有注意过的变成习惯和问题,分享 ...
- Oracle以系统管理员的方式登录失败
解决方法: 因为SYS是在数据库之外的超级管理员,所以我们在登录的时候输入sys后在输入命令:password as sysdba 就可以!例如:输入口令: m1234 as sysdba 参考文章 ...
- 一次性能优化将filter转换
有一条SQL性能有问题,在运行计划中发现filter.遇到它要小心了,类似于nestloop.我曾经的blog对它有研究探索运行计划中filter的原理.用exists极易引起filter. 优化前: ...
- svn 清理失败 (clean up 失败) 的解决方法
解决方法: step1: 到 sqlite官网 (http://www.sqlite.org/download.html) 下载 sqlite3.exe 找到 Precompiled Binaries ...
- idea+springboot+freemarker热部署（转）
今天在学习springboot集成freemarker模板引擎修改代码时,发现每次修改一次freemarker文件时,都必须重启下应用,浏览器刷新才能显示修改后的内容,这样效率太低,每次启动一次应用都 ...
- QQ号快速登录漏洞及被盗原理
web安全:QQ号快速登录漏洞及被盗原理 为什么你什么都没干,但QQ空间中却发了很多小广告?也许你的QQ账号已经被盗.本文将讲解一个QQ的快速登录的漏洞. 我前阵子在论坛上看到一个QQ的快速登录的 ...
- mariadb远程不能访问，出现Can't connect to MySQL server on '' (10061)
一,现象: 1. 1 远程连接数据库mariadb时,报错 二,定位: 2. 1 首先本地连接上数据库,然后操作权限表数据 ,然后远程再次连接依然连接不上: 2. 2 搜索mariadb的配置文 ...
- web.xml(8)_jsp-config
13.jsp-config jsp-config元素主要用来设定JSP的相关配置,<jsp:config>包含<taglib>和<jsp-property-group&g ...
- 实现拖拽上传文件的一款小控件——dropzone
由于专注所以专业.非常多小巧的东西乍一看非常不起眼,却在特定的领域表现不俗,就是由于集中了热情. dropzone就是这样一款小控件,实现拖拽上传.它不依赖于其他像jquery等JS库.并且支持多方面 ...