JavaScript小技巧

 内容摘自《 Google JavaScript 编码规范指南 》http://alloyteam.github.com/JX/doc/specification/google-javascript.xml#%E5%8F%98%E9%87%8F
 True 和 False 布尔表达式

下面的布尔表达式都返回 false:

• null
• undefined
• '' 空字符串
• 0 数字0

但小心下面的, 可都返回 true:

• '0' 字符串0
• [] 空数组
• {} 空对象

下面段比较糟糕的代码:
while (x != null) {
你可以直接写成下面的形式(只要你希望 x 不是 0 和空字符串, 和 false):
while (x) {
如果你想检查字符串是否为 null 或空:
if (y != null && y != '') {
但这样会更好:
if (y) {

注意: 还有很多需要注意的地方, 如:

• Boolean('0') == true
• '0' != true
• 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

 条件(三元)操作符 (?:)
三元操作符用于替代下面的代码:
if (val != 0) {
  return foo();
} else {
  return bar();
}
你可以写成:
return val ? foo() : bar();
在生成 HTML 代码时也是很有用的:
var html = '<input type="checkbox"' +
    (isChecked ? ' checked' : '') +
    (isEnabled ? '' : ' disabled') +
    ' name="foo">';


 && 和 ||
二元布尔操作符是可短路的, 只有在必要时才会计算到最后一项.
"||" 被称作为 'default' 操作符, 因为可以这样:
/** @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>';
}
你也可以是用数组作为字符串构造器, 然后通过  myArray.join('')  转换成字符串. 不过由于赋值操作快于数组的  push() , 所以尽量使用赋值操作.


 遍历 Node List
Node lists 是通过给节点迭代器加一个过滤器来实现的. 这表示获取他的属性, 如 length 的时间复杂度为 O(n), 通过 length 来遍历整个列表需要 O(n^2).
var paragraphs = document.getElementsByTagName('p');
for (var i = 0; i < paragraphs.length; i++) {
  doSomething(paragraphs[i]);
}
这样做会更好:
var paragraphs = document.getElementsByTagName('p');
for (var i = 0, paragraph; paragraph = paragraphs[i]; i++) {
  doSomething(paragraph);
}
这种方法对所有的 collections 和数组(只要数组不包含 falsy 值) 都适用.
在上面的例子中, 也可以通过 firstChild 和 nextSibling 来遍历孩子节点.
var parentNode = document.getElementById('foo');
for (var child = parentNode.firstChild; child; child = child.nextSibling) {
  doSomething(child);
}