本文實例講述了Javascript常用小技巧。分享給大家供大家參考。具體分析如下：
一、True 和 False 布爾表達式
下面的布爾表達式都返回 false:
null
undefined
'' 空字符串
0 數字0
但小心下面的, 可都返回 true:
'0' 字符串0
[] 空數組
{} 空對象
下面段比較糟糕的代碼:
你可以直接寫成下面的形式(只要你希望 x 不是 0 和空字符串, 和 false):
如果你想檢查字符串是否為 null 或空:
但這樣會更好:
注意: 還有很多需要注意的地方, 如:
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();}你可以寫成:
三、&& 和 ||
二元布爾操作符是可短路的, 只有在必要時才會計算到最后一項.
"||" 被稱作為 'default' 操作符, 因為可以這樣:
function foo(opt_win) { var win; if (opt_win) { win = opt_win; } else { win = window; } // ...}你可以使用它來簡化上面的代碼:
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);}不過這樣就有點兒過頭了:
通常是這樣使用的:
function listHtml(items) { var html = ''; for (var i = 0; i < items.length; ++i) { if(i > 0) { html += ', '; } html += itemHtml(items[i]); } html +=''; return html;}但這樣在 IE 下非常慢, 可以用下面的方式:
function listHtml(items) { var html = []; for (var i = 0; i < items.length; ++i) { html[i] = itemHtml(items[i]); } return '' + html.join(', ') + '';}你也可以是用數組作為字符串構造器, 然后通過 myArray.join('') 轉換成字符串.不過由于賦值操作快于數組的 push(), 所以盡量使用賦值操作.
五、遍歷 Node List
Node lists 是通過給節點迭代器加一個過濾器來實現的. 這表示獲取他的屬性, 如 length 的時間復雜度為 O(n),通過 length 來遍歷整個列表需要 O(n^2).
var paragraphs = document.getElementsByTagName_r('p');for (var i = 0; i < paragraphs.length; i++) { doSomething(paragraphs[i]);}這樣做會更好:
var paragraphs = document.getElementsByTagName_r('p');for (var i = 0, paragraph; paragraph = paragraphs[i]; i++) { doSomething(paragraph);}這種方法對所有的 collections 和數組(只要數組不包含 falsy 值) 都適用.
在上面的例子中, 也可以通過 firstChild 和 nextSibling 來遍歷孩子節點.
var parentNode = document.getElementByIdx_x('foo');for (var child = parentNode.firstChild; child; child = child.nextSibling) { doSomething(child);}希望本文所述對大家的javascript程序設計有所幫助。
新聞熱點
疑難解答
