一文帶你快速學(xué)會(huì)JavaScript條件判斷及高級(jí)用法
條件判斷常用
一、if/else語(yǔ)句
語(yǔ)句用于基于不同的條件來(lái)執(zhí)行不同的動(dòng)作
代碼
if ('條件語(yǔ)句1') {
// 如果 條件語(yǔ)句1 為 true 執(zhí)行該代碼塊
} else if ('條件語(yǔ)句2') {
// 如果 條件語(yǔ)句1 為 false 且 條件語(yǔ)句2 為 true 執(zhí)行該代碼塊
} else {
// 如果 條件語(yǔ)句1 為 false 且 條件語(yǔ)句2 為 false 執(zhí)行該代碼塊
}
當(dāng) if 語(yǔ)句后面只執(zhí)行一句代碼的時(shí)候,可以省略花括號(hào)。換句話說(shuō),如果 if 語(yǔ)句沒(méi)有花括號(hào),則 if 語(yǔ)句只會(huì)考慮下一個(gè)語(yǔ)句
二、三元表達(dá)式
- 形式簡(jiǎn)寫 ====》條件?真結(jié)果:假結(jié)果
- 等同于其====》 if(條件){真結(jié)果}else{假結(jié)果}
- 三元表達(dá)式語(yǔ)句表達(dá)更簡(jiǎn)潔,但多條件會(huì)顯的冗余
var isShow = true; isShow ? console.log(isShow ):console.log(isShow ) // true
三元表達(dá)式在使用過(guò)程中不能使用break,continue等語(yǔ)句
三、或(||)與 (&&)語(yǔ)句
此用法高級(jí)而優(yōu)雅
1. ||(邏輯或)
- 短路表達(dá)式: 第一個(gè)為:true,則取第一個(gè)的值,如果第一個(gè)為false,則取第二個(gè)的值。
- 默認(rèn)轉(zhuǎn)譯: 0 , ”“ , nul , false , undefined , NaN 都會(huì)判為false
console.log (2||1); //2
console.log ('a'||1);//'a'
console.log (''||1); //1
2. &&(邏輯與)
短路表達(dá)式: 第一個(gè)為:true,則執(zhí)行&&后的語(yǔ)句,如果第一個(gè)為false,則執(zhí)行“&&”前面的值。
console.log (2 && 1); //1
console.log ('a' && 1);//1
console.log ('' && 1); // ''
四、switch/case語(yǔ)句
- 語(yǔ)句 只能有一個(gè)表達(dá)式(expression)
- 語(yǔ)句 case 后面只能是常量,不能是表達(dá)式,也就是說(shuō) switch 語(yǔ)句的判斷條件只能跟一個(gè)常量進(jìn)行比較。
- 用break的作用就是跳出switch
// add_step 與 case設(shè)定的常量值進(jìn)行比較賦值
var change_level = 0;
switch(change_step){
case 5 : change_level = 1;
break;
case 10 : change_level = 2;
break;
case 12 : change_level = 3;
break;
case 15 : change_level = 4;
break;
default : change_level = 0;
break;
}
優(yōu)雅升級(jí) A
此方法是利用對(duì)象屬性值的方式
var change_level={'5':1,'10':2,'12':3,'15':4}[change_step] || 0;
優(yōu)雅升級(jí) B
此方法也可以按著數(shù)值區(qū)間進(jìn)行判斷
var change_step = 15;
var change_level =
(change_step == 15 && 4) ||
(change_step == 12 && 3) ||
(change_step == 10 && 2) ||
(change_step == 5 && 1) ||
0;
console.log(change_level);
總結(jié)
執(zhí)行效率:
- switch case會(huì)生成一個(gè)跳轉(zhuǎn)表來(lái)指示實(shí)際的case分支的地址,應(yīng)用多分分支條件中
- switch case 缺點(diǎn)只能處理字符或者數(shù)字類型的變量【可用以上升級(jí)方案】
- 而if…else卻需要遍歷條件分支直到命中條件,(可用于少量判斷條件)
到此這篇關(guān)于JavaScript條件判斷及高級(jí)用法的文章就介紹到這了,更多相關(guān)js條件判斷及高級(jí)用法內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
three.js響應(yīng)式設(shè)計(jì)實(shí)例詳解
響應(yīng)式網(wǎng)站設(shè)計(jì)(Responsive?Web?design)是一種網(wǎng)絡(luò)頁(yè)面設(shè)計(jì)布局,是目前比較流行的一種網(wǎng)頁(yè)設(shè)計(jì),下面這篇文章主要給大家介紹了關(guān)于three.js響應(yīng)式設(shè)計(jì)的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-04-04
JavaScript代碼判斷點(diǎn)擊第幾個(gè)按鈕
javascript點(diǎn)擊按鈕需求,在項(xiàng)目開發(fā)過(guò)程中經(jīng)常遇到,本文通過(guò)一段代碼給大家分享javascript代碼判斷點(diǎn)擊第幾個(gè)按鈕,對(duì)本文感興趣的朋友一起學(xué)習(xí)吧2015-12-12
錯(cuò)誤剖析之JavaScript的9個(gè)陷阱及評(píng)點(diǎn)
錯(cuò)誤剖析之JavaScript的9個(gè)陷阱及評(píng)點(diǎn)...2007-08-08
JavaScript工具庫(kù)jscpd檢測(cè)前端代碼重復(fù)度

