JS_javascript 스킬로 2차원 배열의 최대값을 구하는 방법 요약

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 루프를 통해 배열과 해당 하위 배열을 탐색하는 일반적인 솔루션입니다.

각 하위 배열에서 이동한 최대값을 저장하는 결과 변수를 생성합니다

외부 배열을 순회하기 위한 외부 루프 생성

최대값을 저장하기 위해 두 번째 변수 maximumNumber를 만듭니다. 이 변수 값은 다시 할당되지 않으므로 내부 for 루프 외부에 배치해야 합니다.

하위 배열의 각 요소를 반복하는 두 번째 for 루프를 만듭니다

if 문을 사용하여 현재 하위 배열의 요소가 현재 저장된 최대값인 maximumNumber보다 큰지 여부를 확인합니다. true( true )인 경우 이 최대값을 maximumNumber에 저장합니다.

내부 루프가 끝난 후 각 하위 배열의 최대값을 원래 선언된 변수 결과에 저장합니다

마지막으로 결과 배열 반환

모든 하위 배열에서 각 최대값을 빼낸 후 새로운 배열 결과를 얻습니다. 이때 다음만 전달하면 됩니다.

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() 메서드를 사용하여 각 하위 배열 그룹을 병합하고 값을 새 배열에 반환합니다. 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) 来取数组中最大的数字。这篇文章中从不同的角度的介绍了如何在二维数组中取出最大的数，但很多时候，数组还有多维数组，文章最后介绍了如何实现多维数组中取出最大值。如果您有更多的方案，欢迎在评论中与我们一起分享。