JavaScript 异步调用框架 (Part 2 - 用例设计)


Posted in Javascript onAugust 03, 2009

传递回调
我们首先要考虑的一个问题是,如何传递回调入口。在最传统的XHR调用当中,回调函数会被作为最后一个参数传递给异步函数:

function asyncOperation(argument, callback)

在参数相当多的时候,我们可以把参数放到一个JSON里面,这样参数就如同具名参数一样,可以通过参数名选择性的传递参数,不传递的参数相当于使用默认值。这是从Prototype开始就流行起来的做法:
function asyncOperation(argument, options)

然而这两种做法都有一个坏处,就是把同步函数改为异步函数(或同步异步混合函数)时,必须显式地修改函数签名,在最后增加一个(或多个)参数。

由于在调用栈的底层引入异步函数对我们来说太常见了,为此可能要更改一大堆上层调用函数签名的成本实在是太高了,所以我们还是想一个不用修改函数签名的做法吧。

在这里我参考了.NET Framework的IAsyncResult设计,把异步操作有关的一切信息集中到一个对象上来,从而避免了对函数签名的修改。在此,我们假设一个异步函数的调用原型是这样子的:

function asyncOperation(argument) { 
operation = new Async.Operation(); 
setTimeout(function() { operation.yield("hello world"); }, 1000); 
return operation; 
}

在这段代码里,我们返回了一个Operation对象,用于将来传递回调函数。同时,我们通过setTimeout模拟了异步返回结果,而具体的返回方式就是yield方法。

接着,我们还要设计传递回调函数的方法。由于我们不能好像C#那样重载+=运算符,所以只能用函数传递回调函数:

var operation = asyncOperation(argument); 
operation.addCallback(function(result) { alert(result); });

在C#里面做这样的设计是不安全的,因为在异步操作可能在添加回调之前就完成了。但在JavaScript里面这样写是安全的,因为JavaScript是单线程的,紧接着asyncOperation的同步addCallback必然先执行,asyncOperation中的异步yield必然后执行。

调用顺序
可能有人要问,如果用户使用同步的方式来调用yield,这时候执行顺序不一样依赖于yield的实现吗?没错,不过yeild是在框架中一次性实现的,我们只要把它做成异步的就可以了,这样即使对它进行同步调用,也不影响执行顺序:

function psudoAsyncOperation(argument) { 
operation = new Async.Operation(); 
operation.yield("hello world"); 
return operation; 
} 
var operation = asyncOperation(argument); 
operation.addCallback(function(result) { alert(result); });

就算把代码写成这个样子,我们也能确保addCallback先于yield的实际逻辑执行。

事后回调
有时候,框架的使用者可能真的写出了先yield后addCallback的代码。这时候,我认为必须保证addCallback中添加的回调函数会被立即触发。因为用户添加这个回调函数,意味着他期望当异步操作有结果时通知这个回调函数,而这与添加回调函数时异步操作是否完成无关。为此,我们再添加一个用例:

function psudoAsyncOperation(argument) { 
operation = new Async.Operation(); 
operation.yield("hello world"); 
return operation; 
} 
var operation = asyncOperation(argument); 
setTimeout(function() { 
operation.addCallback(function(result) { alert(result); }); 
}, 1000);

小结
到这里,我们就设计好了一个名为Async.Operation的异步操作对象,具体如何实现关键的yield方法和addCallback方法将在下一篇文章讲述如果。
Javascript 相关文章推荐
JavaScript语句可以不以;结尾的烦恼
Mar 08 Javascript
Jquery动态改变图片IMG的src地址示例
Jun 25 Javascript
chrome下img加载对height()的影响示例探讨
May 26 Javascript
JavaScript获取数组最小值和最大值的方法
Jun 09 Javascript
jQuery实现鼠标经过弹出提示信息的地图热点效果
Aug 07 Javascript
Bootstrap中表单控件状态(验证状态)
Aug 04 Javascript
详解javascript获取url信息的常见方法
Dec 19 Javascript
jQuery实现扑克正反面翻牌效果
Mar 10 Javascript
js如何编写简单的ajax方法库
Aug 02 Javascript
JS实现从对象获取对象中单个键值的方法示例
Jun 05 Javascript
vue 获取及修改store.js里的公共变量实例
Nov 06 Javascript
vue利用全局导航守卫作登录后跳转到未登录前指定页面的实例代码
May 19 Javascript
JavaScript 异步调用框架 (Part 1 - 问题 & 场景)
Aug 03 #Javascript
jQuery 相关控件的事件操作分解
Aug 03 #Javascript
利用javascript实现一些常用软件的下载导航
Aug 03 #Javascript
jQuery 隔行换色 支持键盘上下键,按Enter选定值
Aug 02 #Javascript
一句话JavaScript表单验证代码
Aug 02 #Javascript
JavaScript 关键字屏蔽实现函数
Aug 02 #Javascript
Javascript 验证上传图片大小[客户端]
Aug 01 #Javascript
You might like
php 无法载入mysql扩展
2010/03/12 PHP
PHP中__FILE__、dirname与basename用法实例分析
2014/12/01 PHP
Laravel 5.5 异常处理 & 错误日志的解决
2019/10/17 PHP
jQuery 淡入淡出 png图在ie8下有黑色边框的解决方法
2013/03/05 Javascript
详解JavaScript函数绑定
2013/08/18 Javascript
jQuery实现表单步骤流程导航代码分享
2015/08/28 Javascript
js实现的页面加载完毕之前loading提示效果完整示例【附demo源码下载】
2016/08/02 Javascript
浅谈jQuery中的$.extend方法来扩展JSON对象
2017/02/12 Javascript
Bootstrap响应式导航由768px变成992px的实现代码
2017/06/15 Javascript
js禁止表单重复提交
2017/08/29 Javascript
jquery实现图片跟随鼠标的实例
2017/10/17 jQuery
10 种最常见的 Javascript 错误(频率最高)
2018/02/08 Javascript
vue.js 获取select中的value实例
2018/03/01 Javascript
vue2实现搜索结果中的搜索关键字高亮的代码
2018/08/29 Javascript
JavaScript变速动画函数封装添加任意多个属性
2019/04/03 Javascript
微信小程序单选radio及多选checkbox按钮用法示例
2019/04/30 Javascript
mustache.js实现首页元件动态渲染的示例代码
2020/12/28 Javascript
Python代码调试的几种方法总结
2015/04/15 Python
Python中matplotlib中文乱码解决办法
2017/05/12 Python
python爬虫入门教程--优雅的HTTP库requests(二)
2017/05/25 Python
Python cookbook(数据结构与算法)字典相关计算问题示例
2018/02/18 Python
python中time库的实例使用方法
2019/10/31 Python
Python学习笔记之函数的参数和返回值的使用
2019/11/20 Python
Pycharm打开已有项目配置python环境的方法
2020/07/03 Python
css3实现冲击波效果的示例代码
2018/01/11 HTML / CSS
Belle Maison倍美丛官网:日本千趣会旗下邮购网站
2016/07/22 全球购物
中科方德软件测试面试题
2016/04/21 面试题
中职生自我鉴定范文
2013/10/03 职场文书
体育专业个人求职信范文
2013/12/27 职场文书
教师节活动主持词
2014/04/02 职场文书
市场营销专业毕业生求职信
2014/07/21 职场文书
社区两委对照检查材料
2014/08/23 职场文书
2014年酒店工作总结范文
2014/11/17 职场文书
田径运动会通讯稿
2015/07/18 职场文书
Vue如何实现组件间通信
2021/05/15 Vue.js
排查并解决MySQL生产库内存使用率高的报警
2022/04/11 MySQL