條件(三元)運算子 - HackMD
文章推薦指數: 80 %
延伸:JavaScript 中強制轉型是false. JavaScript 有8 個Falsy 值。
Complete list of JavaScript falsy values. 參考資料.
Published
LinkedwithGitHub
Like
Bookmark
Subscribe
#條件(三元)運算子
在一個條件後面會跟著一個問號`?`,如果條件是truthy,在冒號`:`前的表達式會被執行,如果條件是falsy,在冒號後面的表達式會被執行。
這個運算子常常被用來當作if的簡潔寫法。
##程式範例
###基本使用
######情境:未成年(18歲以下)不能喝酒,只能喝可樂
```javascript=
letage=20;
letbeverage=(age>=18)?"酒精飲料":"可樂";
console.log(beverage);//酒精飲料
```
###判斷條件為false
除了false,可能是falsy的表達式有`null,NaN,0,"",undefined`
如果條件為上述其中之一,那麼條件表達式的結果會是exprIfFalse的執行結果。
強制轉型的部分請參考下方延伸筆記。
######情境:若為true打招呼,若為false則為無人接聽。
```javascript=
letsayHi;
functiongreeting(person){
sayHi=person?`Hello${person}`:"現在無人接聽";
console.log(sayHi)
}
greeting("小明");//Hello小明
greeting(87);//Hello87
greeting(0);//現在無人接聽
greeting("");//現在無人接聽
greeting(NaN);//現在無人接聽
greeting(null);//現在無人接聽
greeting(undefined);//現在無人接聽
```
###條件鍊
條件(三元)運算子是右相依性的(right-associative),代表它能以下面的方式鏈結,類似於`if…elseif …elseif…else`的鏈結方法
```javascript=
letbmi=30,
dec="";
functioncheckBmi(){
dec=bmi<18.5?`BMI值為${bmi},過輕`:18.5<=bmi<24?`BMI值為${bmi},正常`:`BMI值為${bmi},過重`;
console.log(dec);
}
checkBmi();//BMI值為30,過重
//if...elseif...判斷式寫法
functioncheckBmi(){
if(bmi<18.5){
dec=`BMI值為${bmi},過輕`;
console.log(dec);
}elseif(18.5<=bmi&&bmi<24){
dec=`BMI值為${bmi},正常`;
console.log(dec);
}else{
dec=`BMI值為${bmi},過重`;
console.log(dec);
}
}
```
##延伸:JavaScript中強制轉型是false
JavaScript有8個Falsy值。
![CompletelistofJavaScriptfalsyvalues](https://i.imgur.com/ZE6bds3.png)
##參考資料
[條件運算子-JavaScript|MDN](https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)
[強制轉型-ToBoolean、Falsy、Truthy](https://zh-tw.coderbridge.com/series/9e5162da940f473a9f1cfeece124ee98/posts/832910dd11934030a69afb9b68219386)
[Falsy-JavaScript|MDN](https://developer.mozilla.org/en-US/docs/Glossary/Falsy)
×
Signin
Email
Password
Forgotpassword
or
Byclickingbelow,youagreetoourtermsofservice.
SigninviaFacebook
SigninviaTwitter
SigninviaGitHub
SigninviaDropbox
SigninviaGoogle
NewtoHackMD?Signup
延伸文章資訊
- 1現代[JavaScript] 程式設計教學:使用運算子(Operator)
本文介紹JavaScript 中可用的運算子。 ... 代數運算子使用方式如同數學上的代數,像 2 + 3 * 5 會先運算 3 * 5 再加 2 ,如果 ... 以下是JavaScript 的...
- 2JavaScript 三元條件運算子| D棧
條件運算子,也稱為三元運算子,是 if ... else 語句的單行簡寫。它有助於編寫乾淨簡潔的程式碼。它是唯一一個需要3 個運算元的JavaScript 運算子:要 ...
- 3條件(三元)運算子 - HackMD
延伸:JavaScript 中強制轉型是false. JavaScript 有8 個Falsy 值。 Complete list of JavaScript falsy values. 參考資料.
- 4[Js] 三元運算符/ 三元運算值 - Medium
條件? 符合條件結果: 不符合條件結果; condition ? statement-if-true : statement-if-false;. 三元運算符其實就是if … else 的簡單寫...
- 5新手學習JavaScript: Day09 - 三元運算子與迴圈 - iT 邦幫忙
昨天介紹了if..else與switch的條件流程判斷,今天開頭先讓我們來補充一下三元運算子,再來介紹迴圈吧! 三元運算子三元運算子,又稱「條件運算子」。