iuap-design / blog

📖 用友网络大前端技术团队博客

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

深入JavaScript(1):编写高质量JavaScript代码的基本要点

HuYuee opened this issue · comments

书写可维护的代码

软件bug的修改是昂贵的,并且随着时间的推移,bug修改的成本也会上升,所以要书写规范的代码,并且要在你记得住代码的含义时,立即完善代码的注释。
注释乃代码之灵魂。注释也许会让你的代码开发时间扩大很多,但是维护代码的时间会减少得更多。俗话说的好,磨刀不误砍柴工。

最小全局变量

JavaScript有隐含的全局概念,意味着你不声明的任何变量都会成为一个去全局的对象属性。参考下面的代码:

function sum(x, y) {
     //不推荐写法:隐式全局变量
    result = x + y;
    return result;
}

此段代码中的result没有声明。代码照样运作正常,但在调用函数后你最后的结果就多一个全局变量。

switch模式

var inspect_me = 0,
    result = '';
switch (inspect_me) {
case 0:
   result = "zero";
   break;
case 1:
   result = "one";
   break;
default:
   result = "unknown";
}

这个简单的例子中所遵循的分割约定如下:

  1. 每个case和switch对齐
  2. 每个case中代码缩进
  3. 每个case尽量以break清除结束,除非你非常确信这样最好的办法
  4. 以default结束switch:确保总有健全的结果,即使无情况匹配。

    避免隐式类型转换

    JavaScript的变量在比较的时候会隐式类型转换。这就是为什么一些诸如:false == 0 或 “” == 0 返回的结果是true。为避免引起混乱的隐含类型转换,在你比较值和表达式类型的时候始终使用===和!==操作符。
var zero = 0;
if (zero === false) {
   // 不执行,因为zero为0, 而不是false
}

// 反面示例
if (zero == false) {
   // 执行了...
}

避免eval()

使用eval()也带来了安全隐患,因为被执行的代码(例如从网络来)可能已被篡改。
所有使用eval()方法处理的代码都可以使用其他相对应的办法来解决。
比如解析JSON,可以使用JavaScript内置方法来解析。若浏览器不支持JSON.parse(),你可 以使用来自JSON.org的库。

parseInt()下的数值转换

使用parseInt()你可以从字符串中获取数值,该方法接受另一个基数参数,这经常省略,但不应该。
当字符串以”0″开头的时候就有可能会出问 题,例如,部分时间进入表单域,在ECMAScript 3中,开头为”0″的字符串被当做8进制处理了,但这已在ECMAScript 5中改变了。
为了避免矛盾和意外的结果,总是指定基数参数。

eval我遇到过一个场景用这个非常的合适 当时的场景是这样的 一个页面有3个tab 每个tab下面又有50多个编辑框
每个编辑框对应一个公式
比如现在tab1下面有个编辑框名字叫a跟他对应的公式是
(d+c)h-b+(d2)/4
这里面对应的h b c d 都是对应页面的编辑框
意思就是a编辑框输入的内容 需要把这几个对应的编辑框值获取出来 然后用这个公式参与运算
当时找了一圈没有发现很适合这种的技术
后来灵机一动 为啥不用eval呢 可以简单很多
最后实现这个效果 只用了不到6行代码