JS中取二维数组中最大值的方法汇总

在JavaScript中可以通过内置的 Math.max() 的最大值,但是要从多重数组中取出最大值,还是有一定的难度。

问题描述

假设你有一个数组,而且这个数组中包含了数字的子数组,而我们要做的是从数组中的每个子数组中返回其最大的那个最大数。

基本解决方案

function largestOfFour(arr) {
var results = []; // 创建一个results变量来存储
// 创建一个外层循环,遍历外层数组
for (var n = 0; n < arr.length; n++) {
var largestNumber = 0; // 创建第二个变量,存储最大的数
// 创建另一个循环,遍历子数组
for (var sb = 0; sb < arr[n].length; sb++) {
//检查子数组的元素是否大于当前存储的最大值
if (arr[n][sb] > largestNumber) {
// 如果为真,将这个值赋予给变量largestNumber
largestNumber = arr[n][sb];
}
}
// 内部循环后,将每个子数组中的值保存到数组results中
results[n] = largestNumber;
}
// 返回数组
return results;
}
largestOfFour([[1,34],[456,2,3,44,234],[4567,1,4,5,6],[34,78,23,1]]); //[34, 456, 4567, 78]

上面的方法是一个普通的解决方案,通过两个 for 循环对数组及其子数组做遍历:

创建一个 results 变量用来存储每个子数组中遍历出来的最大值

创建外循环 for 遍历外层数组

创建第二个变量 largestNumber 用来存放最大值。这个变量值必须放在内部 for 循环的外面,因为这样他才不会被重新分配

创建第二个 for 循环,来遍历子数组中的每个元素

通过一个 if 语句来判断当前子数组的元素是否大于当前存储的最大值 largestNumber 。如果是( true ),将这个最大值存储给 largestNumber 。

内部循环结束后,将每个子数组中的最大值存储到最初声明的变量 results 中

最后返回 results 数组

取出所有子数组中的每个最大值之后,得到一个新数组 results ,这个时候只需要通:

Array.prototype.max = function () {
return Math.max.apply({},this);
}
largestOfFour(arr).max();

就可以得到其中的最大值。

largestOfFour([[1,34],[456,2,3,44,234],[4567,1,4,5,6],[34,78,23,1]]).max(); // 4567

中级解决方案

function largestOfFour (arr) {
// 通过map()方法,并通过回调函数,将子数组中最大值组合在一起,得到一新数组
return arr.map(function (group) {
// 通过reduce方法,把每个子数组中最大值返回到group数组中
return group.reduce(function (prev, current) {
// 如果current 大于prev,返回current,否则返回prev
return (current > prev) ? current : prev;
});
});
}
largestOfFour([[1,34],[456,2,3,44,234],[4567,1,4,5,6],[34,78,23,1]]); // [34, 456, 4567, 78]

在外层数组中使用 Array.prototype.map() 方法遍历数组。使用 map() 方法遍历数组,会调用一个回调函数,在这个回调函数中,使用 reduce() 方法对每个子数组 group 进行合并,将值返回到一个新数组中。而在使用 reduce() 方法时,同样会调用一个回调函数,这个回调函数只做了一件事情,就是子数组中的元素做为比较,如果 current 大于 prev ,将会返回 current ,否则返回 prev ,最终得到每个子数组中最大值。

和前面一样,通过 Math.max.apply() 最终得到最大值。

最佳解决方案

function largestOfFour (arr) {
return arr.map(Function.apply.bind(Math.max, null));
}
largestOfFour([[1,34],[456,2,3,44,234],[4567,1,4,5,6],[34,78,23,1]]); //[34, 456, 4567, 78]

这个方案,使用 Function.bind 方法创建一个特殊的回调函数,就类似于 Math.max 方法一样,但其有一个 Function.prototype.apply 功能,将数组作为它的参数。

先对主数组中的每个元素做遍历,也就是数组内部的每个子数组

使用 map() 方法需要一个回调函数,用来找出内部每个数组中的最大值。需要创建一个函数,让 Math.max 能接受输入的数组工作。换句话说,这是非常简单而且这样工作也非常的好,如 Math.max([9,43,20,6]); 将会返回最大值 43

Function.prototype.apply 方法工作可以接受数组做为参数,但函数通过调用上下文,这事情就有点复杂。例如 Math.max.apply(null,[9,43,20,6]) 将调用一个 Max.max 方法,但这样的方法找起来不容易。

这里给 Function.prototype.apply 方法传递了一个 null 参数,告诉 Math.max 不需要任何上下文。

因为 arr.map() 需要一个回调函数,而不只是一个表达式,我们在 Function.bind 方法中提供了一个函数

因为 Function.prototype.apply 是一个静态方法,类似一个函数对象,我们可以称之为 Function.prototype.apply 上绑定了一个 Function.prototype.bind 。例如: Function.apply.bind

现在可以通过 Function.prototype.apply.bind 回调函数指定其上下文,比如在这个示例中的 Math.max 方法

由于是嵌入到 Function.prototype.apply 方法,需要一个上下文作为第一个参数,而且这个上下文还是一个虚假的。

所以我们将 null 作为第二个参数传递给 Function.prototype.apply.bind ,并且绑定一个上下文,这个上下文就是 Math.max 方法

由于 Math.max 是独立于任何上下文的,所以它会忽略 Function.prototype.apply 方法调用的虚假上下文

我们使用 Function.prototype.apply.bind(Math.max,null) 让一个新函数接受 arr.map 值,比如数组中的子数组

多维数组中取最大值

上文使用不同的方法实现了从二维数组中取出子数组中最大值,并且将这些最大值重新组成一个新数组,如果延伸一下,取出里面的最大值时,还需要使用 Array.prototype.max 函数,函数中通过 Math.max.apply({},this) 取得最大值。不过如果不是二维数组,那上述方法将无法取出数组中最大的值。

而在多维数组中取最大值,可以通过 join() 和 split() 方法组合在一起:

function largestOfFour (arr) {
var newArray = arr.join(",").split(",");
return Math.max.apply({},newArray);
}
largestOfFour([12,23]); // =>23
largestOfFour([12,23,[1234,324],[345,566]]); // =>1234
largestOfFour([12,23,[1234,324,[23121,90890]],[345,566,[345,78,90]]]); // =>90890
largestOfFour([12,23,[1234,324,[23121,90890]],[345,566,[345,78,90,[90909090,988]]]]); // =>90909090

同样可以使用类似的方法取出多维数组中的最小值:

function smallerOfFour (arr) {
var newArray = arr.join(",").split(",");
return Math.min.apply({},newArray);
}
smallerOfFour([12,23]); // =>12
smallerOfFour([112,23,[1234,324],[345,566]]); // =>23
smallerOfFour([212,123,[1234,324,[23121,90890]],[345,566,[345,78,90]]]); // =>78
smallerOfFour([102,230,[1234,324,[23121,90890]],[345,566,[345,78,90,[90909090,988]]]]); // =>78

总结

在《 JavaScript学习笔记:取数组中最大值和最小值 》一文中介绍了使用 Math.max.apply({},arr) 来取数组中最大的数字。这篇文章中从不同的角度的介绍了如何在二维数组中取出最大的数,但很多时候,数组还有多维数组,文章最后介绍了如何实现多维数组中取出最大值。如果您有更多的方案,欢迎在评论中与我们一起分享。

(0)

相关推荐

  • js一维数组、多维数组和对象的混合使用方法

    这篇文章的主要目的是讲解JavaScript数组和对象的混合使用,由于JS的弱检查特性,因此在JS数组中可以同时存储不同类型的变量,比如你可以把数字.字符串.字符.对象等内容放在同一个数组中.对象也可以做同样的事情,区别是对象可以指定对象里每一个成员的别名,这样在编程的时候数据更易读,比如: var arr1 = ["飞鱼", 25, 172, "江苏"]; var person = {name:"飞鱼",age: 25, height:172,

  • javascript二维数组转置实例

    本文实例讲述了javascript二维数组转置的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <script language="javascript" type="text/javascript"> var arr1 = [[30,-1,90],[70,100,-40],[39,29,6],[39,92,9]]; var arr2 = []; //确定新数组有多少行 for(var i=0;i<arr1[0].length

  • Javascript计算二维数组重复值示例代码

    前言 最近工作中遇到了一个问题,需求是利用Javascript计算二维数组重复值,如下面有个二维数组 [[\'error\',3],[\'error\',5],[\'error\',6],[\'true\',3],[\'true\',1]] 需要统计计算重复项 \'error\' 和 \'true\', 统计计算之后的结果: [[\'error\',14],[\'true\',4]] 实现代码: var arr = [[\'error\',3],[\'error\',5],[\'error\',

  • 关于JS中二维数组的声明方法

    如下所示: var myarr=new Array(); //先声明一维 for(var i=0;i<2;i++){ //一维长度为2 myarr[i]=new Array(); //再声明二维 for(var j=0;j<3;j++){ //二维长度为3 myarr[i][j]=i+j; // 赋值,每个数组元素的值为i+j } } 以上就是小编为大家带来的关于JS中二维数组的声明方法的全部内容了,希望对大家有所帮助,多多支持我们~

  • js二维数组定义和初始化的三种方法总结

    方法一:直接定义并且初始化,这种遇到数量少的情况可以用 var _TheArray = [["0-1","0-2"],["1-1","1-2"],["2-1","2-2"]] 方法二:未知长度的二维数组 var tArray = new Array(); //先声明一维 for(var k=0;k<i;k++){ //一维长度为i,i为变量,可以根据实际情况改变 tArray[k]

  • 浅谈js多维数组和hash数组定义和使用

    多维数组定义 定义数组数组对象用来在单独的变量名中存储一系列的值.使用关键词 new 来创建数组对象. 一维数组定义 var myArray=new Array('a','b','c'); 或 var myArray = []; 二维数组及多维数组定义 javascript二维数组或多维数组都是通过一维数组来模拟起来. 方法1. var arr= new Array(['a','b','c'],['d','e','f']); 方法2: var arr=new Array( new Array()

  • JavaScript实现多维数组的方法

    在C#里,定义多维数组,可以通过这样简单的代码实现: 复制代码 代码如下: int[,]myArray=new int[4,5]; 在JavaScript中不能通过直接定义实现多维数组,那么该怎么实现呢?首先定义一维数组: 复制代码 代码如下: var myArray=new Array(); 然后再将一维数组的成员定义成数组(之所以可以进行再定义,因为JavaScript是弱类型): 复制代码 代码如下: myArray[0]=new Array(); 到此为止,就定义了一个第一个索引为0的二

  • js 定义对象数组(结合)多维数组方法

    在php中定义数组很简单,但是在js中如果搞成字符为下标会出错,所以结合对象来搞 var top_ = { 'index':'首页', 'user':'用户', 'tree':'模块树' } ; var all_list = [ { "index": [ {'name':'网站栏目管理','url':'1.html'}, {'name':'网站栏目管理2','url':'2.html'} ] }, { "user": [ {'name':'用户管理','url':'

  • 关于js二维数组和多维数组的定义声明(详解)

    声明一维数组:var goodsArr = []; 赋值:goodsArr[0] = 'First Value'; 这个毫无争议,因为平时使用PHP比较多,而php语法是可以直接使用goodsArr[0] = 'First Value'; 这种方法声明数组并赋值的,但js不能这样使用,必须先声明数组存在.同理,如果是二维和多维数组在使用前也必须声明二维和多维的数组,举例二维数组: var goodsArr[0] = []; 必须先这样声明一下二维数组才能使用二维数组,否则会出错的. 以上就是小编

  • JS获取多维数组中相同键的值实现方法示例

    本文实例讲述了JS获取多维数组中相同键的值实现方法.分享给大家供大家参考,具体如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> Demo </TITLE> <META NAME="Keywords" CONTENT=""> <META NAME

随机推荐