在JavaScript中遭遇级联表达式陷阱


Posted in Javascript onMarch 08, 2007

依稀还记得,在学习C语言的库函数时,很多字符串操作相关的函数都会返回和结果相关的指针。其实这个返回值很多时候都并不是非常必要,因为在我们的传入的参数中,十有八九已包含了这个指针。而加上这个返回值的最大好处就是,可以让我们方便的书写出级联表达式。但是这些年的实际工作中,越发觉得级联表达式是个魔鬼馅饼。

    比如在C语言中,我们熟悉的字符串操作函数strcpy,strcat等,它们的原形一般是: extern char *strxxx(char *dest, char *src);
    返回值char*其实就是调用参数中的*dest,这样一来就可以方便的写出级联表达式,如下:
char *title = "Mr. ";
char *name = "birdshome";
int len = strlen(strcat(title, name));
    在面向对象编程中,通过方法返回对象,我们可以编写链式表达式。虽然不管是级联表达式也好,还是链式表达式也好,都可以让我们在编写代码的方便一些,不过如果使用不当,也会非常郁闷。特别是对于级联表达式,如果函数嵌套过多,不易理解不说,debug也会很郁闷。

    下面这个JavaScript的级联语句,就让我郁闷了很久。。。 dimInfo.push(StringHelper.ArrayToString(item.m_DimensionName,
   item.m_DimensionUniqueName, item.m_AnalysisStatus,
   (item.m_IsParameterized ? 'checked' : ''), item.m_DimensionType), levelTypes);
    而正确的语句因该是下面这个: dimInfo.push(StringHelper.ArrayToString(item.m_DimensionName,
   item.m_DimensionUniqueName, item.m_AnalysisStatus,
   (item.m_IsParameterized ? 'checked' : ''), item.m_DimensionType, levelTypes));
    问题就出在倒数第二个括号上")"上,本来这个括号应该在参数levelTypes之后,结果没有注意弄到了levelTypes前面去了,这种书写上的错误,要一眼看出来很难很难。更郁闷的是,JavaScript对函数的参数个数,以及有没有参数都一点不感兴趣,所以这个错误的语句完全可以运行"正常",只是数据传到后台后,怎么也得不到需要的值,总是undefined。

    另外,还有复合参数调用的语句,如果能适当的展开也会给我们带来很多好处,比如代码:
var rect = dashboard.getBoundingClientRect();
this.InsertNewRoom(dashboard, event.clientX-rect.left-1, event.clientY-rect.top, event);
    将复合参数展开后的代码为: var rect = dashboard.getBoundingClientRect();
var innerX = event.clientX-rect.left-1;
var innerY = event.clientY-rect.top;
this.InsertNewRoom(dashboard, innerX, innerY, event);
    虽然这个展开的代码没有添加任何额外的逻辑,但是添加了临时变量innerX和innerY的语句显然比复合参数的语句要易于理解的多。这样代码虽然多了,但是却使代码有了self-documented特性,同时也没有改变代码的逻辑和效率。我相信在debug或者修改别人的代码时,你是希望看到后一种写法的。

Javascript 相关文章推荐
jQuery 性能优化手册 推荐
Feb 23 Javascript
js arguments对象应用介绍
Nov 28 Javascript
jQuery操作基本控件方法实例分析
Dec 31 Javascript
AngularJS基础 ng-switch 指令简单示例
Aug 03 Javascript
Bootstrap模态框禁用空白处点击关闭
Oct 20 Javascript
JS实现改变HTML上文字颜色和内容的方法
Dec 30 Javascript
原生js实现商品放大镜效果
Jan 12 Javascript
AngularJS路由切换实现方法分析
Mar 17 Javascript
angular学习之从零搭建一个angular4.0项目
Jul 10 Javascript
bootstrap table实现双击可编辑、添加、删除行功能
Sep 27 Javascript
vue+element实现表格新增、编辑、删除功能
May 28 Javascript
js实现从右往左匀速显示图片(无缝轮播)
Jun 29 Javascript
原型方法的不同写法居然会影响调试的解决方法
Mar 08 #Javascript
在js中使用"with"语句中跨frame的变量引用问题
Mar 08 #Javascript
JS类库Bindows1.3中的内存释放方式分析
Mar 08 #Javascript
使用IE的地址栏来辅助调试Web页脚本
Mar 08 #Javascript
JScript中的undefined和"undefined"的区别
Mar 08 #Javascript
JavaScript语句可以不以;结尾的烦恼
Mar 08 #Javascript
JScript中的"this"关键字使用方式补充材料
Mar 08 #Javascript
You might like
php urlencode()与urldecode()函数字符编码原理详解
2011/12/06 PHP
PHP自带方法验证邮箱、URL、IP是否合法的函数
2016/12/08 PHP
PHP实现的MD5结合RSA签名算法实例
2017/10/07 PHP
laravel 去掉index.php伪静态的操作方法
2019/10/12 PHP
Laravel 集成微信用户登录和绑定的实现
2019/12/27 PHP
原生javascript获取元素样式属性值的方法
2010/12/25 Javascript
Javascript 页面模板化很多人没有使用过的方法
2012/06/05 Javascript
JS实现静止元素自动移动示例
2014/04/14 Javascript
微信小程序(应用号)简单实例应用及实例详解
2016/09/26 Javascript
jQuery中DOM节点删除之empty与remove
2017/01/20 Javascript
JavaScript优化以及前段开发小技巧
2017/02/02 Javascript
基于webpack 实用配置方法总结
2017/09/28 Javascript
vue中v-model动态生成的实例详解
2017/10/27 Javascript
Element-ui table中过滤条件变更表格内容的方法
2018/03/02 Javascript
详解微信小程序入门从这里出发(登录注册、开发工具、文件及结构介绍)
2020/07/21 Javascript
[06:07]辉夜杯现场观众互动 “比谁远送显示器”
2015/12/26 DOTA
[33:23]VG vs Pain 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
[01:05:07]DOTA2-DPC中国联赛 正赛 DLG vs Dragon BO3 第一场2月1日
2021/03/11 DOTA
python实现守护进程、守护线程、守护非守护并行
2018/05/05 Python
Python smtplib实现发送邮件功能
2018/05/22 Python
python中reader的next用法
2018/07/24 Python
python列表生成器迭代器实例解析
2019/12/19 Python
matplotlib quiver箭图绘制案例
2020/04/17 Python
Python如何对XML 解析
2020/06/28 Python
matplotlib阶梯图的实现(step())
2021/03/02 Python
HTML5对比HTML4的主要改变和改进总结
2016/05/27 HTML / CSS
特步官方商城:Xtep
2017/03/21 全球购物
校运会入场式解说词
2014/02/10 职场文书
授权委托书样本及填写说明
2014/09/19 职场文书
教师四风自我剖析材料
2014/09/30 职场文书
小学推普周活动总结
2015/05/07 职场文书
2019年励志签名:致拼搏路上的自己
2019/10/11 职场文书
JPA如何使用entityManager执行SQL并指定返回类型
2021/06/15 Java/Android
浅谈resultMap的用法及关联结果集映射
2021/06/30 Java/Android
Python Flask实现进度条
2022/05/11 Python
nginx访问报403错误的几种情况详解
2022/07/23 Servers