js获取数组中的最大值的9种方法总结

 更新时间:2023年08月17日 08:27:06   作者:一花一world  
这篇文章主要为大家详细介绍了js获取数组中的最大值的9种方法,以及每种方法的工作原理和用法,文中的示例代码讲解详细,需要的可以参考下

当然,我可以给您详细说明每种方法的工作原理和用法。以下是每种方法的详细说明:

1.方法1:Math.max()和apply()

  • 使用Math.max()函数和apply()方法来找到数组中的最大值。
  • apply()方法将Math.max()函数应用于数组,它将数组的元素作为参数传递给Math.max()函数。
  • 返回数组中的最大值。

2.方法2:for循环遍历数组

  • 使用for循环遍历数组,从第一个元素开始比较,找到最大值。
  • 初始化一个变量max为数组的第一个元素。
  • 从数组的第二个元素开始,依次与max比较,如果当前元素大于max,则更新max为当前元素。
  • 返回数组中的最大值。

3.方法3:reduce()方法

  • 使用reduce()方法来迭代数组,并在每次迭代时找到最大值。
  • 初始值设置为Number.MIN_SAFE_INTEGER,确保数组中的任何值都可以成为最大值。
  • 在每次迭代时,使用Math.max()函数来比较当前元素和累加器的值,返回较大的值作为下一次迭代的累加器。
  • 返回数组中的最大值。

4.方法4:sort()方法

  • 使用sort()方法对数组进行排序。
  • 默认情况下,sort()方法按照字符串顺序对元素进行排序。
  • 通过提供一个比较函数,可以确保按照数字顺序对元素进行排序。
  • 将数组的最后一个元素作为最大值返回。

5.方法5:spread语法和Math.max()函数

  • 使用展开运算符(Spread Operator)将数组的元素作为参数传递给Math.max()函数。
  • 返回数组中的最大值。

6.方法6:ES6的解构赋值和sort()方法

  • 使用展开运算符(Spread Operator)将数组的元素作为参数传递给sort()方法进行排序。
  • 使用解构赋值将排序后的数组的第一个元素赋值给变量max。
  • 返回数组中的最大值。

7.方法7:ES6的解构赋值和reduce()方法

  • 使用reduce()方法迭代数组,并在每次迭代时找到最大值。
  • 初始值设置为Number.MIN_SAFE_INTEGER,确保数组中的任何值都可以成为最大值。
  • 在每次迭代时,使用解构赋值将当前元素和累加器的值分别赋值给变量cur和max。
  • 如果cur大于max,则更新max为cur。
  • 返回数组中的最大值。

8.方法8:Math.max()函数和展开运算符(Spread Operator)

  • 使用展开运算符(Spread Operator)将数组的元素作为参数传递给Math.max()函数。
  • 返回数组中的最大值。

9.方法9:ES6的解构赋值和Math.max()函数

  • 使用reduce()方法迭代数组,并在每次迭代时找到最大值。
  • 初始值设置为Number.MIN_SAFE_INTEGER,确保数组中的任何值都可以成为最大值。
  • 在每次迭代时,使用解构赋值将当前元素和累加器的值分别赋值给变量cur和max。
  • 如果cur大于max,则更新max为cur。
  • 返回数组中的最大值。

示例

1. 使用Math.max()函数和apply()方法:

const arr = [1, 3, 5, 2, 4];
const max = Math.max.apply(null, arr);
console.log(max); // 输出:5

2. 使用for循环遍历数组:

const arr = [1, 3, 5, 2, 4];
let max = arr[0];
for (let i = 1; i < arr.length; i++) {
  if (arr[i] > max) {
    max = arr[i];
  }
}
console.log(max); // 输出:5

3. 使用reduce()方法:

const arr = [1, 3, 5, 2, 4];
const max = arr.reduce((acc, cur) => Math.max(acc, cur), Number.MIN_SAFE_INTEGER);
console.log(max); // 输出:5

4. 使用sort()方法:

const arr = [1, 3, 5, 2, 4];
arr.sort((a, b) => a - b);
const max = arr[arr.length - 1];
console.log(max); // 输出:5

5. 使用spread语法和Math.max()函数:

const arr = [1, 3, 5, 2, 4];
const max = Math.max(...arr);
console.log(max); // 输出:5

6. 使用ES6的解构赋值和sort()方法:

const arr = [1, 3, 5, 2, 4];
const [max] = [...arr].sort((a, b) => b - a);
console.log(max); // 输出:5

7. 使用ES6的解构赋值和reduce()方法:

const arr = [1, 3, 5, 2, 4];
const [max] = arr.reduce(([max], cur) => cur > max ? [cur] : [max], [Number.MIN_SAFE_INTEGER]);
console.log(max); // 输出:5

8. 使用Math.max()函数和展开运算符(Spread Operator):

const arr = [1, 3, 5, 2, 4];
const max = Math.max(...arr);
console.log(max); // 输出:5

9. 使用ES6的解构赋值和Math.max()函数:

const arr = [1, 3, 5, 2, 4];
const [max] = arr.reduce(([max], cur) => cur > max ? [cur] : [max], [Number.MIN_SAFE_INTEGER]);
console.log(max); // 输出:5

场景

1.使用Math.max()函数和apply()方法:

使用场景:适用于普通的数组,不适用于大型数组。

优点:简单直接。

缺点:对于大型数组,可能会导致栈溢出。

2.使用for循环遍历数组:

使用场景:适用于普通的数组。

优点:简单直接,适用于大型数组。

缺点:需要手动编写循环代码。

3.使用reduce()方法:

使用场景:适用于普通的数组。

优点:简洁,适用于大型数组。

缺点:可能会导致性能问题,对于大型数组,reduce()方法可能会比较慢。

4.使用sort()方法:

使用场景:适用于普通的数组。

优点:简单直接,适用于大型数组。

缺点:改变了原数组的顺序。

5.使用spread语法和Math.max()函数:

使用场景:适用于普通的数组。

优点:简洁。

缺点:对于大型数组,可能会导致栈溢出。

6.使用ES6的解构赋值和sort()方法:

使用场景:适用于普通的数组。

优点:简洁。

缺点:改变了原数组的顺序。

7.使用ES6的解构赋值和reduce()方法:

使用场景:适用于普通的数组。

优点:简洁。

缺点:可能会导致性能问题,对于大型数组,reduce()方法可能会比较慢。

8.使用Math.max()函数和展开运算符(Spread Operator):

使用场景:适用于普通的数组。

优点:简洁。

缺点:对于大型数组,可能会导致栈溢出。

9.使用ES6的解构赋值和Math.max()函数:

使用场景:适用于普通的数组。

优点:简洁。

缺点:对于大型数组,可能会导致栈溢出。

把九种方法封装成一个方法

function findMax(arr) {
  // 方法1:Math.max()和apply()
  const method1 = () => {
    return Math.max.apply(null, arr);
  };
  // 方法2:for循环遍历数组
  const method2 = () => {
    let max = arr[0];
    for (let i = 1; i < arr.length; i++) {
      if (arr[i] > max) {
        max = arr[i];
      }
    }
    return max;
  };
  // 方法3:reduce()方法
  const method3 = () => {
    return arr.reduce((acc, cur) => Math.max(acc, cur), Number.MIN_SAFE_INTEGER);
  };
  // 方法4:sort()方法
  const method4 = () => {
    const sortedArr = [...arr].sort((a, b) => a - b);
    return sortedArr[arr.length - 1];
  };
  // 方法5:spread语法和Math.max()函数
  const method5 = () => {
    return Math.max(...arr);
  };
  // 方法6:ES6的解构赋值和sort()方法
  const method6 = () => {
    const [max] = [...arr].sort((a, b) => b - a);
    return max;
  };
  // 方法7:ES6的解构赋值和reduce()方法
  const method7 = () => {
    const [max] = arr.reduce(([max], cur) => cur > max ? [cur] : [max], [Number.MIN_SAFE_INTEGER]);
    return max;
  };
  // 方法8:Math.max()函数和展开运算符(Spread Operator)
  const method8 = () => {
    return Math.max(...arr);
  };
  // 方法9:ES6的解构赋值和Math.max()函数
  const method9 = () => {
    const [max] = arr.reduce(([max], cur) => cur > max ? [cur] : [max], [Number.MIN_SAFE_INTEGER]);
    return max;
  };
  return {
    method1,
    method2,
    method3,
    method4,
    method5,
    method6,
    method7,
    method8,
    method9
  };
}
// 使用示例
const arr = [1, 3, 5, 2, 4];
const maxFinder = findMax(arr);
console.log(maxFinder.method1()); // 输出:5
console.log(maxFinder.method2()); // 输出:5
console.log(maxFinder.method3()); // 输出:5
console.log(maxFinder.method4()); // 输出:5
console.log(maxFinder.method5()); // 输出:5
console.log(maxFinder.method6()); // 输出:5
console.log(maxFinder.method7()); // 输出:5
console.log(maxFinder.method8()); // 输出:5
console.log(maxFinder.method9()); // 输出:5

通过调用findMax函数,您将得到一个包含九种方法的对象,然后可以使用method1method9来调用相应的方法。每种方法都会返回数组中的最大值。

到此这篇关于js获取数组中的最大值的9种方法总结的文章就介绍到这了,更多相关js获取数组最大值内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • js密码强度检测

    js密码强度检测

    这篇文章主要介绍了js密码强度检测的相关资料,并给出了详细代码,需要的朋友可以参考下
    2016-01-01
  • 如何通过javaScript去除字符串两端的空白字符

    如何通过javaScript去除字符串两端的空白字符

    这篇文章主要介绍了如何通过javaScripte去除字符串两端的空白字符,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-02-02
  • JS实现小米轮播图

    JS实现小米轮播图

    这篇文章主要为大家详细介绍了JS实现小米轮播图,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-09-09
  • Javascript对象属性方法汇总

    Javascript对象属性方法汇总

    这篇文章主要是对Javascript对象属性方法进行了详细的汇总介绍。需要的朋友可以过来参考下,希望对大家有所帮助
    2013-11-11
  • 小程序实现侧边栏切换

    小程序实现侧边栏切换

    这篇文章主要为大家详细介绍了小程序实现侧边栏切换效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07
  • 关于验证码在IE中不刷新的快速解决方法

    关于验证码在IE中不刷新的快速解决方法

    下面小编就为大家带来一篇关于验证码在IE中不刷新的快速解决方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-09-09
  • 小程序中监听页面滚动的几种方法实例

    小程序中监听页面滚动的几种方法实例

    这段时间接了一个微信小程序项目,从此打开小程序的新世界大门,下面这篇文章主要给大家介绍了关于小程序中监听页面滚动的几种方法,文中通过示例代码介绍的非常详细,需要的朋友可以参考下
    2022-04-04
  • js数组去重常见的方法汇总(7种)

    js数组去重常见的方法汇总(7种)

    我们做项目的时候往往会需要把数组里面一些重复的项去掉,下面这篇文章主要给大家介绍了关于js数组去重常见的7种方法汇总,对每种方法都进行了总结,需要的朋友可以参考下
    2022-08-08
  • javascript跳转与返回和刷新页面的实例代码

    javascript跳转与返回和刷新页面的实例代码

    这篇文章主要介绍了javascript跳转与返回和刷新页面的实例代码,简单介绍了javascript中window.open()与window.location.href的区别,感兴趣的朋友一起看看吧
    2019-11-11
  • 关于js中removeEventListener取消事件监听的坑

    关于js中removeEventListener取消事件监听的坑

    许多入前端不久的人都会遇到removeEventListener无法清除监听的情况,下面这篇文章主要给大家介绍了关于js中removeEventListener取消事件监听的坑,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
    2022-09-09

最新评论