提高javascript效率 一次判斷,而不要次次判斷
更新時(shí)間:2012年03月30日 23:58:39 作者:
提高javascript效率 一次判斷,而不要次次判斷,學(xué)習(xí)js的朋友可以參考下
判斷嘛,就是面臨2個(gè)或以上的選項(xiàng)時(shí)進(jìn)行選擇。比如我家門前去公司有一個(gè)岔路,只要我第一次知道了哪一條路是對(duì)的,那我下一次或以后的每次都不用再思考了,直接走那條路即可——當(dāng)然,突發(fā)天災(zāi)時(shí)不算。
做出判斷是需要時(shí)間的,是需要對(duì)應(yīng)條件的。正確的判斷很好,但每次面臨岔路,哪怕是走了無數(shù)次的岔路,都來進(jìn)行一下判斷,無疑是一種腦殘行為。
下面來看一個(gè)我們平時(shí)經(jīng)??吹降腏S函數(shù),他的作用是判斷瀏覽器類型然后設(shè)置對(duì)應(yīng)的透明度屬性:
function setAlpha(obj,alpha){
if (-[1,]) obj.style.opacity = alpha / 100;
else obj.style.filter = "alpha(opacity=" + alpha + ")";
}
這個(gè)函數(shù)有錯(cuò)嗎?沒有。先判斷瀏覽器是否是標(biāo)準(zhǔn)瀏覽器,如果是,就直接通過opacity設(shè)置透明;如果不是,則使用IE濾鏡來實(shí)現(xiàn)透明度。
邏輯清晰,代碼簡(jiǎn)練,精品??!
不過,沒有錯(cuò)誤,卻有失誤。
通常,這種設(shè)置透明度的函數(shù)都會(huì)用來制作淡入淡出效果,也就是說它會(huì)被setTimeout一次次的調(diào)用,直到循環(huán)結(jié)束。
這時(shí)候問題就來了。回到前面的岔路問題,這個(gè)函數(shù)就相當(dāng)于,每次來到路口,都要思考判斷。第1次,來到路口,騷等,我看看,噢,是firefox啊,走第1條路;第2次,又來到這路口,等等,我看看,噢,又是firefox啊,還走第1條路……第3次……第4次。。。。不管多少次,這個(gè)函數(shù)都會(huì)像最敬業(yè)的交警一樣來查看你的身份————你,不煩嗎?你不煩我都煩了!
這時(shí)候,如果你是過路的,你肯定希望這個(gè)交警消失。
其實(shí),遇到岔路我們可以這樣:既然已經(jīng)知道只走一條路,那我干脆把另外的路給堵死算了!當(dāng)然在現(xiàn)實(shí)生活中不可能這樣做,不過在代碼里卻不難實(shí)現(xiàn),換個(gè)思路即可。
javascript有個(gè)神奇的地方,就是匿名函數(shù)(通常用來自執(zhí)行),自執(zhí)行函數(shù)的意思是呢,他聲明的時(shí)候就執(zhí)行掉了,以后就不會(huì)再出現(xiàn)了,你想找都不定能找到!個(gè)人覺得,這個(gè)性不錯(cuò)。
看下面的代碼,同樣是設(shè)置透明度的函數(shù):
var setAlpha = (function(obj,alpha){
var set;
if (-[1,]) {
set = function (obj,alpha) {
obj.style.opacity = alpha * 0.01;
}
}
else {
set = function(obj,alpha){
obj.style.filter = "alpha(opacity=" + alpha + ")";
}
}
return set;
})()
也許你要不滿了:這是什么玩意兒啊,好像初學(xué)者的水平(被你看穿了。。。)但是!這個(gè)卻比前面的版本效率高很多。不信你可以在firefox和ie6下分別alert一下這個(gè)函數(shù),就明白了。
通過自執(zhí)行函數(shù),當(dāng)聲明setAlpha的時(shí)候就執(zhí)行了函數(shù),而這個(gè)函數(shù)的作用就是,判斷瀏覽器,并確定該使用哪種設(shè)置透明度的方法。由于瀏覽器的類型在打開頁面后就不可能再變化,也就是以后都不用再判斷了。就算你調(diào)用10萬次這個(gè)函數(shù),他也不會(huì)再判斷,而是直接執(zhí)行。
雖然代碼丑,但境界就不同了…
這個(gè)例子只是一個(gè)小小示范,我只是希望你能明白【一次判斷,而不要次次判斷】的道理,并發(fā)揚(yáng)光大。減少判斷次數(shù),對(duì)js的效率是一個(gè)很大的提高。
轉(zhuǎn)自:jo2.org
做出判斷是需要時(shí)間的,是需要對(duì)應(yīng)條件的。正確的判斷很好,但每次面臨岔路,哪怕是走了無數(shù)次的岔路,都來進(jìn)行一下判斷,無疑是一種腦殘行為。
下面來看一個(gè)我們平時(shí)經(jīng)??吹降腏S函數(shù),他的作用是判斷瀏覽器類型然后設(shè)置對(duì)應(yīng)的透明度屬性:
復(fù)制代碼 代碼如下:
function setAlpha(obj,alpha){
if (-[1,]) obj.style.opacity = alpha / 100;
else obj.style.filter = "alpha(opacity=" + alpha + ")";
}
這個(gè)函數(shù)有錯(cuò)嗎?沒有。先判斷瀏覽器是否是標(biāo)準(zhǔn)瀏覽器,如果是,就直接通過opacity設(shè)置透明;如果不是,則使用IE濾鏡來實(shí)現(xiàn)透明度。
邏輯清晰,代碼簡(jiǎn)練,精品??!
不過,沒有錯(cuò)誤,卻有失誤。
通常,這種設(shè)置透明度的函數(shù)都會(huì)用來制作淡入淡出效果,也就是說它會(huì)被setTimeout一次次的調(diào)用,直到循環(huán)結(jié)束。
這時(shí)候問題就來了。回到前面的岔路問題,這個(gè)函數(shù)就相當(dāng)于,每次來到路口,都要思考判斷。第1次,來到路口,騷等,我看看,噢,是firefox啊,走第1條路;第2次,又來到這路口,等等,我看看,噢,又是firefox啊,還走第1條路……第3次……第4次。。。。不管多少次,這個(gè)函數(shù)都會(huì)像最敬業(yè)的交警一樣來查看你的身份————你,不煩嗎?你不煩我都煩了!
這時(shí)候,如果你是過路的,你肯定希望這個(gè)交警消失。
其實(shí),遇到岔路我們可以這樣:既然已經(jīng)知道只走一條路,那我干脆把另外的路給堵死算了!當(dāng)然在現(xiàn)實(shí)生活中不可能這樣做,不過在代碼里卻不難實(shí)現(xiàn),換個(gè)思路即可。
javascript有個(gè)神奇的地方,就是匿名函數(shù)(通常用來自執(zhí)行),自執(zhí)行函數(shù)的意思是呢,他聲明的時(shí)候就執(zhí)行掉了,以后就不會(huì)再出現(xiàn)了,你想找都不定能找到!個(gè)人覺得,這個(gè)性不錯(cuò)。
看下面的代碼,同樣是設(shè)置透明度的函數(shù):
復(fù)制代碼 代碼如下:
var setAlpha = (function(obj,alpha){
var set;
if (-[1,]) {
set = function (obj,alpha) {
obj.style.opacity = alpha * 0.01;
}
}
else {
set = function(obj,alpha){
obj.style.filter = "alpha(opacity=" + alpha + ")";
}
}
return set;
})()
也許你要不滿了:這是什么玩意兒啊,好像初學(xué)者的水平(被你看穿了。。。)但是!這個(gè)卻比前面的版本效率高很多。不信你可以在firefox和ie6下分別alert一下這個(gè)函數(shù),就明白了。
通過自執(zhí)行函數(shù),當(dāng)聲明setAlpha的時(shí)候就執(zhí)行了函數(shù),而這個(gè)函數(shù)的作用就是,判斷瀏覽器,并確定該使用哪種設(shè)置透明度的方法。由于瀏覽器的類型在打開頁面后就不可能再變化,也就是以后都不用再判斷了。就算你調(diào)用10萬次這個(gè)函數(shù),他也不會(huì)再判斷,而是直接執(zhí)行。
雖然代碼丑,但境界就不同了…
這個(gè)例子只是一個(gè)小小示范,我只是希望你能明白【一次判斷,而不要次次判斷】的道理,并發(fā)揚(yáng)光大。減少判斷次數(shù),對(duì)js的效率是一個(gè)很大的提高。
轉(zhuǎn)自:jo2.org
您可能感興趣的文章:
- javascript之更有效率的字符串替換
- JavaScript效率調(diào)優(yōu)經(jīng)驗(yàn)
- javascript 包裹節(jié)點(diǎn) 提高效率
- javascript字符串拼接的效率問題
- JavaScript執(zhí)行效率與性能提升方案
- 高效率JavaScript編寫技巧整理
- Javascript執(zhí)行效率全面總結(jié)
- 優(yōu)化javascript的執(zhí)行效率一些方法總結(jié)
- 有效提高JavaScript執(zhí)行效率的幾點(diǎn)知識(shí)
- java使用ArrayList遍歷及效率比較實(shí)例分析
- 讓Java代碼更高效
相關(guān)文章
原生js實(shí)現(xiàn)類似fullpage的單頁/全屏滾動(dòng)
這篇文章主要介紹了利用原生js實(shí)現(xiàn)類似fullpage的全屏滾動(dòng)的實(shí)現(xiàn)方法,文中給出了完整的實(shí)例代碼,相信對(duì)大家的理解和學(xué)習(xí)具有一定的參考價(jià)值,需要的朋友們可以參考借鑒,下面來一起看看吧。2017-01-01JS設(shè)計(jì)模式之責(zé)任鏈模式應(yīng)用詳解
JS責(zé)任鏈模式是一種行為型設(shè)計(jì)模式,它允許多個(gè)對(duì)象按照順序處理請(qǐng)求,直到其中一個(gè)對(duì)象能夠處理請(qǐng)求為止,這樣的對(duì)象鏈被稱為責(zé)任鏈,本文將給大家詳細(xì)講講責(zé)任鏈模式在JS中的應(yīng)用,需要的朋友可以參考下2023-08-08JavaScript實(shí)現(xiàn)字符串轉(zhuǎn)數(shù)組的6種方法總結(jié)
數(shù)組是?JavaScript?中最強(qiáng)大的數(shù)據(jù)結(jié)構(gòu),我們常常通過將字符串轉(zhuǎn)換為數(shù)組來解決許多算法。本文為大家總結(jié)了6個(gè)JS字符串轉(zhuǎn)數(shù)組的方法,希望對(duì)你有所幫助2022-09-09微信小程序網(wǎng)絡(luò)請(qǐng)求的封裝與填坑之路
本文主要介紹了關(guān)于小程序網(wǎng)絡(luò)請(qǐng)求的封裝的相關(guān)資料。具有很好的參考價(jià)值。下面跟著小編一起來看下吧2017-04-04JS如何去掉小數(shù)末尾多余的0,并且最多保留兩位小數(shù)
這篇文章主要介紹了JS如何去掉小數(shù)末尾多余的0,并且最多保留兩位小數(shù)問題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-04-04你可能不知道的JavaScript的new Function()方法
JavaScript的精神領(lǐng)袖Douglas Crockford曾說過JavaScript是程序員唯一不需要學(xué)習(xí)就能直接使用的語言. 在編程中確實(shí)是如此2014-04-04詳解微信小程序工程化探索之webpack實(shí)戰(zhàn)
這篇文章主要介紹了詳解微信小程序工程化探索之webpack實(shí)戰(zhàn),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-04-04