條件語句是任何編程語言中最重要和最基本的概念。 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
登錄后復制
在上面的語法中,條件是一個表達式。當條件表達式為 true 時,執行代碼塊 1;否則,它執行代碼塊2。
如果我們將內聯 if 語句與 if-else 語句進行比較,則 code-block-1 是 if 語句的代碼,code-block-2 是 else 語句的代碼。
示例
在下面的示例中,我們將學習內聯 if 語句的基本用法。我們使用了條件“10===10”,如果條件為 true,則會打印“10 等于 10”;否則,它將打印“10 is not equal to 10”。
在輸出中,用戶可以觀察到它打印了“10 is equal to 10”,因為條件始終評估為 true。
<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 語句使代碼更清晰、更具可讀性,并且在相同的邏輯下編寫更少的代碼行總是好的。
以上就是如何在 JavaScript 中編寫內聯 IF 語句?的詳細內容,更多請關注www.92cms.cn其它相關文章!