JavaScript三元表達(dá)式示例詳解
一、判斷三個(gè)條件
三元表達(dá)式是JS中最為常用的快捷判斷語句之一。其語法形式為:
條件 ? 結(jié)果1 : 結(jié)果2
當(dāng)判斷條件成立時(shí),返回結(jié)果1,否則返回結(jié)果2。這是JS中最為基本的三元表達(dá)式形式。
在實(shí)際應(yīng)用中,三元表達(dá)式可用于快速判斷三個(gè)條件,如下所示示例代碼:
let score = 85; let result = score >= 90 ? '優(yōu)秀' : score >=80 ? '良好' : '不及格'; console.log(result);
以上代碼的意思是:當(dāng)成績大于90分時(shí),返回字符串'優(yōu)秀';當(dāng)成績大于等于80分時(shí),返回字符串'良好';否則返回字符串'不及格'。運(yùn)行以上代碼,輸出結(jié)果為'良好'。
通過以上代碼,我們可以看到三元表達(dá)式的嵌套應(yīng)用,其思想類似于if-else語句的嵌套判斷。同時(shí),三元表達(dá)式也能夠完成復(fù)雜的條件判斷。
二、js三元表達(dá)式嵌套
除了簡單的三元表達(dá)式嵌套,JS中也可以通過多層嵌套完成更為復(fù)雜的判斷。以下是其示例代碼:
let fruit = 'apple'; let price = fruit === 'apple' ? (size === 'big' ? 10 : 8) : 5; console.log(price);
以上代碼的意思是:當(dāng)水果類型為蘋果時(shí),如果尺寸為big,返回10元,否則返回8元;如果水果類型為非蘋果,則返回5元。運(yùn)行以上代碼,輸出結(jié)果為8。
通過以上代碼,我們可以看到在三元表達(dá)式使用中,嵌套層數(shù)并沒有硬性限制,可以根據(jù)實(shí)際需求完成多層嵌套。
三、js三元表達(dá)式判斷一個(gè)
除了判斷三個(gè)條件,三元表達(dá)式還可以完成對單個(gè)條件的判斷。以下是其示例代碼:
let age = 18; let isAdult = age >= 18 ? true : false; console.log(isAdult);
以上代碼的意思是:當(dāng)年齡大于等于18歲時(shí),返回true,否則返回false。運(yùn)行以上代碼,輸出結(jié)果為true。
這是三元表達(dá)式在實(shí)際應(yīng)用中最為常用的形式之一,例如在表單提交中對數(shù)據(jù)的判斷。
四、三元表達(dá)式的語法
三元表達(dá)式的語法形式十分簡單,其一般形式為:
條件 ? 結(jié)果1 : 結(jié)果2
其中“條件”可以是任意的JS表達(dá)式,“結(jié)果1”和“結(jié)果2”也是任意JS表達(dá)式,可以是字符串、數(shù)字、函數(shù)等任意類型的值。
需要注意的是,三元表達(dá)式中的“?”和“:”都是必不可少的,缺一不可。同時(shí),在三元表達(dá)式的書寫時(shí)應(yīng)該盡量保證代碼的可讀性,不要過分嵌套,減少出錯(cuò)的可能。
五、js三元運(yùn)算符
JS中一共有三種運(yùn)算符:一元運(yùn)算符、二元運(yùn)算符和三元運(yùn)算符。三元運(yùn)算符是三種運(yùn)算符中最為特殊的一種,其語法和功能都有其獨(dú)特性。
三元表達(dá)式的運(yùn)算結(jié)果根據(jù)“?”和“:”的位置而定。當(dāng)“?”和“:”符號兩邊的表達(dá)式計(jì)算結(jié)果為真時(shí),返回“?”后的表達(dá)式計(jì)算結(jié)果;否則返回“:”后的表達(dá)式計(jì)算結(jié)果。以下是一個(gè)簡單的示例:
let var1 = true ? 'yes' : 'no'; console.log(var1);
以上代碼的意思是:如果判斷結(jié)果為真,則返回字符串'yes';否則返回字符串'no'。運(yùn)行以上代碼,輸出結(jié)果為'yes'。
六、js三元運(yùn)算符表達(dá)式
對于三元運(yùn)算符表達(dá)式,其結(jié)果同樣可以賦值給一個(gè)變量或使用在一個(gè)JS表達(dá)式中。以下是一個(gè)示例:
let age = 18; age >= 18 ? console.log('成年人') : console.log('未成年人');
以上代碼的意思是:如果年齡大于等于18歲,則輸出字符串'成年人';否則輸出字符串'未成年人'。
需要注意的是,以上代碼中使用了console.log()函數(shù)輸出結(jié)果,這是一種常見的JS輸出方式。同時(shí)三元表達(dá)式也可以作為條件語句或循環(huán)語句的判斷條件。
七、js三元表達(dá)式簡寫
在實(shí)際使用中,可以通過三元表達(dá)式完成更為簡潔的代碼書寫。例如:
let age = 18; let message = age >= 18 ? '成年人' : '未成年人';
以上代碼的意思是:如果年齡大于等于18歲,則將字符串'成年人'賦值給變量message;否則將字符串'未成年人'賦值給變量message。這種寫法極大地簡化了代碼,提高了代碼的可讀性。
需要注意的是,簡寫形式只適用于簡單的三元表達(dá)式,在復(fù)雜的三元表達(dá)式嵌套中不宜過度使用。
八、js三元表達(dá)式怎么寫
當(dāng)我們需要使用三元表達(dá)式時(shí),需要先確定條件判斷,然后按照語法形式書寫代碼。
以下是一個(gè)簡單的示例:
let score = 85; let result = score >= 90 ? '優(yōu)秀' : '不優(yōu)秀'; console.log(result);
以上代碼的意思是:如果成績大于等于90分,則返回字符串'優(yōu)秀';否則返回字符串'不優(yōu)秀'。
在實(shí)際應(yīng)用中,我們可以結(jié)合變量、運(yùn)算符等進(jìn)行復(fù)雜的條件判斷,完成更加靈活的代碼書寫。
九、js三元表達(dá)式進(jìn)階寫法
在JS中,三元表達(dá)式還可以用于返回函數(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í),返回一個(gè)匿名函數(shù),并輸出字符串'flag is true.';否則返回另一個(gè)匿名函數(shù),并輸出字符串'flag is false.'。
通過以上示例,我們可以看到在JS中,三元表達(dá)式具有非常高的靈活性和可擴(kuò)展性,可以用于各種場合,有效地提高代碼的可讀性和開發(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; } }
補(bǔ)充知識:三元運(yùn)算符可以代替簡單的 if 語句,但盡量不要嵌套使用,這樣會降低代碼的可讀性
總結(jié)
到此這篇關(guān)于JavaScript三元表達(dá)式的文章就介紹到這了,更多相關(guān)js三元表達(dá)式內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
通過js示例講解時(shí)間復(fù)雜度與空間復(fù)雜度
這篇文章主要給大家介紹了關(guān)于如何通過js示例講解時(shí)間復(fù)雜度與空間復(fù)雜度的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對大家學(xué)習(xí)或者使用js具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-08-08獲取URL地址中的文件名和參數(shù)的javascript代碼
JS 獲取URL地址中的文件名和參數(shù),這個(gè)版本中有詳細(xì)的注釋。2009-09-09利用ASP發(fā)送和接收XML數(shù)據(jù)的處理方法與代碼
利用ASP發(fā)送和接收XML數(shù)據(jù)的處理方法與代碼...2007-11-11JS如何調(diào)用WebAssembly編譯出來的.wasm文件
這篇文章主要介紹了關(guān)于WebAssembly編譯出來的.wasm文件js如何調(diào)用,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-11-11JavaScript實(shí)現(xiàn)數(shù)字格式化的示例詳解
在處理數(shù)字時(shí),為了提高可讀性,我們通常會將整數(shù)部分的數(shù)字以千分位或百分位分隔,本文將詳細(xì)介紹如何使用JavaScript來實(shí)現(xiàn)數(shù)字的千分位和百分位分隔,需要的可以參考下2024-04-04javascript實(shí)現(xiàn)動態(tài)模態(tài)綁定grid過程代碼
這篇文章主要分享javascript實(shí)現(xiàn)動態(tài)模態(tài)綁定grid過程代碼,比較實(shí)用,需要的朋友可以參考下2014-09-09JavaScript實(shí)現(xiàn)cookie的寫入、讀取、刪除功能
cookie 是存在有效期的,在默認(rèn)情況下,一個(gè) cookie 的生命周期就是在瀏覽器關(guān)閉的時(shí)候結(jié)束,本文給大家介紹關(guān)于javascript對于cookie的簡單操作,比如對于cookie的寫入和刪除,代碼簡單易懂,需要的朋友參考下2015-11-11小程序二次貝塞爾曲線實(shí)現(xiàn)購物車商品曲線飛入效果
這篇文章主要介紹了小程序二次貝塞爾曲線實(shí)現(xiàn)購物車商品曲線飛入效果,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-01-01setTimeout的延時(shí)為0時(shí)多個(gè)瀏覽器的區(qū)別
一直比較迷惑:js的setTimeout到底會在什么時(shí)候執(zhí)行,如果執(zhí)行了,和主執(zhí)行腳本到底差多長時(shí)間2012-05-05JavaScript鼠標(biāo)移動事件以及實(shí)戰(zhàn)案例
在學(xué)習(xí)JS中我對鼠標(biāo)移動事件進(jìn)行了一些總結(jié),需要的可以作參考,下面這篇文章主要給大家介紹了關(guān)于JavaScript鼠標(biāo)移動事件以及實(shí)戰(zhàn)案例的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-05-05