javascript中 “ && ” 和 “ || ”有什么用

小編給大家分享一下javascript中 “ && ” 和 “ || ”有什么用，希望大家閱讀完這篇文章之后都有所收獲，下面讓我們一起去探討吧！

一、原理:

&& 操作符特點(diǎn)：邏輯運(yùn)算表達(dá)式中只要一個是false就取false的值，都是true取后面，都是false取前面。

|| 操作符特點(diǎn)：邏輯運(yùn)算表達(dá)式中只要一個是true就取true的值，都是true取前面，都是false取后面。

在js邏輯運(yùn)算中，我們知道 0、""、null、false、undefined、NaN 這五種數(shù)據(jù)類型是會被判斷為false的。那么，我們在進(jìn)行js的邏輯運(yùn)算過程中，就可以根據(jù)上面的原理以及這五種數(shù)據(jù)類型來進(jìn)行相應(yīng)的判斷處理。直接上DEMO...

二、原始DEMO：

先亮出問題?。?！

如果我們要根據(jù)學(xué)生的成績來判斷等級，比如：90分表示A，80分表示B，60分表示C，其他表示D。

那么我們可以這么做：

JS代碼：

var score = 90;
var grade = '';
if(score === 90){
 grade = "A";
}else if(score === 80){
 grade = "B";
}else if(score === 60){
 grade = "C";
}else{
 grade = "D";
}
console.log("當(dāng)前學(xué)生等級為：" + grade); // 當(dāng)前學(xué)生等級為：A

或者這樣：

var score = 90;
var grade = '';
switch(score){
 case 90:
 grade = "A";
 break;
 case 80:
 grade = "B";
 break;
 case 60:
 grade = "C";
 break;
 default:
 grade = "D";
 break;
};
console.log("當(dāng)前學(xué)生等級為：" + grade); // 當(dāng)前學(xué)生等級為：A

三、優(yōu)化DEMO：

其實(shí)，如果我們用 “ && ” 和 “ || ” 的話，大可不必如上面那么麻煩。

var score = 90;
var grade = (score===90 && 'A') || (score===80 && 'B') || (score===60 && 'C') || 'D';
console.log("當(dāng)前學(xué)生等級為：" + grade); // 當(dāng)前學(xué)生等級為：A

上面代碼可以這么理解：

如果score的值等于90，那么score===90的邏輯表達(dá)式就成立（也即是true），就會執(zhí)行到后面 'A' 的賦值操作，同時后面的“||” 邏輯運(yùn)算也可以忽略（因?yàn)椤皘|”運(yùn)算符的特點(diǎn)是前面一旦為true，后面就沒有執(zhí)行的必要了）。

如果score的值不等于90，那么score===90的邏輯表達(dá)式就不成立（也即是false），根據(jù)“&&”操作符的特點(diǎn)，我們知道“(score===90 && 'A')”這段代碼就不會執(zhí)行到后面 'A' 的賦值操作，同時由于“(score===90 && 'A')”這段代碼整體是false，那么根據(jù)“||”的特點(diǎn)，整個邏輯表達(dá)式會繼續(xù)往后執(zhí)行。

以此類推，如果前面所有的邏輯表達(dá)式都不成立，那么根據(jù)“||”的特點(diǎn)（全部為false就取最后面的），最后的grade賦值就會是“D”。

我們還可以用JSON形式來處理上面的邏輯運(yùn)算：

var score = 90;
var grade = {90:"A", 80:"B", 60:"C"}[score] || 'D';
console.log("當(dāng)前學(xué)生等級為：" + grade); // 當(dāng)前學(xué)生等級為：A

這里利用了JSON對象的屬性讀取，當(dāng)“JSON對象.屬性值”存在的時候（為true），就會取得對應(yīng)屬性的key值（A、B或者C）。當(dāng)score屬性值不存在與JSON對象中的時候，就會執(zhí)行“||”后面的內(nèi)容，也就是把grade賦值為“D”。

當(dāng)然，我們會發(fā)現(xiàn)上面的數(shù)值比較并沒有太大的實(shí)用性，比如當(dāng)學(xué)生的成績在85分的時候，等級也會變成“D”，這明顯是不合適的！??！

所以我們可以把上面的代碼再優(yōu)化下，把數(shù)值的 “相等比較” 改成 “范圍區(qū)間比較” 。

var score = 85;
var grade = (score>=90 && 'A') || (score>=80 && 'B') || (score>=60 && 'C') || 'D';
console.log("當(dāng)前學(xué)生等級為：" + grade); // 當(dāng)前學(xué)生等級為：B

看完了這篇文章，相信你對“javascript中 “ && ” 和 “ || ”有什么用”有了一定的了解，如果想了解更多相關(guān)知識，歡迎關(guān)注億速云行業(yè)資訊頻道，感謝各位的閱讀！