JS中三元運算符的語法是什么

本篇內(nèi)容主要講解“JS中三元運算符的語法是什么”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“JS中三元運算符的語法是什么”吧!

10年積累的網(wǎng)站制作、做網(wǎng)站經(jīng)驗，可以快速應對客戶對網(wǎng)站的新想法和需求。提供各種問題對應的解決方案。讓選擇我們的客戶得到更好、更有力的網(wǎng)絡服務。我雖然不認識你，你也不認識我。但先做網(wǎng)站后付款的網(wǎng)站建設流程，更有浦北免費網(wǎng)站建設讓你可以放心的選擇與我們合作。

三元運算符（也稱為條件運算符）可用于執(zhí)行內(nèi)聯(lián)條件檢查，而不是使用if...else語句。它使代碼更短，更易讀。它可用于根據(jù)條件為變量賦值，或根據(jù)條件執(zhí)行表達式。

語法

三元運算符接受三個操作數(shù)；它是JavaScript中唯一能做到這一點的運算符。您提供一個要測試的條件，后跟一個問號，然后是兩個用冒號分隔的表達式。如果條件被認為為真，則執(zhí)行第一個表達式；如果它被認為是假的，則執(zhí)行最終的表達式。

它以以下格式使用：

condition ? expr1 : expr2

這里，condition是要測試的條件。如果其值被認為是true，expr1則執(zhí)行。否則，如果其值被認為是false，expr2則執(zhí)行。

expr1并且expr2是任何一種表達方式。它們可以是變量、函數(shù)調(diào)用，甚至是其他條件。

例如：

1 > 2 ? console.log("true") : console.log('false');

使用三元運算符進行賦值

三元運算符最常見的用例之一是決定將哪個值分配給變量。通常，一個變量的值可能取決于另一個變量或條件的值。

雖然這可以使用if...else語句來完成，但它會使代碼更長且可讀性更低。例如：

const numbers = [1,2,3];
let message;
if (numbers.length > 2) {
  message = '數(shù)組太長';
} else {
  message = '數(shù)組太短';
}

console.log(message); // 數(shù)組太長

在此代碼示例中，您首先定義變量message。然后，您使用該if...else語句來確定變量的值。

這可以使用三元運算符在一行中簡單地完成：

const numbers = [1,2,3];
let message = numbers.length > 2 ? '數(shù)組太長' : '數(shù)組太短';

console.log(message); // 數(shù)組太長

使用三元運算符執(zhí)行表達式

三元運算符可用于執(zhí)行任何類型的表達式。

例如，如果您想根據(jù)變量的值決定運行哪個函數(shù)，您可以使用以下if...else語句執(zhí)行此操作：

if (feedback === "yes") {
  sayThankYou();
} else {
  saySorry();
}

這可以使用三元運算符在一行中完成：

feedback === "yes" ? sayThankYou() : saySorry();

如果feedback具有 value yes，則將sayThankYou調(diào)用并執(zhí)行該函數(shù)。否則，該saySorry函數(shù)將被調(diào)用并執(zhí)行。

使用三元運算符進行空檢查

在許多情況下，您可能正在處理可能有也可能沒有定義值的變量——例如，從用戶輸入檢索結果時，或從服務器檢索數(shù)據(jù)時。

使用三元運算符，您可以通過在條件操作數(shù)的位置傳遞變量名稱來檢查變量是否存在null。undefined

這在變量是對象時特別有用。如果您嘗試訪問實際上是nullor的對象上的屬性undefined，則會發(fā)生錯誤。首先檢查對象是否實際設置可以幫助您避免錯誤。

例如：

let book = { name: '小明', works: '斗破蒼穹' };
console.log(book ? book.name : '張三'); // "小明"

book = null;
console.log(book ? book.name : '張三'); // "張三"

在此代碼塊的第一部分，book是一個具有兩個屬性的對象 -name和works在上使用三元運算符時book，它會檢查它是否不是nullor undefined。如果不是——意味著它有一個值——name則訪問該屬性并將輸出控制臺。否則，如果它為空，張三輸出控制臺。

因為bookis not null，所以書名會記錄在控制臺中。但是，在第二部分中，當應用相同的條件時，三元運算符中的條件將失敗，因為bookis null。因此，“張三”輸出控制臺。

嵌套條件

盡管三元運算符是內(nèi)聯(lián)使用的，但可以將多個條件用作三元運算符表達式的一部分。您可以嵌套或鏈接多個條件來執(zhí)行類似于if...else if...else語句的條件檢查。

例如，一個變量的值可能取決于多個條件。它可以使用if...else if...else：

let score = '67';
let grade;
if (score < 50) {
  grade = 'F';
} else if (score < 70) {
  grade = 'D'
} else if (score < 80) {
  grade = 'C'
} else if (score < 90) {
  grade = 'B'
} else {
  grade = 'A'
}

console.log(grade); // "D"

在此代碼塊中，您測試變量的多個條件score以確定變量的字母等級。

可以使用三元運算符執(zhí)行這些相同的條件，如下所示：

let score = '67';
let grade = score < 50 ? 'F'
  : score < 70 ? 'D'
  : score < 80 ? 'C'
  : score < 90 ? 'B'
  : 'A';

console.log(grade); // "D"

評估第一個條件，即score < 50。如果是true，那么的grade值為F。如果是false，則計算第二個表達式，即score < 70。

這一直持續(xù)到所有條件都為false，這意味著等級的值將為A，或者直到其中一個條件被評估為true并且其真實值被分配給grade。

示例

在這個實時示例中，您可以測試三元運算符如何在更多條件下工作。如果您輸入的值小于 100，則會顯示“太低”消息。如果您輸入的值大于 100，則會顯示消息“太高”。如果輸入 100，將顯示“完美”消息。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<style>
			#result {
				display: block;
			}

			button,
			#result {
			 margin-top: 10px;
			}
		</style>
		
	</head>
	<body>
		<div>
			<label for="number">輸入一個數(shù)字</label>
			<input type="number" name="number" id="number" />
		</div>
		<button>提交</button>
		<span id="result"></span>
	</body>
	<script>
		const button = document.querySelector('button');
		const numberElm = document.querySelector('#number');
		const resultElm = document.querySelector('#result');
	
		button.addEventListener('click', function() {
			resultElm.textContent = numberElm.value > 100 ? '太高' : (numberElm.value < 100 ? '太低' : '完美');
		});
	</script>
</html>

JS中三元運算符的語法是什么

到此，相信大家對“JS中三元運算符的語法是什么”有了更深的了解，不妨來實際操作一番吧！這里是創(chuàng)新互聯(lián)網(wǎng)站，更多相關內(nèi)容可以進入相關頻道進行查詢，關注我們，繼續(xù)學習！

網(wǎng)頁題目：JS中三元運算符的語法是什么
網(wǎng)站路徑：http://aaarwkj.com/article34/jeegse.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供ChatGPT、Google、網(wǎng)站收錄、關鍵詞優(yōu)化、網(wǎng)站維護、手機網(wǎng)站建設

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉載內(nèi)容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉載，或轉載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容

欧美一级特黄大片做受成人-亚洲成人一区二区电影-激情熟女一区二区三区-日韩专区欧美专区国产专区

JS中三元運算符的語法是什么

語法

使用三元運算符進行賦值

使用三元運算符執(zhí)行表達式

使用三元運算符進行空檢查

嵌套條件

示例