JavaScript三元表達式示例詳解
一、判斷三個條件
三元表達式是JS中最為常用的快捷判斷語句之一。其語法形式為:
條件 ? 結(jié)果1 : 結(jié)果2
當(dāng)判斷條件成立時,返回結(jié)果1,否則返回結(jié)果2。這是JS中最為基本的三元表達式形式。
在實際應(yīng)用中,三元表達式可用于快速判斷三個條件,如下所示示例代碼:
let score = 85; let result = score >= 90 ? '優(yōu)秀' : score >=80 ? '良好' : '不及格'; console.log(result);
以上代碼的意思是:當(dāng)成績大于90分時,返回字符串'優(yōu)秀';當(dāng)成績大于等于80分時,返回字符串'良好';否則返回字符串'不及格'。運行以上代碼,輸出結(jié)果為'良好'。
通過以上代碼,我們可以看到三元表達式的嵌套應(yīng)用,其思想類似于if-else語句的嵌套判斷。同時,三元表達式也能夠完成復(fù)雜的條件判斷。
二、js三元表達式嵌套
除了簡單的三元表達式嵌套,JS中也可以通過多層嵌套完成更為復(fù)雜的判斷。以下是其示例代碼:
let fruit = 'apple'; let price = fruit === 'apple' ? (size === 'big' ? 10 : 8) : 5; console.log(price);
以上代碼的意思是:當(dāng)水果類型為蘋果時,如果尺寸為big,返回10元,否則返回8元;如果水果類型為非蘋果,則返回5元。運行以上代碼,輸出結(jié)果為8。
通過以上代碼,我們可以看到在三元表達式使用中,嵌套層數(shù)并沒有硬性限制,可以根據(jù)實際需求完成多層嵌套。
三、js三元表達式判斷一個
除了判斷三個條件,三元表達式還可以完成對單個條件的判斷。以下是其示例代碼:
let age = 18; let isAdult = age >= 18 ? true : false; console.log(isAdult);
以上代碼的意思是:當(dāng)年齡大于等于18歲時,返回true,否則返回false。運行以上代碼,輸出結(jié)果為true。
這是三元表達式在實際應(yīng)用中最為常用的形式之一,例如在表單提交中對數(shù)據(jù)的判斷。
四、三元表達式的語法
三元表達式的語法形式十分簡單,其一般形式為:
條件 ? 結(jié)果1 : 結(jié)果2
其中“條件”可以是任意的JS表達式,“結(jié)果1”和“結(jié)果2”也是任意JS表達式,可以是字符串、數(shù)字、函數(shù)等任意類型的值。
需要注意的是,三元表達式中的“?”和“:”都是必不可少的,缺一不可。同時,在三元表達式的書寫時應(yīng)該盡量保證代碼的可讀性,不要過分嵌套,減少出錯的可能。
五、js三元運算符
JS中一共有三種運算符:一元運算符、二元運算符和三元運算符。三元運算符是三種運算符中最為特殊的一種,其語法和功能都有其獨特性。
三元表達式的運算結(jié)果根據(jù)“?”和“:”的位置而定。當(dāng)“?”和“:”符號兩邊的表達式計算結(jié)果為真時,返回“?”后的表達式計算結(jié)果;否則返回“:”后的表達式計算結(jié)果。以下是一個簡單的示例:
let var1 = true ? 'yes' : 'no'; console.log(var1);
以上代碼的意思是:如果判斷結(jié)果為真,則返回字符串'yes';否則返回字符串'no'。運行以上代碼,輸出結(jié)果為'yes'。
六、js三元運算符表達式
對于三元運算符表達式,其結(jié)果同樣可以賦值給一個變量或使用在一個JS表達式中。以下是一個示例:
let age = 18;
age >= 18 ? console.log('成年人') : console.log('未成年人');
以上代碼的意思是:如果年齡大于等于18歲,則輸出字符串'成年人';否則輸出字符串'未成年人'。
需要注意的是,以上代碼中使用了console.log()函數(shù)輸出結(jié)果,這是一種常見的JS輸出方式。同時三元表達式也可以作為條件語句或循環(huán)語句的判斷條件。
七、js三元表達式簡寫
在實際使用中,可以通過三元表達式完成更為簡潔的代碼書寫。例如:
let age = 18; let message = age >= 18 ? '成年人' : '未成年人';
以上代碼的意思是:如果年齡大于等于18歲,則將字符串'成年人'賦值給變量message;否則將字符串'未成年人'賦值給變量message。這種寫法極大地簡化了代碼,提高了代碼的可讀性。
需要注意的是,簡寫形式只適用于簡單的三元表達式,在復(fù)雜的三元表達式嵌套中不宜過度使用。
八、js三元表達式怎么寫
當(dāng)我們需要使用三元表達式時,需要先確定條件判斷,然后按照語法形式書寫代碼。
以下是一個簡單的示例:
let score = 85; let result = score >= 90 ? '優(yōu)秀' : '不優(yōu)秀'; console.log(result);
以上代碼的意思是:如果成績大于等于90分,則返回字符串'優(yōu)秀';否則返回字符串'不優(yōu)秀'。
在實際應(yīng)用中,我們可以結(jié)合變量、運算符等進行復(fù)雜的條件判斷,完成更加靈活的代碼書寫。
九、js三元表達式進階寫法
在JS中,三元表達式還可以用于返回函數(shù)調(diào)用結(jié)果。例如:
function foo(flag) {
return flag ? () => console.log('flag is true.') : () => console.log('flag is false.');
}
let f = foo(true);
f(); // flag is true.
以上代碼的意思是:當(dāng)flag的值為true時,返回一個匿名函數(shù),并輸出字符串'flag is true.';否則返回另一個匿名函數(shù),并輸出字符串'flag is false.'。
通過以上示例,我們可以看到在JS中,三元表達式具有非常高的靈活性和可擴展性,可以用于各種場合,有效地提高代碼的可讀性和開發(fā)效率。
$a=$b>$c ? ($c-$b) ? 1 :($b-$c) : ($b+$c) ? 0 : $b*$c; //$a=0
轉(zhuǎn)化成if(){} else{}格式
if($b>$c){
if($c-$b){
$a=1;
}else{
$a=$b-$c;
}
}else{
$a=$b+$c;
if($a){
$a=0;
}else{
$a=$b*$c;
}
}補充知識:三元運算符可以代替簡單的 if 語句,但盡量不要嵌套使用,這樣會降低代碼的可讀性

總結(jié)
到此這篇關(guān)于JavaScript三元表達式的文章就介紹到這了,更多相關(guān)js三元表達式內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
微信小程序向Java后臺傳輸參數(shù)的方法實現(xiàn)
這篇文章主要介紹了微信小程序向Java后臺傳輸參數(shù)的方法實現(xiàn),文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-12-12
學(xué)習(xí)使用Bootstrap柵格系統(tǒng)
這篇文章主要教大家學(xué)習(xí)使用Bootstrap柵格系統(tǒng),具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-05-05
前端百度地圖添加點并跳轉(zhuǎn)到百度地圖進行導(dǎo)航完整代碼
web開發(fā)過程中經(jīng)常碰到需要調(diào)用百度地圖來視線定位導(dǎo)航的過程,許多技術(shù)博客上介紹的都是調(diào)用百度地圖的api,這篇文章主要給大家介紹了關(guān)于前端百度地圖添加點并跳轉(zhuǎn)到百度地圖進行導(dǎo)航的相關(guān)資料,需要的朋友可以參考下2024-07-07
javascript 用函數(shù)語句和表達式定義函數(shù)的區(qū)別詳解
本篇文章主要介紹了javascript 用函數(shù)語句和表達式定義函數(shù)的區(qū)別。需要的朋友可以過來參考下,希望對大家有所幫助2014-01-01
webpack.DefinePlugin與cross-env區(qū)別詳解
這篇文章主要介紹了webpack.DefinePlugin與cross-env區(qū)別詳解,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-02-02
JavaScript實現(xiàn)清空(重置)文件類型INPUT元素值的方法
這篇文章主要介紹了JavaScript實現(xiàn)清空(重置)文件類型INPUT元素值的方法,結(jié)合實例形式分析了javascript清空input文本框的常用方法與實現(xiàn)技巧,需要的朋友可以參考下2016-11-11

