条件语句是任何编程语言中最重要和最基本的概念。 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 语句?的详细内容。更多信息请关注PHP中文网其他相关文章!