Javascript中的异步编程规范Promises/A详细介绍


Posted in Javascript onJune 06, 2014

Javascript里异步编程逐渐被大家接受,先前大家一般通过回调嵌套,setTimeout、setInterval等方式实现,代码看起来非常不直观,不看整个代码逻辑很难快速理解。Javascript里异步函数大概有I/O函数(Ajax、postMessage、img load、script load等)、计时函数(setTimeout、setInterval)等。

这些我们都很熟悉,在复杂的应用中往往会嵌套多层,甚至以为某些步骤未完成而导致程序异常,最简单的例子:比如你往DOM中注入节点,你必须等待节点注入后在操作这个节点,当大量节点注入的时候,时间往往很难把握。如果我们得代码依赖第三方api的数据。我们无法获悉一个API响应的延迟时间,应用程序的其他部分可能会被阻塞,直到它返回结果。Promises对这个问题提供了一个更好的解决方案,它是非阻塞的,并且与代码完全解耦 。

那么,我看看Javascript里异步编程,首先推荐大家看看相对来说比较流行的Promises/A规范。

Promises/A规范

注:为了便于理解,描述可能和Promises/A规范有所出入;

CommonJS之Promises/A规范,通过规范API接口来简化异步编程,使我们的异步逻辑代码更易理解。
遵循Promises/A规范的实现我们称之为Promise对象,Promise对象有且仅有三种状态:unfulfilled(未完成)、fulfilled(已完成)、failed(失败/拒绝);初始创建的时候是unfulfilled(未完成)状态,状态只可以从unfulfilled(未完成)变成fulfilled(已完成),或者unfulfilled(未完成)变成failed(失败/拒绝)。状态一旦变成fulfilled(已完成)或者failed(失败/拒绝),状态就不能再变了。

Promises/A规范提供了一个在程序中描述延时(或将来)概念的解决方案。主要的思想不是执行一个方法然后阻塞应用程序等待结果返回后再回调其他方法,而是返回一个Promise对象来满足未来监听。fulfilled状态和failed状态都可以被监听。Promise通过实现一个then接口来返回Promise对象来注册回调:

then(fulfilledHandler, errorHandler, progressHandler);

then接口用于监听一个Promise的不同状态。fulfilledHandler用于监听fulfilled(已完成)状态,errorHandler用于监听failed(失败/拒绝)状态,progressHandler用于监听unfulfilled(未完成)状态。Promise不强制实现unfulfilled(未完成)的事件监听(例如我们知道旧版本的jQuery(1.5,1.6)的Deferred就是一个Promise的实现,但没有实现对unfulfilled(未完成)状态的监听来回调progressHandler)。

一般认为,then接口返回的是一个新的Promise对象,而不是原来的Promise对象,这个新的新的Promise对象可以理解为是原来Promise对象的一个视图,它只包含原有Promise对象的一组方法,这些方法只能观察原有Promise对象的状态,而无法更改deferred对象的内在状态。这样可以避免多个调用者之间的冲突,多个调用者可以通过改变新的Promise对象状态而不影响别的调用者。

另外,Promise提供了resolve(实现状态由未完成到已完成)和reject(实现状态由未完成到拒绝或失败)两个接口实现状态的转变。

发一张图片帮助理解一下:

Javascript中的异步编程规范Promises/A详细介绍

有了Promise,就可以以同步的思维去编写异步的逻辑了。在异步函数里,不能使用try/catch捕获异常,也不能抛出异常。有了Promise,我们可以直接显式定义errorHandler,相当于捕获异常。

以下是几个遵循Promises/A规范的类库,when,q,rsvp.js,jQuery.Deferred等等。

Javascript 相关文章推荐
JQuery 1.6发布 性能提升,同时包含大量破坏性变更
May 10 Javascript
JS 表单验证大全
Nov 23 Javascript
将Datatable转化成json发送前台实现思路
Sep 06 Javascript
通过Javascript读取本地Excel文件内容的代码示例
Apr 08 Javascript
JavaScript随机生成信用卡卡号的方法
Apr 07 Javascript
JS中对象与字符串的互相转换详解
May 20 Javascript
微信小程序中使元素占满整个屏幕高度实现方法
Dec 14 Javascript
手机端js和html5刮刮卡效果
Sep 29 Javascript
原生JS实现的简单轮播图功能【适合新手】
Aug 17 Javascript
vue 引用自定义ttf、otf、在线字体的方法
May 09 Javascript
VUE 组件转换为微信小程序组件的方法
Nov 06 Javascript
JS实现的定时器展示简单秒表、页面弹框及跳转操作完整示例
Jan 26 Javascript
AMD异步模块定义介绍和Require.js中使用jQuery及jQuery插件的方法
Jun 06 #Javascript
jQuery插件开发详细教程
Jun 06 #Javascript
手写的一个兼容各种浏览器的javascript getStyle函数(获取元素的样式)
Jun 06 #Javascript
jquery进行数组遍历如何跳出当前的each循环
Jun 05 #Javascript
js检验密码强度(低中高)附图
Jun 05 #Javascript
原生js编写设为首页兼容ie、火狐和谷歌
Jun 05 #Javascript
js如何判断用户是否是用微信浏览器
Jun 05 #Javascript
You might like
BBS(php & mysql)完整版(七)
2006/10/09 PHP
php上传文件的增强函数
2010/07/21 PHP
解析百度搜索结果link?url=参数分析 (全)
2012/10/09 PHP
解析php开发中的中文编码问题
2013/08/08 PHP
php实现扫描二维码根据浏览器类型访问不同下载地址
2014/10/15 PHP
ThinkPHP进程计数类Process用法实例详解
2015/09/25 PHP
Laravel使用Caching缓存数据减轻数据库查询压力的方法
2016/03/15 PHP
php实现页面纯静态的实例代码
2017/06/21 PHP
asp.net HttpHandler实现图片防盗链
2009/11/09 Javascript
原生Js实现元素渐隐/渐现(原理为修改元素的css透明度)
2013/06/24 Javascript
javascript读写json示例
2014/04/11 Javascript
node.js中的fs.fsyncSync方法使用说明
2014/12/15 Javascript
JQuery选中checkbox方法代码实例(全选、反选、全不选)
2015/04/27 Javascript
详解JavaScript正则表达式之RegExp对象
2015/12/13 Javascript
详解微信小程序——自定义圆形进度条
2016/12/29 Javascript
AngularJS1.X学习笔记2-数据绑定详解
2017/04/01 Javascript
jQuery获取单选按钮radio选中值与去除所有radio选中状态的方法
2017/05/20 jQuery
JavaScript实现的原生态Tab标签页功能【兼容IE6】
2017/09/18 Javascript
详解react-router 4.0 下服务器如何配合BrowserRouter
2017/12/29 Javascript
vue-cli整合vuex的时候,修改actions和mutations,实现热部署的方法
2018/09/19 Javascript
在vue中v-bind使用三目运算符绑定class的实例
2018/09/29 Javascript
Vue路由切换页面不更新问题解决方案
2020/07/10 Javascript
Python实现去除代码前行号的方法
2015/03/10 Python
python批量生成身份证号到Excel的两种方法实例
2021/01/14 Python
详解Python模块化编程与装饰器
2021/01/16 Python
CSS3毛玻璃效果(blur)有白边问题的解决方法
2016/11/15 HTML / CSS
HEMA英国:荷兰原创设计
2018/08/28 全球购物
个人求职简历中英文自我评价
2013/12/16 职场文书
业务部经理岗位职责
2014/01/04 职场文书
社区交通安全实施方案
2014/03/22 职场文书
委托协议书范本
2014/04/22 职场文书
项目负责人任命书
2014/06/04 职场文书
人事任命书格式
2014/06/05 职场文书
授权委托书样本及填写说明
2014/09/19 职场文书
门面房租房协议书
2014/12/01 职场文书
原生JS实现飞机大战小游戏
2021/06/09 Javascript