您现在的位置:首页 --> JavaScript --> 两行 JavaScript 代码
两行 JavaScript 代码
浏览:3323次 出处信息
最近看到了两行 JavaScript 代码,很受启发。
1. 封装 DOM 属性
在 JavaScript 中,我们可以获取HTML元素的属性值,例如 element.id 。但是,因为 for 和 class 是 JavaScript 中的关键字,所以在 JavaScript 中这两个属性名称分别用 htmlFor 和 className 代替,于是在封装的时候需要先对这两个属性进行特殊判断。通常,我们会这么写:
1 2 3 4 5 6 7 8 9 10 |
function getAttr(el, attrName){ var attr; if ('for' == attrName) { attr = 'htmlFor'; } else if ('class' == attrName) { attr = 'className'; } else { attr = attrName; } } |
但是我在精通 JavaScript 发现了一种很妙的写法, John Resig 是这么写的:
1 2 3 |
function getAttr(el, attrName){ var attr = {'for':'htmlFor', 'class':'className'}[attrName] || attrName; } |
构建了一个对象来做判断,实在是巧妙!这样一来节省了很多代码,也就减少了BUG出现的可能性,而且也没有丧失其可读性,是很值得学习的。
2. 交换两个变量的值
这个问题相信学过一点编程的人都知道,一般来说我们会这么写:
1 2 3 4 5 6 |
var foo = 1; var bar = 2; var temp = foo; foo = bar; bar = temp; |
通过一个临时变量来做数据的缓冲,很直观。但是否可以不使用临时变量呢?看一下下面的这行代码:
1 |
foo = [bar, bar=foo][0]; |
没有使用到临时变量,而是利用了数组。实在是妙!
上面这两行代码看上去很简单,不像一些诸如高级算法之类的代码那么显眼,但是,如果不是对语言本身非常了解,如果没有多年的编程经验和思考,如果对数据结构不熟悉,绝对不可能写出这样的代码。或许这种对每一行代码的深思熟虑,正是大师和平庸程序员之间的区别所在。
另外,这也从侧面说明了:编程的时候不要忘记思考,否则你就只是一个完成工作的机器。所以,如果你现在的工作只是让你疯狂做业务而不给你思考和学习的时间,别犹豫,换一个。
建议继续学习:
- 两行 JavaScript 代码 (阅读:3340)
- PHP面向对象编程的三大特性 (阅读:3353)
- Javascript 面向对象编程(一):封装 (阅读:2472)
- JavaScript 封装问题 (阅读:2185)
QQ技术交流群:445447336,欢迎加入!
扫一扫订阅我的微信号:IT技术博客大学习
扫一扫订阅我的微信号:IT技术博客大学习
<< 前一篇:Javascript浅拷贝与深拷贝
后一篇:DOM操作琐碎知识点 >>
文章信息
- 作者:Dreamer 来源: Dreamer's Blog
- 标签: 交换 封装
- 发布时间:2010-08-08 23:56:59
近3天十大热文
- [55] IOS安全–浅谈关于IOS加固的几种方法
- [54] android 开发入门
- [54] 如何拿下简短的域名
- [54] 图书馆的世界纪录
- [52] Go Reflect 性能
- [52] Oracle MTS模式下 进程地址与会话信
- [49] 【社会化设计】自我(self)部分――欢迎区
- [48] 读书笔记-壹百度:百度十年千倍的29条法则
- [41] 程序员技术练级攻略
- [35] 视觉调整-设计师 vs. 逻辑