迹忆客 专注技术分享

当前位置:主页 > 学无止境 > WEB前端 > JavaScript >

在 JavaScript 中的 if 语句中指定多个条件

作者:迹忆客 最近更新:2023/03/24 浏览次数:

在编程中,如果我们想在满足一个或多个特定条件时执行代码,那么在这种情况下,我们会使用称为 if 语句的东西。假设我们有一个整数数组,我们想检查数组中是否存在数字 20。我们通过在 if 语句中添加一个条件来做到这一点,如下所示。

var arr = [5,25,70,62,20,89];

arr.forEach(num => {
  	if (num == 20){
    	//do something
	}  
})

这是一个示例,其中我们仅在 if 语句中添加了一个条件。但是在编写生产就绪的软件时,有些情况我们必须将多个条件传递给 if 语句。并且根据条件的结果(真或假),我们可以执行适当的代码。现在让我们了解如何编写包含多个条件的 if 语句。


在 JavaScript 中使用逻辑运算符的 if 语句中添加乘法条件

为了在 if 语句中添加各种条件,我们使用了逻辑运算符。JavaScript 中有四个逻辑运算符,其中我们将使用两个逻辑运算符 AND(&&)和 OR(||)。这两个运算符将帮助我们区分 if 语句中的不同条件。让我们看看这些运算符是如何工作的以及如何使用它们。

  • 和 (&&

如果你有多个条件,AND(&&)运算符以这种方式工作,并且如果其中任何一个条件为 false,则总体结果将为 false。有关更多信息,请参阅下面的真值表。

AND 运算符的真值表:

A B A && B
True True True
True False False
False True False
False False False

例子:

var arr = [5,25,70,62,20,89];

arr.forEach(num => {
    if (num == 20 && num%2 == 0){
    console.log(num);
}  
})

输出:

20

在这个例子中,我们在 if 语句中有两个条件。第一个条件检查数组的当前编号是否为 20。如果条件成立,那么它将返回 truefalse 否则。第二个条件检查数组的当前编号是否为偶数。如果这是正确的,那么它将是,否则。

在这种情况下,由于我们使用 && 运算符,if 语句中的两个条件都必须成立才能进入 if 语句。在这里,仅对于数组的数字 20,这两个条件都将成立,因为数字 20 等于 20,而且 20%2 将给我们 0 作为输出。

  • 或 (||)

如果你有多个条件,则 OR (||) 运算符以这种方式工作,并且如果其中任何一个条件为,则总体结果将为

OR 运算符的真值表:

| A | B | A || B |
| ——- | ——- | :—–: |
| True | True | True |
| True | False | True |
| False | True | True |
| False | False| False |

例子:

var arr = [5,25,70,62,20,89];

arr.forEach(num => {
  	if (num == 20 || num%2 == 0){
    	console.log(num);
	}  
})

输出:

70
62
20

对于 OR 运算符,我们采用了与 AND 运算符相同的示例,但是我们使用了 || 而不是 &&运算符。请注意仅通过更改运算符就可以更改输出。这是因为当数字为 706220 时,第二个运算符变为 true 三次。


在 JavaScript 的 if 语句中组合使用 AND 和 OR 运算符

在某些情况下,我们必须在 if 语句中组合使用这些运算符。下面的示例说明了相同的情况。

var arr = [5,25,70,62,20,89];

arr.forEach(num => {
  	if ( (num != 20 && num%2 == 0) || (num > 50) && (num < 100)){
    	console.log(num);
	}  
})

输出:

70
62
89

在这里,我们在 if 语句中有三个条件。第一个条件本身就是两个条件的组合。为了使第一个条件为 true,内部两个条件 num != 20num%2 == 0 也必须为真,因为有一个 && 运算符。然后我们有第二个条件来检查数字是否大于 50。第三个条件是检查数字是否小于 100

请注意,有一个||第一个和第二个条件之间的运算符和第二个和第三个之间的&&运算符。根据运算符的优先级,&&运算符的优先级高于||运算符。因此,将首先评估第二个和第三个条件,然后将使用第一个条件评估此结果。要了解有关运算符优先级的更多信息,你可以访问此 MDN 文档

除了只使用一个 if 语句,我们还可以使用称为 if and else if 语句的东西。这允许我们添加多个 if 语句,每个语句都有不同的条件,并且每个代码块都可以执行不同的代码。下面的代码片段显示了这一点。

var arr = [5,25,70,62,20,89];

arr.forEach(num => {
  	if ((num > 50) && (num < 100)){
    	console.log("The number is in the range of 20 to 100.");
	} 
    else if(num != 20 && num%2 == 0){
        console.log("The number 20 is divisible by 2.")
    }
    else if((num < 50) || (num == 5)){
        console.log("The number is less than 50.")
    }
})

输出:

The number is less than 50.
The number is less than 50.
The number is in the range of 20 to 100.
The number is in the range of 20 to 100.
The number is less than 50.
The number is in the range of 20 to 100.

在这里,我们添加了 if 和各种 else if 语句,每个语句都包含多个条件。现在,根据数组中存在的数字,将满足三个条件中的任何一个,并且将执行该特定代码块中的代码。

转载请发邮件至 1244347461@qq.com 进行申请,经作者同意之后,转载请以链接形式注明出处

本文地址:

相关文章

在 Angular 中上传文件

发布时间:2023/04/14 浏览次数:71 分类:Angular

本教程演示了如何在 Angular 中上传任何文件。我们还将介绍如何在文件上传时显示进度条,并在上传完成时显示文件上传完成消息。

Angular 2 中的复选框双向数据绑定

发布时间:2023/04/14 浏览次数:139 分类:Angular

本教程演示了如何一键标记两个复选框。这篇有 Angular 的文章将着眼于执行复选框双向数据绑定的不同方法。

在 AngularJs 中加载 spinner

发布时间:2023/04/14 浏览次数:107 分类:Angular

我们将介绍如何在请求加载时添加加载 spinner,并在 AngularJs 中加载数据时停止加载器。

在 Angular 中显示和隐藏

发布时间:2023/04/14 浏览次数:78 分类:Angular

本教程演示了 Angular 中的显示和隐藏。在开发商业应用程序时,我们需要根据用户角色或条件隐藏一些数据。我们必须根据该应用程序中的条件显示相同的数据。

在 Angular 中下载文件

发布时间:2023/04/14 浏览次数:104 分类:Angular

本教程演示了如何在 angular 中下载文件。我们将介绍如何通过单击按钮在 Angular 中下载文件并显示一个示例。

扫一扫阅读全部技术教程

社交账号
  • https://www.github.com/onmpw
  • qq:1244347461

最新推荐

教程更新

热门标签

扫码一下
查看教程更方便