在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 相关文章推荐
javascript编程起步(第七课)
Jan 10 Javascript
js中 关于undefined和null的区别介绍
Apr 16 Javascript
jquery防止重复执行动画避免页面混乱
Apr 22 Javascript
js实现带圆角的多级下拉菜单效果
Aug 28 Javascript
jQuery带进度条全屏图片轮播特效代码分享
Jun 28 Javascript
利用bootstrapValidator验证UEditor
Sep 14 Javascript
jQuery Ajax实现跨域请求
Jan 21 Javascript
js中getter和setter用法实例分析
Aug 14 Javascript
详解jQuery中的prop()使用方法
Jan 05 jQuery
Vue实现图片轮播组件思路及实例解析
May 11 Javascript
JS如何寻找数组中心索引过程解析
Jun 01 Javascript
vue实现PC端分辨率适配操作
Aug 03 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
hessian 在PHP中的使用介绍
2010/12/13 PHP
php array_key_exists() 与 isset() 的区别
2016/10/24 PHP
PHP封装的简单连接MongoDB类示例
2019/02/13 PHP
javascript 进阶篇1 正则表达式,cookie管理,userData
2012/03/14 Javascript
js函数的延迟加载实现代码
2012/10/11 Javascript
Jquery实现列表(隔行换色,全选,鼠标滑过当前行)效果实例
2013/06/09 Javascript
jquery+json实现数据列表分页示例代码
2013/11/15 Javascript
JavaScript中使用concat()方法拼接字符串的教程
2015/06/06 Javascript
Vue + Webpack + Vue-loader学习教程之功能介绍篇
2017/03/14 Javascript
详解vue2路由vue-router配置(懒加载)
2017/04/08 Javascript
angularjs实现过滤并替换关键字小功能
2017/09/19 Javascript
vue router自动判断左右翻页转场动画效果
2017/10/10 Javascript
如何重置vue打印变量的显示方式
2017/12/06 Javascript
利用VS Code开发你的第一个AngularJS 2应用程序
2017/12/15 Javascript
Vue实现微信支付功能遇到的坑
2019/06/05 Javascript
解析Python中的异常处理
2015/04/28 Python
python中执行shell的两种方法总结
2017/01/10 Python
深入理解Python 关于supper 的 用法和原理
2018/02/28 Python
python中返回矩阵的行列方法
2018/04/04 Python
如何利用python制作时间戳转换工具详解
2018/09/12 Python
python+selenium实现简历自动刷新的示例代码
2019/05/20 Python
浅谈python多进程共享变量Value的使用tips
2019/07/16 Python
python装饰器原理与用法深入详解
2019/12/19 Python
python实现梯度法 python最速下降法
2020/03/24 Python
解决IDEA 的 plugins 搜不到任何的插件问题
2020/05/04 Python
HTML5中使用postMessage实现两个网页间传递数据
2016/06/22 HTML / CSS
阿迪达斯德国官方网站:adidas德国
2017/07/12 全球购物
Lookfantastic瑞典:英国知名美妆购物网站
2018/04/06 全球购物
西雅图电动自行车公司:Rad Power Bikes
2020/02/02 全球购物
化工专业个人的求职信范文
2013/11/28 职场文书
认购协议书范本
2014/04/22 职场文书
2015年监理工作总结范文
2015/04/07 职场文书
《揠苗助长》教学反思
2016/02/20 职场文书
抖音短视频(douyin)去水印工具的实现代码
2021/03/30 Javascript
用Python爬取各大高校并可视化帮弟弟选大学,弟弟直呼牛X
2021/06/11 Python
MySQL生成千万测试数据以及遇到的问题
2022/08/05 MySQL