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 相关文章推荐
ext form 表单提交数据的方法小结
Aug 08 Javascript
JS IE和FF兼容性问题汇总
Feb 09 Javascript
jQuery EasyUI API 中文文档 - NumberBox数字框
Oct 13 Javascript
修改Jquery Dialog 位置的实现方法
Aug 26 Javascript
js常用DOM方法详解
Feb 04 Javascript
jQuery实现字符串全部替换的方法【推荐】
Mar 09 Javascript
实例分析js事件循环机制
Dec 13 Javascript
layui点击导航栏刷新tab页的示例代码
Aug 14 Javascript
vue实现前台列表数据过滤搜索、分页效果
May 28 Javascript
小程序如何支持使用 async/await详解
Sep 12 Javascript
前端vue-cli项目中使用img图片和background背景图的几种方法
Nov 13 Javascript
jQuery弹框插件使用方法详解
May 26 jQuery
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脚本数据库功能详解(中)
2006/10/09 PHP
php实例分享之html转为rtf格式
2014/06/02 PHP
PHP动态柱状图实现方法
2015/03/30 PHP
PHP变量的作用范围实例讲解
2020/12/22 PHP
Ubuntu 11.10 安装Node.js的方法
2011/11/30 Javascript
javascript:json数据的页面绑定示例代码
2014/01/26 Javascript
使用jQuery异步加载 JavaScript脚本解决方案
2014/04/20 Javascript
jQuery遍历对象、数组、集合实例
2014/11/08 Javascript
js实现照片墙功能实例
2015/02/05 Javascript
理解javascript封装
2016/02/23 Javascript
JS树形菜单组件Bootstrap TreeView使用方法详解
2016/12/21 Javascript
bootstrap vue.js实现tab效果
2017/02/07 Javascript
Angular2环境搭建具体操作步骤(推荐)
2017/08/04 Javascript
微信小程序多列选择器range-key使用详解
2020/03/30 Javascript
微信小程序如何连接Java后台
2019/08/08 Javascript
微信小程序获取地理位置及经纬度授权代码实例
2019/09/18 Javascript
vue实现吸顶、锚点和滚动高亮按钮效果
2019/10/21 Javascript
微信小程序中限制激励式视频广告位显示次数(实现思路)
2019/12/06 Javascript
CKEditor扩展插件:自动排版功能autoformat插件实现方法详解
2020/02/06 Javascript
Vue使用富文本编辑器Vue-Quill-Editor(含图片自定义上传服务、清除复制粘贴样式等)
2020/05/15 Javascript
[01:01:35]Optic vs paiN 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
零基础写python爬虫之爬虫编写全记录
2014/11/06 Python
Python使用Flask框架同时上传多个文件的方法
2015/03/21 Python
Python编程判断一个正整数是否为素数的方法
2017/04/14 Python
对Python3之进程池与回调函数的实例详解
2019/01/22 Python
Python使用reportlab模块生成PDF格式的文档
2019/03/11 Python
python+Django+pycharm+mysql 搭建首个web项目详解
2019/11/29 Python
python 项目目录结构设置
2020/02/14 Python
Pycharm Git 设置方法
2020/09/15 Python
python 贪心算法的实现
2020/09/18 Python
现场施工员岗位职责
2015/04/11 职场文书
2016五一劳动节慰问信
2015/11/30 职场文书
详解用Python把PDF转为Word方法总结
2021/04/27 Python
Python中OpenCV实现查找轮廓的实例
2021/06/08 Python
CSS3 Tab动画实例之背景切换动态效果
2021/08/23 HTML / CSS
Python内置包对JSON文件数据进行编码和解码
2022/04/12 Python