Javascript常用小技巧匯總
本文實(shí)例講述了Javascript常用小技巧。分享給大家供大家參考。具體分析如下:
一、True 和 False 布爾表達(dá)式
下面的布爾表達(dá)式都返回 false:
null
undefined
'' 空字符串
0 數(shù)字0
但小心下面的, 可都返回 true:
'0' 字符串0
[] 空數(shù)組
{} 空對(duì)象
下面段比較糟糕的代碼:
你可以直接寫成下面的形式(只要你希望 x 不是 0 和空字符串, 和 false):
如果你想檢查字符串是否為 null 或空:
但這樣會(huì)更好:
注意: 還有很多需要注意的地方, 如:
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();
}
你可以寫成:
在生成 HTML 代碼時(shí)也是很有用的:
三、&& 和 ||
二元布爾操作符是可短路的, 只有在必要時(shí)才會(huì)計(jì)算到最后一項(xiàng).
"||" 被稱作為 'default' 操作符, 因?yàn)榭梢赃@樣:
function foo(opt_win) {
var win;
if (opt_win) {
win = opt_win;
} else {
win = window;
}
// ...
}
你可以使用它來(lái)簡(jiǎn)化上面的代碼:
function foo(opt_win) {
var win = opt_win || window;
// ...
}
"&&" 也可簡(jiǎn)短代碼.比如:
if (node) {
if (node.kids) {
if (node.kids[index]) {
foo(node.kids[index]);
}
}
}
你可以像這樣來(lái)使用:
if (node && node.kids && node.kids[index]) {
foo(node.kids[index]);
}
或者:
var kid = node && node.kids && node.kids[index];
if (kid) {
foo(kid);
}
不過(guò)這樣就有點(diǎn)兒過(guò)頭了:
四、使用 join() 來(lái)創(chuàng)建字符串
通常是這樣使用的:
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(', ') + '';
}
你也可以是用數(shù)組作為字符串構(gòu)造器, 然后通過(guò) myArray.join('') 轉(zhuǎn)換成字符串.不過(guò)由于賦值操作快于數(shù)組的 push(), 所以盡量使用賦值操作.
五、遍歷 Node List
Node lists 是通過(guò)給節(jié)點(diǎn)迭代器加一個(gè)過(guò)濾器來(lái)實(shí)現(xiàn)的. 這表示獲取他的屬性, 如 length 的時(shí)間復(fù)雜度為 O(n),通過(guò) length 來(lái)遍歷整個(gè)列表需要 O(n^2).
var paragraphs = document.getElementsByTagName_r('p');
for (var i = 0; i < paragraphs.length; i++) {
doSomething(paragraphs[i]);
}
這樣做會(huì)更好:
var paragraphs = document.getElementsByTagName_r('p');
for (var i = 0, paragraph; paragraph = paragraphs[i]; i++) {
doSomething(paragraph);
}
這種方法對(duì)所有的 collections 和數(shù)組(只要數(shù)組不包含 falsy 值) 都適用.
在上面的例子中, 也可以通過(guò) firstChild 和 nextSibling 來(lái)遍歷孩子節(jié)點(diǎn).
var parentNode = document.getElementByIdx_x('foo');
for (var child = parentNode.firstChild; child; child = child.nextSibling) {
doSomething(child);
}
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
相關(guān)文章
用Javascript輕松制作一套簡(jiǎn)單的抽獎(jiǎng)系統(tǒng)
js登錄滑動(dòng)驗(yàn)證的實(shí)現(xiàn)(不滑動(dòng)無(wú)法登陸)
JavaScript 動(dòng)態(tài)三角函數(shù)實(shí)例詳解
讓iframe框架網(wǎng)頁(yè)在任何瀏覽器下自動(dòng)伸縮
構(gòu)建一個(gè)JavaScript插件系統(tǒng)

