JS中取二維數(shù)組中最大值的方法匯總

字號:


    本文通過三種解決方案給大家介紹js中取二維數(shù)組中最大值的方法。介紹的非常詳細(xì),具有參考價值
    在JavaScript中可以通過內(nèi)置的 Math.max() 的最大值,但是要從多重數(shù)組中取出最大值,還是有一定的難度。
    問題描述
    假設(shè)你有一個數(shù)組,而且這個數(shù)組中包含了數(shù)字的子數(shù)組,而我們要做的是從數(shù)組中的每個子數(shù)組中返回其最大的那個最大數(shù)。
    基本解決方案
    function largestOfFour(arr) {
    var results = []; // 創(chuàng)建一個results變量來存儲
    // 創(chuàng)建一個外層循環(huán),遍歷外層數(shù)組
    for (var n = 0; n < arr.length; n++) {
    var largestNumber = 0; // 創(chuàng)建第二個變量,存儲最大的數(shù)
    // 創(chuàng)建另一個循環(huán),遍歷子數(shù)組
    for (var sb = 0; sb < arr[n].length; sb++) {
    //檢查子數(shù)組的元素是否大于當(dāng)前存儲的最大值
    if (arr[n][sb] > largestNumber) {
    // 如果為真,將這個值賦予給變量largestNumber
    largestNumber = arr[n][sb];
    }
    }
    // 內(nèi)部循環(huán)后,將每個子數(shù)組中的值保存到數(shù)組results中
    results[n] = largestNumber;
    }
    // 返回數(shù)組
    return results;
    }
    largestOfFour([[1,34],[456,2,3,44,234],[4567,1,4,5,6],[34,78,23,1]]); //[34, 456, 4567, 78]
    上面的方法是一個普通的解決方案,通過兩個 for 循環(huán)對數(shù)組及其子數(shù)組做遍歷:
    創(chuàng)建一個 results 變量用來存儲每個子數(shù)組中遍歷出來的最大值
    創(chuàng)建外循環(huán) for 遍歷外層數(shù)組
    創(chuàng)建第二個變量 largestNumber 用來存放最大值。這個變量值必須放在內(nèi)部 for 循環(huán)的外面,因為這樣他才不會被重新分配
    創(chuàng)建第二個 for 循環(huán),來遍歷子數(shù)組中的每個元素
    通過一個 if 語句來判斷當(dāng)前子數(shù)組的元素是否大于當(dāng)前存儲的最大值 largestNumber 。如果是( true ),將這個最大值存儲給 largestNumber 。
    內(nèi)部循環(huán)結(jié)束后,將每個子數(shù)組中的最大值存儲到最初聲明的變量 results 中
    最后返回 results 數(shù)組
    取出所有子數(shù)組中的每個最大值之后,得到一個新數(shù)組 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()方法,并通過回調(diào)函數(shù),將子數(shù)組中最大值組合在一起,得到一新數(shù)組
    return arr.map(function (group) {
    // 通過reduce方法,把每個子數(shù)組中最大值返回到group數(shù)組中
    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]
    在外層數(shù)組中使用 Array.prototype.map() 方法遍歷數(shù)組。使用 map() 方法遍歷數(shù)組,會調(diào)用一個回調(diào)函數(shù),在這個回調(diào)函數(shù)中,使用 reduce() 方法對每個子數(shù)組 group 進(jìn)行合并,將值返回到一個新數(shù)組中。而在使用 reduce() 方法時,同樣會調(diào)用一個回調(diào)函數(shù),這個回調(diào)函數(shù)只做了一件事情,就是子數(shù)組中的元素做為比較,如果 current 大于 prev ,將會返回 current ,否則返回 prev ,最終得到每個子數(shù)組中最大值。
    和前面一樣,通過 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 方法創(chuàng)建一個特殊的回調(diào)函數(shù),就類似于 Math.max 方法一樣,但其有一個 Function.prototype.apply 功能,將數(shù)組作為它的參數(shù)。
    先對主數(shù)組中的每個元素做遍歷,也就是數(shù)組內(nèi)部的每個子數(shù)組
    使用 map() 方法需要一個回調(diào)函數(shù),用來找出內(nèi)部每個數(shù)組中的最大值。需要創(chuàng)建一個函數(shù),讓 Math.max 能接受輸入的數(shù)組工作。換句話說,這是非常簡單而且這樣工作也非常的好,如 Math.max([9,43,20,6]); 將會返回最大值 43
    Function.prototype.apply 方法工作可以接受數(shù)組做為參數(shù),但函數(shù)通過調(diào)用上下文,這事情就有點復(fù)雜。例如 Math.max.apply(null,[9,43,20,6]) 將調(diào)用一個 Max.max 方法,但這樣的方法找起來不容易。
    這里給 Function.prototype.apply 方法傳遞了一個 null 參數(shù),告訴 Math.max 不需要任何上下文。
    因為 arr.map() 需要一個回調(diào)函數(shù),而不只是一個表達(dá)式,我們在 Function.bind 方法中提供了一個函數(shù)
    因為 Function.prototype.apply 是一個靜態(tài)方法,類似一個函數(shù)對象,我們可以稱之為 Function.prototype.apply 上綁定了一個 Function.prototype.bind 。例如: Function.apply.bind
    現(xiàn)在可以通過 Function.prototype.apply.bind 回調(diào)函數(shù)指定其上下文,比如在這個示例中的 Math.max 方法
    由于是嵌入到 Function.prototype.apply 方法,需要一個上下文作為第一個參數(shù),而且這個上下文還是一個虛假的。
    所以我們將 null 作為第二個參數(shù)傳遞給 Function.prototype.apply.bind ,并且綁定一個上下文,這個上下文就是 Math.max 方法
    由于 Math.max 是獨立于任何上下文的,所以它會忽略 Function.prototype.apply 方法調(diào)用的虛假上下文
    我們使用 Function.prototype.apply.bind(Math.max,null) 讓一個新函數(shù)接受 arr.map 值,比如數(shù)組中的子數(shù)組
    多維數(shù)組中取最大值
    上文使用不同的方法實現(xiàn)了從二維數(shù)組中取出子數(shù)組中最大值,并且將這些最大值重新組成一個新數(shù)組,如果延伸一下,取出里面的最大值時,還需要使用 Array.prototype.max 函數(shù),函數(shù)中通過 Math.max.apply({},this) 取得最大值。不過如果不是二維數(shù)組,那上述方法將無法取出數(shù)組中最大的值。
    而在多維數(shù)組中取最大值,可以通過 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
    同樣可以使用類似的方法取出多維數(shù)組中的最小值:
    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
    總結(jié)
    在《 JavaScript學(xué)習(xí)筆記:取數(shù)組中最大值和最小值 》一文中介紹了使用 Math.max.apply({},arr) 來取數(shù)組中最大的數(shù)字。這篇文章中從不同的角度的介紹了如何在二維數(shù)組中取出最大的數(shù),但很多時候,數(shù)組還有多維數(shù)組,文章最后介紹了如何實現(xiàn)多維數(shù)組中取出最大值。如果您有更多的方案,歡迎在評論中與我們一起分享。