JavaScript几点编码规范的说明

本文主要介绍提高代码质量的JavaScript几点编码规范

- JavaScript几点编码规范的说明

1. 在每个函数的开头部分声明所有变量

直接使用未经声明的变量，JavaScript会将这种变量作为隐式全局变量处理，所以忘记声明变量会导致全局变量污染。
JavaScript采用了块语法却没有提供块作用域，JavaScript的作用域为函数作用域。所以在每个函数开头部分声明所有变量是更好的方式。

2. “{”放在上一行的尾部而不是下一行的头部

JavaScript有一个自动修复机制，通过自动插入分好来修正有缺损的程序，但有时这会导致错误。比如：
return { status: true };

自动插入分号会导致返回undefined:
return; { status: true };

所以应该将“{”放在上一行尾部避免这种问题：
return{ status: true };

3. 判断null类型不能直接用typeof

typeof null 返回“object”而不是“null”，typeof无法区别null与对象，但null值为假，所有对象值为真，所以可以这样判断：
if(my_value && typeof my_value === 'object'){...}
或者直接判断 my_value===null

4. parseInt方法应该加上基数参数

parseInt将字符串转换为整数，但遇到非数字时会停止解析，parseInt(“16”)和parseInt(“16 tons”) 产生相同结果。而如果字符串第一个字符为“0”，会基于八进制进行解析，parseInt(“08”)会返回0作为结果。所以加上基数参数parseInt(“08”,10)会返回正确的十进制结果8。

5. 判断是否为数字不能直接用typeof

NaN是一个特殊的数量值，表示的不是一个数字，但typeof NaN === 'number' 却返回true,试图转换非数字形式字符串为数字时会产生NaN, parseInt(‘str’)返回NaN。typeof不能辨别数字和NaN，而且NaN不等于自身：NaN === NaN返回false。isNaN函数可以辨别数字与NaN。但判断数字的最佳方式是使用isFinite函数，它会筛除掉NaN和Infinity(无穷大)：var isNumber = function isNumber(value){return typeof value ==='number' && isFinite(value);}

6. 辨别数组和对象不能直接typeof

typeof数组返回的是‘object’,因为JavaScript没有真正的数组。判断数组还需要检查constructor属性：
if(my_value && typeof my_value === 'object' && my_value.constructor === Array){...}
但以上方法对于不同帧或窗口创建的数组将会返回false,以下为可能出现这种状况时更可靠的检测方法：
if(Object.prototype.toString.apply(my_value) === '[object Array]'){...}

7. 假值之间不可互换

值	类型
0	number
NaN	number
”	string
false	boolean
null	object
undefined	undefined

以上均为假值，即if(*)判断为假。但它们之间不可互换。用“==”这种不可靠地方式会强制转换，且会产生不确定的结果。比如：”==null 返回false,undefined==null 返回true。所以要避免假值之间的互换，而且不要使用‘==’应该使用‘===‘。

8. 避免使用with语句

JavaScript提供的with语句结果有时不可预料，应当避免使用。
比如：with(obj){a=b;}和下面的代码做同样的事情：

if(obj.a===undefined){
    a=obj.b===undefined?b:obj.b;
}else{
    obj.a=obj.b===undefined?b:obj.b;
}

所以无法确定代码会执行想要的事情。with严重影响了JavaScript处理速度，因为阻断了词法作用域绑定。

9. 避免使用eval函数

eval函数传递一个字符串给JavaScript编译器，并且执行其结果。
比如：eval("myValue = myObject." + myKey +";");
只是执行了一条检索赋值语句，但eval使程序性能显著降低，因为需要运行编译器，且可读性较差。
另外eval函数还降低了程序安全性，因为它给了字符串参数太多权利。window的setTimeout和setInterval函数同样可以接受字符串参数，应该避免使用，尽量使用函数参数。

10. if、while、do和for语句应该使用代码块

if、while、do和for语句可以接受花括号代码块，也可以接受单行语句。
比如：

if(ok)
    t=true;
    advance();

本意是：

if(ok){
    t=true;
}
advance();

单行语句模糊了程序的结构，很容易出错，应该避免使用。

11. 避免使用++、–和位运算符

递增、递减运算符会造成代码拥挤、复杂和隐晦，很容易造成错误，应当避免使用，可使用类似 i+=1替代。
JavaScript没有整数型，只有双精度浮点型，位操作符将运算数先转换成整数再执行运算，然后再转换回去。且JavaScript执行环境接触不到硬件，比一般语言执行速度慢，所以使用位运算会非常慢。

12. function语句应该放在函数块中，function表达式括在”（）“中

function语句在解析时会发生被提升的情况，不管function放置在哪里都会被移动到被定义时所在的作用域顶层，大多数浏览器允许if语句中使用function语句，但解析时处理各不相同。应当避免在if语句中使用function语句。另外避免在循环中创建函数，只在函数块中定义函数。
而一个语句不能以function表达式开头，因为会解析为function语句，解决办法为把表达式放在圆括号中执行：

（function(){
    var value;
    ...
}()）;

13. 避免使用new和void

new创建一个继承于原型的新对象，this绑定到新对象，如果忘记使用new
就是普通的函数调用，this绑定到全局对象而不是新创建的对象，会造成全局变量污染（且没有警告）。可以以首字母大写命名的方式命名构造器函数，但更好的策略是避免使用new。另外JavaScript有一套类型包装对象new Boolean、new Array,但完全没有必要使用，可用{}和[]代替。
JavaScript中void运算符接受一个运算数并返回undefined，没什么实际作用，且令人困惑，应当避免使用。

本文引用自《JavaScript 语言精粹》

之前的一篇文章，JavaScript需要避免的问题总结

另外可以使用JSHint工具用来规范自己的代码，并对不规范的代码给出提示和警告，JSHint可以自由配置规范，配置项可参考http://jshint.com/docs/options/
本人使用vscode编辑JavaScript代码，vscode配置JSHint可参考另一篇文章：vscode配置JSHint提示工具
可以使用ECMAscript 5 strict mode严格模式来提升代码质量，strict mode可以讲常见编码不规范转化为错误抛出，强制编码人员养成良好的编码习惯，避免产生错误，并可以提高编译器效率，增加程序运行速度。严格模式可参考https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode

JavaScript几点编码规范的说明