資料結構
網路
關係型資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究如何在 JavaScript 中編寫內聯 IF 語句？
條件語句是任何程式語言中最重要和最基本的概念。if-else 語句允許我們有條件地執行任何程式碼塊。我們可以在大括號中定義 if 語句的條件，如果條件為真，則執行 if 程式碼塊；否則，執行 else 程式碼塊。
在這裡，我們演示了 if-else 語句在 JavaScript 中是如何工作的。
if (condition) {
// code to execute when the condition becomes true
} else {
// code to execute when the condition becomes false
}
從上面的程式碼中，使用者可以學習 if-else 語句的語法。
如果我說你可以將上面五行程式碼寫成一行，你會怎麼想？是的，你可以使用內聯 if 語句來做到這一點。
語法
使用者可以按照以下語法在 JavaScript 中使用內聯 if 語句。
Condition? code - block - 1 : code - block - 2
在上面的語法中，condition 是一個表示式。當 condition 表示式計算結果為真時，它執行 code block 1；否則，它執行 code block 2。
如果我們將內聯 if 語句與 if-else 語句進行比較，code-block-1 是 if 語句的程式碼，code-block-2 是 else 語句的程式碼。
示例
在下面的示例中，我們將學習內聯 if 語句的基本用法。我們使用了條件 '10===10'，如果條件計算結果為真，它將列印 '10 等於 10'；否則，它將列印 '10 不等於 10'。
在輸出中，使用者可以看到它列印了 '10 等於 10'，因為條件始終計算結果為真。
<html>
<body>
<h2>Using the <i> inline if statement </i> in JavaScript</h2>
<div id = "output"> </div>
<script>
let output = document.getElementById('output');
let result = 10 === 10 ? "10 is equal to 10." : "10 is not equal to 10.";
output.innerHTML += "The value of the result variable: " + result;
</script>
</body>
</html>
示例
在下面的示例中，我們建立了數字陣列。此外，我們還建立了 func1() 和 func2() 函式，它們列印帶有作為引數傳遞的值的不同訊息。
我們使用 forEach() 方法遍歷陣列。在 forEach() 方法的回撥函式中，我們檢查數字是否可以被 10 整除，如果是，則呼叫 func1() 函式；否則，呼叫 func2() 函式。
<html>
<body>
<h2>Using the <i> inline if statement </i> in JavaScript</h2>
<div id = "output"> </div>
<script>
let output = document.getElementById('output');
function func1(value) {
output.innerHTML += "The func1() is executed for the value " + value + "<br>";
}
function func2(value) {
output.innerHTML += "The func2() is executed for the value " + value + "<br>";
}
let numbers = [10, 30, 43, 50, 64, 76, 87];
numbers.forEach((num) => {
num % 10 == 0 ? func1(num) : func2(num);
})
</script>
</body>
</html>
示例
在下面的示例中，我們使用 if-else 語句和內聯 if 語句檢查年份是否為閏年。checkYear() 函式使用 if-else 語句來確保作為引數傳遞的年份是否為閏年。
在 checkInlineYear() 函式中，我們實現了與 checkYear() 函式相同的邏輯，但是我們將 if-else 語句轉換為內聯 if 語句。使用者可以看到我們如何在一行中編寫了九行程式碼。
使用者可以觀察到這兩個函式對於任何年份值都給出相同的輸出。
<html>
<body>
<h3>Using inline if statement to check whether year is leap year in JavaScript</h3>
<div id = "output"> </div>
<script>
let output = document.getElementById('output');
function checkYear(year) {
// if the year is divisible by 400, it is a leap year.
if (year % 400 == 0) {
return true;
// if the year is divisible by 400 and by 100, it is not a leap year.
} else if (year % 100 == 0) {
return false;
// if the year is divisible by 400, not divisible by 100, and divisible by 4, it is a leap year.
} else if (year % 4 == 0) {
return true;
} else {
return false;
}
}
function checkInlineYear(year) {
return year % 400 == 0 ? true : year % 100 == 0 ? false : year % 4 == 0 ? true : false;
}
output.innerHTML += "Outputs using the checkYear() function. <br> ";
output.innerHTML += "The 2023 is leap year :- " + checkYear(2020) + "<br>";
output.innerHTML += "The 3000 is leap year :- " + checkYear(3000) + "<br>";
output.innerHTML += "<br>";
output.innerHTML += "Outputs using the checkInlineYear() function. <br> ";
output.innerHTML += "The 2023 is leap year :- " + checkInlineYear(2020) + "<br>";
output.innerHTML += "The 3000 is leap year :- " + checkInlineYear(3000) + "<br>";
</script>
</body>
</html>
使用者學習瞭如何在 JavaScript 中使用內聯 if 語句。我們可以觀察到，內聯 if 語句使程式碼更清晰易讀，並且始終建議使用更少的程式碼行來實現相同的邏輯。
7K+ 瀏覽量
