Your SlideShare is downloading. ×
Jq的deferrer对象
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Jq的deferrer对象

1,164

Published on

Published in: Technology
2 Comments
2 Likes
Statistics
Notes
No Downloads
Views
Total Views
1,164
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
4
Comments
2
Likes
2
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. JQ 的 Deferrer 对象 -- 承诺一个可预见的未来
  • 2. 主要内容– 什么是 Deferred 对象– API– 用例– 源码实现– 更多 • whenJs 的阅读演示 • 更进一步阅读 • 参考资料
  • 3. Deferred 对象是什么
  • 4. • jQuery.Deferred(), introduced in version 1.5, is a chainable utility object that can register multiple callbacks into callback queues, invoke callback queues, and relay the success or failure state of any synchronous or asynchronous function.• jQuery Deferred is based on the CommonJS Promises/A design.
  • 5. – a chainable utility object– register– callback queues– invoke– state– synchronous or asynchronous function
  • 6. CommonJS Promises/A• Promises provide a well-defined interface for interacting with an object that represents the result of an action that is performed asynchronously, and may or may not be finished at any given point in time.• By utilizing a standard interface, different components can return promises for asynchronous actions and consumers can utilize the promises in a predictable manner.• Promises can also provide the fundamental entity to be leveraged for more syntactically convenient language- level extensions that assist with asynchronicity.
  • 7. Example-A :
  • 8. Example-B :读取服务器文件: 读取 => 编辑 => 写回服务器 => 返回状态 码
  • 9. Example-B :
  • 10. Example-B :
  • 11. "JavaScript 是一门单线程语言,因此一旦有某个 API 阻塞了当前线程,就相当于阻塞了整个程序,所以“异步”在 JavaScript 编程中占有很重要的地位。 但异步编程对于开发者来说十分麻烦,它会将程序逻辑拆分地支离破碎,语义完全丢失。因此,许多程序员都在打造一些异步编程模型以及相关的 API 来简化异步编程工作,例如 Promise 模型。 " —— 老赵
  • 12. • jQuery.Deferred(), introduced in version 1.5, is a chainable utility object that can register multiple callbacks into callback queues, invoke callback queues, and relay the success or failure state of any synchronous or asynchronous function.• jQuery Deferred is based on the CommonJS Promises/A design.
  • 13. • Promise 模型 – 减少异步调用带来的代码混乱,统一了代码的风格和 书写体验 – promise“ 吃掉”了时间,通过“承诺”让整个程序得以运 行。代码在“承诺”会兑现,或者不会兑现的假设下,得 以运行下去 ......
  • 14. JQ Deferred API
  • 15. • .promise() – Return a Promise object to observe when all actions of a certain type bound to the collection, queued or not, have finished.
  • 16. 单个 Deferrer 实现概念
  • 17. Deferred 对象的生成
  • 18. Deferred 对象的生成
  • 19. Deferred.done 做了什么事情
  • 20. Deferred.done 做了什么事情
  • 21. 官网的 API • deferred.done() – Add handlers to be called when the Deferred object is resolved. • deferred.fail() – Add handlers to be called when the Deferred object is rejected. • deferred.then() – Add handlers to be called when the Deferred object is resolved or rejected. • deferred.always() – Add handlers to be called when the Deferred object is either resolved or rejected.
  • 22. 官网的 API • deferred.reject() – Reject a Deferred object and call any failCallbacks with the given args. • deferred.resolve() – Resolve a Deferred object and call any doneCallbacks with the given args.
  • 23. 纠正一个错误无法串行执行,所有动画都是并行执行的
  • 24. 纠正一个错误真正的串行执行
  • 25. pipe 是什么?
  • 26. pipe 是什么 纠正一个错误• The deferred.pipe() method returns a new promise that filters the status and values of a deferred through a function.• The doneFilter and failFilter functions filter the original deferreds resolved / rejected status and values.• As of jQuery 1.7, the method also accepts a progressFilter function to filter any calls to the original deferreds notify or notifyWith methods.• These filter functions can return a new value to be passed along to the piped promises done() or fail() callbacks,• or they can return another observable object (Deferred, Promise, etc) which will pass its resolved / rejected status and values to the piped promises callbacks.• If the filter function used is null, or not specified, the piped promise will be resolved or rejected with the same values as the original.
  • 27. 纠正一个错误
  • 28. 纠正一个错误
  • 29. 纠正一个错误
  • 30. 纠正一个错误
  • 31. 纠正一个错误 假设: handler=done , data=[ fnDone, "resolve" ]
  • 32. 纠正一个错误
  • 33. 纠正一个错误
  • 34. 纠正一个错误
  • 35. 纠正一个错误
  • 36. 用例
  • 37. 用例
  • 38. jQuery.pipe 的大致实现模型 Master Deferr
  • 39. 启发• 1. 消失的时间,什么是异步编程?还可以 怎么样进行控制? ...• 2. 函数式编程领域?• 3. 语法糖只是第一步,编译可以帮忙吗?
  • 40. 启发• Promise 模型 – 减少异步调用带来的代码混乱,统一了代码的风格和 书写体验 – promise“ 吃掉”了时间,通过“承诺”让整个程序得以运 行。代码在“承诺”会兑现,或者不会兑现的假设下,得 以运行下去 ......
  • 41. 接着去哪里• 1. 阅读他们的源码 – github• 2. 尝试函数式编程领域的语言 – lisp 、 python 、 ruby 、 F#• 3. 学习编译原理 – 书籍: < 计算机程序的构造和解释 >... – 视频: ......
  • 42. • WhenJs 演示 – windows 下,下载 TortoiseGit 安装包 – fork 感兴趣的项目 – clone 到本地 – 修改,阅读,做笔记,写测试案例 – 提交 – 讨论、交流
  • 43. 参考资料[1] 老赵的 wine.js--JavaScript 异步编程类库(其前身为 Jscex )[2] JQ 源码分析[3] jQuery Deconstructed[4] Deferred Object[5] 从事件驱动到 observable 的异步编程—— PubSub+Promise+Rx 的 JS 事件库[6] 函数式编程初探(阮一峰)[7] commonjs Promises/A[1] http://windjs.org/cn/blog/2012/07/infoq-interview-windjs-author-1/[2] http://www.cnblogs.com/nuysoft/[3] http://www.keyframesandcode.com/resources/javascript/deconstructed/jquery/[4] http://api.jquery.com/category/deferred-object/[5] http://www.limboy.com/2011/09/25/pubsub-plus-promise-plus-rx/[6] http://www.ruanyifeng.com/blog/2012/04/functional_programming.html[7] http://wiki.commonjs.org/wiki/Promises
  • 44. 待续 ......

×