昨天不小心看到了Google Javascript Style Guide，Google在里面约定了一些名字的书写规则，也给出一些更好的建议。 下面我翻译一段个人认为很有价值的东西：
布尔表达式
以下代码在布尔表达式里都等于false:
-
null
-
undefined
-
'' 空字符串
-
0 数字
但是请注意，以下这些等于true:
这就意味着本来这样的代码:
你可以这样来写(当你不希望x为0、空字符串、false时):
当你希望检查一个字符串是否为空的时候你可以这样:
if (y != null && y != '') {
但是这样会更简洁更高效:
注意: 有很多容易搞错的布尔表达式(以下表达式的值都为true):
-
Boolean('0') == true
'0' != true
/* Longbill注释：
* if ('0') alert('yes');
* if ('0' != true) alert('yes');
* if ('0' == false) alert('yes');
* 以上三个都会弹出yes!!
*/
-
0 != null
0 == []
0 == false
-
Boolean(null) == false
null != true
null != false
-
Boolean(undefined) == false
undefined != true
undefined != false
-
Boolean([]) == true
[] != true
[] == false
-
Boolean({}) == true
{} != true
{} != false
-
Longbill 补充下：
NaN != true
NaN != false
Boolean(NaN) == false
三目运算符
这样的代码:
if (val != 0) {
return foo();
} else {
return bar();
}
可以被简化成这样:
return val ? foo() : bar();
三目运算符在生成html字符串的时候也很有用:
var html = '<input type="checkbox"' +
(isChecked ? ' checked' : '') +
(isEnabled ? '' : ' disabled') +
' name="foo">';
&& 和 ||
由这两个逻辑运算符连接的表达式会从左到右依次执行，直到遇到满足条件为止。
所以"||" 又被称作 '缺省值' 操作符，因为如下代码:
/** @param {*=} opt_win */
function foo(opt_win) {
var win;
if (opt_win) {
win = opt_win;
} else {
win = window;
}
// ...
}
可以被简写成:
/** @param {*=} opt_win */
function foo(opt_win) {
var win = opt_win || window;
// ...
}
"&&" 同样很有用。比如，如下代码:
if (node) {
if (node.kids) {
if (node.kids[index]) {
foo(node.kids[index]);
}
}
}
可以被简写成:
if (node && node.kids && node.kids[index]) {
foo(node.kids[index]);
}
或者这样:
var kid = node && node.kids && node.kids[index];
if (kid) {
foo(kid);
}
甚至可以这样：
node && node.kids && node.kids[index] && foo(node.kids[index]);
使用 join() 来创建字符串
一般来说，累加字符串是很常见的:
function listHtml(items) {
var html = '<div class="foo">';
for (var i = 0; i < items.length; ++i) {
if (i > 0) {
html += ', ';
}
html += itemHtml(items[i]);
}
html += '</div>';
return html;
}
但是这种方式在万恶的IE浏览器下会很慢，通常以下代码会更快:
function listHtml(items) {
var html = [];
for (var i = 0; i < items.length; ++i) {
html[i] = itemHtml(items[i]);
}
return '<div class="foo">' + html.join(', ') + '</div>';
}
注意：指定数组的下标来赋值会比直接用数组的push()方法更高效。
遍历Node List
在遍历Node list 的时候，常常会用到length属性来当循环的边界条件。因为循环的时间复杂度是O(n)，而每循环一次，都要检查一下边界条件（length属性），这样时间复杂度变为O(n^2):
var paragraphs = document.getElementsByTagName('p');
for (var i = 0; i < paragraphs.length; i++) {
doSomething(paragraphs[i]);
}
这样做会更高效（时间复杂度应该是O(n) ）:
var paragraphs = document.getElementsByTagName('p');
for (var i = 0, paragraph; paragraph = paragraphs[i]; i++) {
doSomething(paragraph);
}
以上这个方法同样适用于对象和数组（当数组不含有会被当成是false的值的时候）。
/* 原文出自：Google，翻译: Longbill (http://php.js.cn) 2010-10-19 */
另外，当你遍历一个Node的所有子Node的时候，可以用firstNode和nextSibling属性，就像这样：
var parentNode = document.getElementById('foo');
for (var child = parentNode.firstChild; child; child = child.nextSibling) {
doSomething(child);
}
完。
8367 read
![]()
。。。。
