javascript中if和switch,==和===詳解
今天改插件BoxScroll的時(shí)候,因?yàn)閕f里面的條件判斷多于兩個(gè),于是立馬想著改寫switch。改到一半,忽然記起來JSHint等代碼質(zhì)量檢測工具中的一個(gè)要求,用===替換==,不用不可靠的強(qiáng)制轉(zhuǎn)型。然后忽然猜想,改成switch是不是會降低效率?。縮witch里面的實(shí)際判斷是==還是===?
有了想法,趕緊舉個(gè)栗子,好一口吃掉:
var a = '5';
switch (a) {
case 5:
console.log('==');
break;
case "5":
console.log('===');
break;
default:
}
最后控制臺顯示的是===,看來可以放心的用。找了下以前的學(xué)習(xí)筆記,嗯,高三里面確實(shí)也說switch判斷是全等運(yùn)算符,因此不會發(fā)生類型轉(zhuǎn)換。這里小結(jié)一下
1.if和switch
if 是用得最多的,沒什么太多好說。值得注意的一點(diǎn)是:if 其實(shí)和 || 很像,如果if (conditionA){} else {} 中的conditionA為true,然后它執(zhí)行完else之前的代碼塊后就看都不會看else里面的代碼。和 || 前面為true的時(shí)候后面會被忽略一樣,即便里面有再多的錯(cuò)誤。基于這個(gè)性質(zhì),當(dāng)然把可能用得最多的代碼塊放在前面,減少判斷次數(shù)。另一方面,如果有很多的 if 判斷,而且可能執(zhí)行的次數(shù)分布比較均勻,那么后面的判斷語句每次都要把前面的判斷一個(gè)一個(gè)執(zhí)行完,不利于優(yōu)化。比較好的做法是將一層判斷語句變成兩層判斷語句,如
if (a > 0 && a <= 1) {
//do something
} else if (a > 1 && a <= 2) {
} else if (a > 2 && a <= 3) {
} else if (a > 3 && a <= 4) {
} else if (a > 4 && a <= 5) {
} else if (a > 5 && a <= 6) {
}...
變?yōu)?/p>
if (a > 0 && a <= 4) {
if (a <= 1) {
//do something
} else if (a > 1 && a <= 2) {
} else if (a > 2 && a <= 3) {
} else if (a > 3 && a <= 4) {
}
} else if (a > 4 && a <= 8) {
//
}..
雖然前面的每個(gè)判斷都多加了一次,但是后面的判斷就都減少了(4-1)*n次,還是滿賺的。忽然覺得這種方式和嵌套循環(huán)有點(diǎn)像,循環(huán)次數(shù)少的放在外面有助于性能優(yōu)化,如何分成兩層甚至多層就要看具體情況了。
switch是 if 最親密的戰(zhàn)友,每次 if 忙不過來的時(shí)候就過來搭把手。switch和 if 互轉(zhuǎn)估計(jì)沒什么好說的,而且switch和if一樣,都是順序從上往下執(zhí)行判斷的,有所不同的是 if 中的else在switch里面可不管用,它有自己的小弟:break。如果沒有遇到break,switch會繼續(xù)往下執(zhí)行,如
var a = 2;
switch (a) {
case 1:
console.log("1");
//break miss
case 2:
console.log("2");
case 3:
console.log("3");
default:
console.log('no break');
}
最后控制臺顯示 2,3,no break 。其實(shí)也蠻好理解,break是提示程序跳出內(nèi)部執(zhí)行體到下一個(gè)case 判斷,如果沒有了,相當(dāng)于 if(condition){A}{B},沒有了else,A和B當(dāng)然都要執(zhí)行啦。還有兩個(gè)小tip,一是switch和case中可以寫任何表達(dá)式,如
switch (A + B) {
case a * b:
console.log("1");
break;
case a / b + c:
break;
//...
default:
console.log('no break');
}
實(shí)際上的比較是 (A+B)===(a*b)和(A+B)===(a/b+c)。二是switch有一種特殊的用法,如
switch (true) {
case condition1:
//do something
break;
case condition2:
break;
//...
default:
//..
;
}
此時(shí)switch中的每一個(gè)case都會按照順序判斷執(zhí)行。至于switch(false)?并沒有什么卵用。
2.==與===
一句話搞定,除了在比較之前不轉(zhuǎn)換操作數(shù)之外,全等和不全等操作符與相等和不相等操作符并沒有什么不同。
最經(jīng)典的案例
var a = "5", b = 5; a == b //true a === b //false var a = "ABC", b = "AB" + "C"; a === b //true
下面的顯示true的原因其實(shí)和string類型不可變是分不開的。表面看上去b只是簡單的拼接一個(gè)字符串,但實(shí)際上它已經(jīng)和原來的b沒有關(guān)系。每一個(gè)字符串都存在內(nèi)存池中特定的地方,當(dāng)b="AB"+"C"執(zhí)行完的時(shí)候,字符串AB和C就已經(jīng)被銷毀,而b指向內(nèi)存池中ABC的位置。由于在指向前在內(nèi)存池中發(fā)現(xiàn)了字符串ABC(因?yàn)閍引用著它,所以存在),所以b就和a指向同一塊區(qū)域,全等判斷相等。如果在b之前沒有任何變量指向字符串ABC,那么內(nèi)存池中沒有,就會在里面劃一塊地方給ABC,并將b指向ABC。
附以前的總結(jié)圖兩張:


以上所述就是本文的全部內(nèi)容了,希望大家能夠喜歡。
相關(guān)文章
js點(diǎn)擊button按鈕跳轉(zhuǎn)到另一個(gè)新頁面
點(diǎn)擊按鈕怎么跳轉(zhuǎn)到另外一個(gè)頁面呢?點(diǎn)擊圖片要跳轉(zhuǎn)到新的頁面時(shí),怎么做到呢?可以使用onclick=window.location=新頁面來實(shí)現(xiàn)2014-10-10
微信小程序?qū)崿F(xiàn)導(dǎo)航功能的操作步驟
這篇文章主要給大家介紹了關(guān)于微信小程序?qū)崿F(xiàn)導(dǎo)航功能的操作步驟,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-03-03
JavaScript實(shí)現(xiàn)QQ聊天消息展示和評論提交功能
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)QQ聊天消息展示和評論提交功能,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-05-05
JS運(yùn)動(dòng)特效之鏈?zhǔn)竭\(yùn)動(dòng)分析
這篇文章主要介紹了JS運(yùn)動(dòng)特效之鏈?zhǔn)竭\(yùn)動(dòng),結(jié)合實(shí)例形式分析了javascript鏈?zhǔn)竭\(yùn)動(dòng)的原理與具體實(shí)現(xiàn)技巧,需要的朋友可以參考下2018-01-01
JavaScript進(jìn)階(二)詞法作用域與作用域鏈實(shí)例分析
這篇文章主要介紹了JavaScript詞法作用域與作用域鏈,結(jié)合實(shí)例形式分析了JavaScript詞法作用域與作用域鏈相關(guān)概念、原理與操作注意事項(xiàng),需要的朋友可以參考下2020-05-05
微信小程序 輪播圖實(shí)現(xiàn)原理及優(yōu)化詳解
這篇文章主要介紹了微信小程序 輪播圖實(shí)現(xiàn)原理及優(yōu)化詳解,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2019-09-09
js 調(diào)用本地exe的例子(支持IE內(nèi)核的瀏覽器)
js 調(diào)用本地exe程序.我實(shí)驗(yàn)了一下 : 使用IE內(nèi)核的瀏覽器 都支持 火狐好像不行,感興趣的碰可以研究下2012-12-12

