1.巧用判斷:
在js中,NaN,undefined,Null,0,"" 在轉(zhuǎn)換為bool的時(shí)候,是false,所以,可以這樣寫。
表示一個(gè)對(duì)象如果為false的時(shí)候所做的事情,因?yàn)槿绻鹢bj為以上任何一個(gè),那么就是false,!false即是true,這樣,就不需要 if(obj==null || obj == NaN ....)。
2.巧用運(yùn)算符:
有一個(gè)很經(jīng)典的技巧,得到時(shí)間戳。
我們知道,js是弱類型語(yǔ)言,Date()會(huì)返回一個(gè)表示時(shí)間的字符串,用這個(gè)字符串進(jìn)行算術(shù)運(yùn)算,將得到轉(zhuǎn)換,也就是結(jié)果的時(shí)間戳。
3.巧用正則表達(dá)式:
4.取數(shù)組最大值和最小值:
調(diào)用Max.apply,設(shè)置對(duì)象的為Math,然后傳遞一個(gè)Values,就能確定最大值。
5.內(nèi)存優(yōu)化:
6.最受歡迎的創(chuàng)建對(duì)象方式(原型模式):
原型構(gòu)造模式的最大缺點(diǎn)在于引用類型的共享,所以,將引用類型定義在構(gòu)造函數(shù)中,而將通用方法定義在原型中,使用this引用。
7.塊級(jí)作用域和私有變量
在javascript中,沒有塊級(jí)作用域和私有變量這一說(shuō),但是,利用一些特性,則能模仿這些效果。
7.1塊級(jí)作用域:
匿名函數(shù)外面加上一個(gè)括號(hào),我管它叫"函數(shù)標(biāo)準(zhǔn)化",也就是說(shuō),可以像標(biāo)準(zhǔn)函數(shù)那樣調(diào)用,如:
這么做的好處就是,在()外部無(wú)法訪問(wèn)到函數(shù)中變量,也就成了塊級(jí)作用域,這種方式一般用在編寫插件的時(shí)候,不會(huì)再全局 (global)中添加額外的變量,而且,在函數(shù)執(zhí)行完畢之后,其內(nèi)部定義的變量就被銷毀了,所以,也不會(huì)有閉包特性存在的問(wèn)題。
7.2私有變量:
私有變量實(shí)際上就是利用函數(shù)的作用域作為限制(外部無(wú)法訪問(wèn)),然后定義一個(gè)方法,這個(gè)方法返回相應(yīng)的變量,僅此而已。
8.DOM之NodeList:
nodeList是一個(gè)動(dòng)態(tài)的元素,這意味著,在文檔中添加任何元素,nodeList都會(huì)實(shí)時(shí)更新,如:
這段代碼會(huì)造成無(wú)限循環(huán),在循環(huán)里面創(chuàng)建了一個(gè)div,然后appendChild方法將其添加到body中,那么,所有alldiv會(huì)立即就更新,所以,i<alldiv.length永遠(yuǎn)無(wú)法成立,要解決這個(gè)問(wèn)題,可以使用下面方式:
這里建議:最好不要頻繁的對(duì)NodeList操作,因?yàn)槊看尾僮鞫紩?huì)執(zhí)行一次DOM樹的查詢。
除了以上介紹的方法外,HTML5 新加入的API(selector API Level1)也能解決這個(gè)問(wèn)題,它類似C#的linq及時(shí)查詢,至于什么是linq及時(shí)查詢,以后我會(huì)更新blog,敬請(qǐng)關(guān)注:
querySelectorAll需要一個(gè)參數(shù),一個(gè)CSS選擇器,類似jquery中的$(),它返回的NodeList是一個(gè)及時(shí)的,非動(dòng)態(tài)的DOM集合。
另外還有一個(gè)querySelector,返回匹配的第一個(gè)元素,有關(guān)HTML5 API 詳 見
http://www.w3.org/standards/techs/dom#w3c_all
或者
https://developer.mozilla.org/zh-CN/docs/Web/API
另外,本人也在醞釀一篇blog,專門講HTML5 API的,敬請(qǐng)關(guān)注。
9.DOM性能:
不要做這種傻事(我做過(guò)。。。)
給對(duì)象的innerHTML賦值,會(huì)調(diào)用內(nèi)置的C++解析器解析這個(gè)字符串,雖然速度很快,但是最好不要這樣操作,會(huì)有一定的性能流失。
最好這樣做:
for(var i=0;i<10;i++)
{
ih+="<li>"+i+"</li>";
}
document.querySelector('ul').innerHTML=ih;
另外的一些性能優(yōu)化話題,等有時(shí)間再更新。
以上所述就是本文的全部?jī)?nèi)容了,希望大家能夠喜歡。
新聞熱點(diǎn)
疑難解答
圖片精選