Javascript常用小技巧汇总
本文实例讲述了Javascript常用小技巧。分享给大家供大家参考。具体分析如下：
一、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){
returnfoo();
}else{
returnbar();
}
你可以写成:
returnval?foo():bar();
在生成HTML代码时也是很有用的:
varhtml='';
三、&&和||
二元布尔操作符是可短路的,只有在必要时才会计算到最后一项.
"||"被称作为'default'操作符,因为可以这样:
functionfoo(opt_win){
varwin;
if(opt_win){
win=opt_win;
}else{
win=window;
}
//...
}
你可以使用它来简化上面的代码:
functionfoo(opt_win){
varwin=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]);
}
或者:
varkid=node&&node.kids&&node.kids[index];
if(kid){
foo(kid);
}
不过这样就有点儿过头了:
node&&node.kids&&node.kids[index]&&foo(node.kids[index]);
四、使用join()来创建字符串
通常是这样使用的:
functionlistHtml(items){
varhtml='';
for(vari=0;i<items.length;++i){
if(i>0){html+=',';
}
html+=itemHtml(items[i]);
}
html+='';
returnhtml;
}
但这样在IE下非常慢,可以用下面的方式:
functionlistHtml(items){
varhtml=[];
for(vari=0;i<items.length;++i){
html[i]=itemHtml(items[i]);
}
return''+html.join(',')+'';
}
你也可以是用数组作为字符串构造器,然后通过myArray.join('')转换成字符串.不过由于赋值操作快于数组的push(),所以尽量使用赋值操作.
五、遍历NodeList
Nodelists是通过给节点迭代器加一个过滤器来实现的.这表示获取他的属性,如length的时间复杂度为O(n),通过length来遍历整个列表需要O(n^2).
varparagraphs=document.getElementsByTagName_r('p');
for(vari=0;i<paragraphs.length;i++){
doSomething(paragraphs[i]);
}
这样做会更好:
varparagraphs=document.getElementsByTagName_r('p');
for(vari=0,paragraph;paragraph=paragraphs[i];i++){
doSomething(paragraph);
}
这种方法对所有的collections和数组(只要数组不包含falsy值)都适用.
在上面的例子中,也可以通过firstChild和nextSibling来遍历孩子节点.
varparentNode=document.getElementByIdx_x('foo');
for(varchild=parentNode.firstChild;child;child=child.nextSibling){
doSomething(child);
}
希望本文所述对大家的javascript程序设计有所帮助。