JavaScript中使用Callback控制流程介绍


Posted in Javascript onMarch 16, 2015

javascript中随处可见的callback对于流程控制来说是一场灾难,缺点显而易见:

1.没有显式的return,容易产生多余流程,以及由此引发的bug。
2.造成代码无限嵌套,难以阅读。

下面就来说说怎么解决避免上述的问题。

第一个问题是一个习惯问题,在使用callback的时候往往会让人忘了使用return,这种情况在使用coffee-script的时候尤甚(虽然它在编译成javascript时会自行收集最后的数据作为返回值,但是这个返回值并不一定代表你的初衷)。看看下面的例子。

a = (err, callback)->

  callback() if err?

  console.log 'you will see me'
b = ->

  console.log 'I am a callback'
a('error', b)

在这种所谓”error first”的代码风格中,显然我们不希望出错时方法a中的后续代码仍然被执行,但是又不希望用throw来让整个进程挂掉(要死也得优雅的死嘛~),那么上面的代码就会产生bug。

一种解决方案就是老老实实的写if...else...,但是我更倾向于下面的做法:

a = (err, callback)->

  return callback() if err?

  console.log 'you will not see me'
b = ->

  console.log 'I am a callback'
a('error', b)

javascript异步方法中的返回值大多没什么用处,所以这里用return充当一个流程控制的角色,比if...else...更少的代码,但是更加清晰。

第二个问题是娘胎里带来的,很难根除。

一种不错的方法是使用一些流程控制模块来将代码显得更加有条理,比如async就是一个不错的模块,提供了一系列的接口,包括迭代,循环,和一些条件语句,甚至还包含了一个队列系统。下面的例子可以表名两种写法的优劣

#normal
first = (callback)->

  console.log 'I am the first function'

  callback()
second = (callback)->

  console.log 'I am the second function'

  callback()
third = ()->

  console.log 'I am the third function'
first ->

  second ->

    third()
# use async
async = require('async')
async.waterfall [

  first,

  second,

  third

], (err)->

作为睿智的你,会选择哪一种呢。

Javascript 相关文章推荐
潜说js对象和数组
May 25 Javascript
Extjs4 Treegrid 使用心得分享(经验篇)
Jul 01 Javascript
js实现点小图看大图效果的思路及示例代码
Oct 28 Javascript
setinterval()与clearInterval()JS函数的调用方法
Jan 21 Javascript
javascript异步编程代码书写规范Promise学习笔记
Feb 11 Javascript
Bootstrap 模态框(Modal)插件代码解析
Dec 21 Javascript
js仿小米手机上下滑动效果
Feb 05 Javascript
JavaScript中offsetWidth的bug及解决方法
May 17 Javascript
react-native-fs实现文件下载、文本存储的示例代码
Sep 22 Javascript
webpack引入eslint配置详解
Jan 22 Javascript
vue+express+jwt持久化登录的方法
Jun 14 Javascript
javascript 易错知识点实例小结
Apr 25 Javascript
jquery图片切换插件
Mar 16 #Javascript
JavaScript中的方法重载实例
Mar 16 #Javascript
jquery中attr和prop的区别分析
Mar 16 #Javascript
JavaScript中扩展Array contains方法实例
Aug 23 #Javascript
JavaScript中消除闭包的一般方法介绍
Mar 16 #Javascript
jQuery实现的支持IE的html滑动条
Mar 16 #Javascript
JavaScript计算两个日期时间段内日期的方法
Mar 16 #Javascript
You might like
windows下PHP APACHE MYSQ完整配置
2007/01/02 PHP
php max_execution_time执行时间问题
2011/07/17 PHP
php遍历数组的方法分享
2012/03/22 PHP
php array的学习笔记
2012/05/10 PHP
Laravel 4 初级教程之Pages、表单验证
2014/10/30 PHP
php+mysql数据库查询实例
2015/01/21 PHP
解决laravel中日志权限莫名变成了root的问题
2019/10/17 PHP
php 多进程编程父进程的阻塞与非阻塞实例分析
2020/02/22 PHP
JQuery扩展插件Validate 5添加自定义验证方法
2011/09/05 Javascript
动态创建样式表在各浏览器中的差异测试代码
2011/09/13 Javascript
js遍历子节点子元素附属性及方法
2014/08/19 Javascript
js添加绑定事件的方法
2016/05/15 Javascript
AngularJS实现给动态生成的元素绑定事件的方法
2016/12/14 Javascript
JQuery 进入页面默认给已赋值的复选框打钩
2017/03/23 jQuery
jQuery中 DOM节点操作方法大全
2017/10/12 jQuery
详解RequireJs官方使用教程
2017/10/31 Javascript
nodejs中Express与Koa2对比分析
2018/02/06 NodeJs
vue2.0学习之axios的封装与vuex介绍
2018/05/28 Javascript
jQuery实现基本隐藏与显示效果的方法详解
2018/09/05 jQuery
JavaScript实现的联动菜单特效示例
2019/07/08 Javascript
javascript实现函数柯里化与反柯里化过程解析
2019/10/08 Javascript
小程序登录之支付宝授权的实现示例
2019/12/13 Javascript
ES6学习教程之Promise用法详解
2020/11/22 Javascript
Python unittest框架操作实例解析
2020/04/13 Python
Django3中的自定义用户模型实例详解
2020/08/23 Python
Vs Code中8个好用的python 扩展插件
2020/10/12 Python
python基于socket模拟实现ssh远程执行命令
2020/12/05 Python
如果Session Bean得Remove方法一直都不被调用会怎么样
2012/07/14 面试题
业务总经理岗位职责
2014/02/03 职场文书
我爱我校演讲稿
2014/05/21 职场文书
销售活动策划方案
2014/08/26 职场文书
坚守艰苦奋斗精神坚决反对享乐主义整改措施
2014/09/17 职场文书
党的群众路线教育实践活动个人自我剖析材料
2014/10/07 职场文书
2014年卫生院工作总结
2014/12/03 职场文书
合同补充协议书
2016/03/24 职场文书
字典算法实现及操作 --python(实用)
2021/03/31 Python