如何在JavaScript中查找数组的最小/最大元素？

在本教程中，我们将学习在JavaScript中查找数组最大和最小元素的不同方法。最小元素是数组中所有元素中最小的元素，而最大元素是其中最大的元素。

以下是我们可以用来查找数组最小/最大元素的方法。

  • 遍历整个数组
  • 使用Math.min()和Math.max()方法。

让我们通过程序示例来讨论这些方法。

方法1：遍历整个数组

在这种方法中，我们将使用**for**循环遍历整个数组，并将当前元素与较小元素的上一个值进行比较；如果当前元素小于较小元素的上一个值，我们将更新其值。同样，对于最大元素，如果当前元素大于最大元素的上一个值，我们将更新其值。解决这个问题需要**线性**或**O(n)**的时间。

让我们看一个上述方法的例子，以便更好地理解它的实现——

步骤

  • **步骤1**——第一步，我们将定义一个我们将搜索最小和最大元素的数字数组，并声明最小和最大变量，其初始值都赋值为数组的第一个元素。
  • **步骤2**——下一步，我们需要使用for循环遍历数组，并使用更新最小和最大变量值的逻辑。
  • **步骤3**——在这个步骤中，我们将编写使用JavaScript在用户屏幕上显示输出的逻辑。

示例1

下面的例子将说明使用**O(1)**额外空间的简单遍历方法。

<html> 
<body> 
    <p>The original array: [28, 45, 69, 20, 15, 7, 98]</p> 
    <p id="result"></p> 
    <script> 
       let array = [28, 45, 69, 20, 15, 7, 98]; 
       let min = array[0], max = array[0]; 
       for (let i = 1; i < array.length; i++) { 
          if (array[i] > max) 
             max = array[i]; 
          if (array[i] < min) 
             min = array[i]; 
        } 
        document.getElementById('result').innerHTML = 
           "The maximum or the largest element of the array is: " + max + "<br>" + 
           "The minimum or the smallest element of the array is: " + min; 
    </script> 
</body> 
</html>

在这个例子中，我们声明了一个名为**array**的数字数组，然后声明了两个变量**min**和**max**，其初始值都是数组的第一个元素，这两个变量都将表示数组中的最小和最大元素。执行这些步骤后，我们将使用for循环遍历数组元素，并在每次迭代中将**min**和**max**的值更新为数组中当前的最小和最大元素。

方法2：使用Math.min()和Math.max()方法

在这种查找数组中最大和最小元素的方法中，我们将使用JavaScript的内置**Math.max()**和**Math.min()**方法以及**apply()**方法或数组解构语法。

**Math.max()**和**Math.min()**方法一次只能对多个数值起作用。**Math.max()**方法返回传递给它的所有数字中的最大数，而**Math.min()**方法返回最小值。但是这两种方法都不适用于数组，因为它们只能用于不同的数字。

因此，为了使用这些方法在数组中查找最小/最大元素，我们需要将数组转换为一组不同的数字。在**ES6**或**ES2015**之前，我们使用**apply()**方法将数组转换为一组不同的数字。但在**ES6**之后，当引入**数组解构**语法来解构数组时，我们开始使用该语法来实现相同的目的。

让我们看看使用上述两种方法在JavaScript中查找数组中最小/最大元素的实现。

使用apply()方法

在JavaScript中，apply()方法用两个参数调用，第一个是**this**值，另一个是我们正在搜索最小/最大元素的数组。

语法

let arr=[];
let min=Math.min.apply(null, arr);
let max=Math.max.apply(null, arr);

在上面的语法中，我们使用**null**代替**this**值，因为在这种情况下我们不需要这个变量。

示例2

下面的例子将解释如何使用JavaScript的apply()方法结合Math.max()和Math.min()方法。

<html>
<body>
   <p>The array : [49, 58, 22, 17, 79, 6, 92]</p>
   <p id="result"></p>
   <script>
      let array = [49, 58, 22, 17, 79, 6, 92];
      let min = Math.min.apply(null, array);
      let max = Math.max.apply(null, array);
      document.getElementById('result').innerHTML = "The max element: " + max + "<br>" + "The min element: " + min ;
   </script>
</body>
</html>

使用数组解构语法方法

数组解构首先是在ES6引入的。数组解构是一个非常有用的方法。它可以用来区分数组的元素，合并两个数组，单独访问数组元素。

在这种情况下，我们将使用此语法来区分数组的数字。

语法

以下是数组解构的语法。

let arr=[];
console.log(…arr); // logs the array elements distinctly in the console

我们使用要解构的数组名称之前的三个点(…)。

示例3

下面的例子将说明如何使用JavaScript的Math.max()和Math.min()方法结合数组解构来查找数组中的最小/最大值——

<html>
<body>
   <p>The array is: [56, 68, 23, 9, 77, 65, 2, 89]</p>
   <p id="result"></p>
   <script>
      let array = [56, 68, 23, 9, 77, 65, 2, 89];
      let min = Math.min(...array);
      let max = Math.max(...array);
      document.getElementById('result').innerHTML = "The maximum element of the array is: <b>" + max + "</b><br>" + "The minimum element of the array is: <b>" + min + "</b>";
   </script>
</body>
</html>

在上面的两个例子中，我们已经看到如何用两种不同的语法以两种不同的方式使用JavaScript的Math.min()和Math.max()方法来查找JavaScript数组中的最小/最大元素。

在本教程中，我们深入讨论了在JavaScript中查找数组中最小/最大元素的两种不同方法，并为每种方法提供了代码示例。

更新于：2022年10月31日

11K+ 浏览量

启动您的职业生涯

通过完成课程获得认证

开始
广告
© . All rights reserved.