欧美亚洲中文,在线国自产视频,欧洲一区在线观看视频,亚洲综合中文字幕在线观看

      1. <dfn id="rfwes"></dfn>
          <object id="rfwes"></object>
        1. 站長資訊網(wǎng)
          最全最豐富的資訊網(wǎng)站

          es6怎么求數(shù)組最大值

          求數(shù)組最大值的方法:1、Math.max()配合apply()來求,語法“Math.max.apply(null,array);”;2、Math.max()配合擴(kuò)展運(yùn)算符“…”來求,語法“Math.max(…array);”;3、利用reduce()來求,語法“array.reduce((a,b)=>{return a=a>b?a:b});”。

          es6怎么求數(shù)組最大值

          前端(vue)入門到精通課程:進(jìn)入學(xué)習(xí)
          Apipost = Postman + Swagger + Mock + Jmeter 超好用的API調(diào)試工具:點(diǎn)擊使用

          本教程操作環(huán)境:windows7系統(tǒng)、ECMAScript 6版、Dell G3電腦。

          取數(shù)組的最大值的幾種方法

          // 寫法一: Math.max.apply(null, [14, 3, 77, 30]);  // 寫法二: Math.max(...[14, 3, 77, 30]);  // 寫法三:reduce [14,3,77,30].reduce((accumulator, currentValue)=>{     return accumulator = accumulator > currentValue ? accumulator : currentValue });
          登錄后復(fù)制

          這里提供了三種寫法,前兩種用的都是Math.max()方法實(shí)現(xiàn)的,最后一種用了reduceAPI,下面會講到如何利用基本的Math.max()方法實(shí)現(xiàn) 取數(shù)組的最大值,詳解apply方法在實(shí)例中的運(yùn)用思想,以及reduceAPI的介紹和使用。

          Math.max()


          前兩種寫法用的都是Math.max()方法,這里先介紹一下這個方法:

          Math.max() 函數(shù)返回一組數(shù)中的最大值。

          用法:

          Math.max(10, 20);   //  20 Math.max(-10, -20); // -10 Math.max(-10, 20);  //  20
          登錄后復(fù)制

          注意是一組數(shù)中的最大值,不是一個 數(shù)組 的最大值,從上面的用法我們可以看到,參數(shù)不是一個數(shù)組,而是用逗號隔開的一組數(shù),所以我們才不能直接使用該方法來實(shí)現(xiàn)取數(shù)組的最大值,而是做一些改進(jìn):

          apply方法和擴(kuò)展運(yùn)算符的使用


          1、apply方法

          前面講到我們不能直接使用Math.max()方法來實(shí)現(xiàn)取數(shù)組的最大值,我們可以使用ES5的apply方法來實(shí)現(xiàn)。

          這里我們主要講為什么用apply就可以實(shí)現(xiàn)獲取數(shù)組最大值

          console.log(Math.max(1, 2, 344, 44, 2, 2, 333));  console.log(Math.max.call(null, 1, 2, 344, 44, 2, 2, 333));  console.log(Math.max.apply(null, [1, 2, 344, 44, 2, 2, 333]));
          登錄后復(fù)制

          es6怎么求數(shù)組最大值

          我們知道call() 方法是使用一個指定的 this 值來調(diào)用一個函數(shù),參數(shù)的傳遞和普通函數(shù)一樣。我們對Math.max使用call方法,第一個參數(shù)傳null,這樣使用就和原來的Math.max()一樣了,這當(dāng)然還沒有實(shí)現(xiàn)獲取數(shù)組的最大值,但這是理解Math.max.apply(null, [14, 3, 77, 30]);寫法的第一步,也是關(guān)鍵一步。

          Math.max()用的是參數(shù)列表,即一組數(shù),我們的目標(biāo)是一個數(shù)組,前面講到了call方法,那這里不就正好可以利用apply方法的差異性即:apply()方法接受的是一個參數(shù)數(shù)組,來實(shí)現(xiàn)我們的需求。

          所以,對Math.max使用apply方法,第一個參數(shù)傳null,第二個參數(shù)傳數(shù)組,這不就實(shí)現(xiàn)了我們的需求。

          2、擴(kuò)展運(yùn)算符的使用

          前面我們講到了對Math.max()使用apply方法來實(shí)現(xiàn)功能,事實(shí)上,我們在手寫實(shí)現(xiàn)apply這個方法的時候,就對參數(shù)這個問題上做了特殊的處理,如何在apply內(nèi)部將傳入的參數(shù)數(shù)組重新解構(gòu)成參數(shù)列表?運(yùn)用到ES6,我們使用了擴(kuò)展運(yùn)算符。

          既然使用擴(kuò)展運(yùn)算符可以把參數(shù)數(shù)組解構(gòu)為參數(shù)列表,那我們何不拿來用用,直接對Math.max()使用擴(kuò)展運(yùn)算符是實(shí)現(xiàn) 獲取數(shù)組最大值的另一實(shí)現(xiàn)方式,而這個方式也使獲得數(shù)組中的最大值變得更容易:

          var arr = [1, 2, 3]; var max = Math.max(...arr); // 3
          登錄后復(fù)制

          es6怎么求數(shù)組最大值

          reduce


          使用reduce API實(shí)現(xiàn)獲取數(shù)組最大值:

          // reduce [14,3,77,30].reduce((accumulator, currentValue)=>{     return accumulator = accumulator > currentValue ? accumulator : currentValue });
          登錄后復(fù)制

          es6怎么求數(shù)組最大值

          reduce方法參數(shù)詳解

          本文更想講一下reduce API的使用方法

          reduce() 方法對數(shù)組中的每個元素執(zhí)行一個由您提供的reducer函數(shù)(升序執(zhí)行),將其結(jié)果匯總為單個返回值。

          需要著重注意的是該方法的參數(shù):

          arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])
          登錄后復(fù)制

          概括一下就是reduce方法有兩個參數(shù),一個是callback即你自己定義的 reducer 函數(shù),一個是initialValue即初始值。

          在多數(shù)情況下,我們可能不會使用initialValue初始值這個參數(shù),只使用callback,但是initialValue初始值這個參數(shù)于reduce方法又非常相關(guān),所以我們必須清楚這個initialValue參數(shù)是干嘛的,還有其他參數(shù)都是如何使用的。

          下面我們來細(xì)細(xì)講一下callback和initialValue這兩個參數(shù)。

          • callback:

          es6怎么求數(shù)組最大值

          callback 執(zhí)行數(shù)組中每個值 (如果沒有提供 initialValue則第一個值除外)的函數(shù),注意這個:如果沒有提供 initialValue則第一個值除外,你會發(fā)現(xiàn)initialValue在reduce方法中比較關(guān)鍵如果搞不清楚initialValue參數(shù)的意義,幾乎很難去運(yùn)用reduce方法。

          callback函數(shù)又有四個參數(shù),其中前三個參數(shù)也是十分關(guān)鍵的,和initialValue參數(shù)一樣,需要搞清楚含義,分別是:accumulator,currentValue 和 index。

          之所以說清楚reduce方法的幾個關(guān)鍵參數(shù)是非常關(guān)鍵的,主要就在于,initialValue初始值有和沒有這兩種情況下,callback的三個參數(shù)(accumulator,currentValue 和 index)是不一樣的。

          • initialValue:

          initialValue參數(shù) 可選,這個參數(shù)作為第一次調(diào)用 callback函數(shù)時的第一個參數(shù)的值。 如果沒有提供初始值,則將使用數(shù)組中的第一個元素。 在沒有初始值的空數(shù)組上調(diào)用 reduce 將報錯。

          下面講方法在執(zhí)行過程中,callback的三個參數(shù)(accumulator,currentValue 和 index)是如何不一樣的:

          回調(diào)函數(shù)第一次執(zhí)行時,accumulator 和currentValue的取值有兩種情況:如果調(diào)用reduce()時提供了initialValue,accumulator取值為initialValue,currentValue取數(shù)組中的第一個值;如果沒有提供 initialValue,那么accumulator取數(shù)組中的第一個值,currentValue取數(shù)組中的第二個值。

          注意:如果沒有提供initialValue,reduce 會從索引1的地方開始執(zhí)行 callback 方法,跳過第一個索引。如果提供initialValue,從索引0開始。

          這也是index參數(shù)里描述的:index 可選。是數(shù)組中正在處理的當(dāng)前元素的索引。 如果提供了initialValue,則起始索引號為0,否則從索引1起始。

          reduce方法如何運(yùn)行

          1.無初始值的情況

          假如運(yùn)行下段reduce()代碼:

          [0, 1, 2, 3, 4].reduce(function(accumulator, currentValue, currentIndex, array){   return accumulator + currentValue; });
          登錄后復(fù)制

          callback 被調(diào)用四次,每次調(diào)用的參數(shù)和返回值如下表:

          es6怎么求數(shù)組最大值

          由reduce返回的值將是最后一次回調(diào)返回值(10)。

          你還可以使用箭頭函數(shù)來代替完整的函數(shù)。 下面的代碼將產(chǎn)生與上面的代碼相同的輸出:

          [0, 1, 2, 3, 4].reduce((prev, curr) => prev + curr );
          登錄后復(fù)制

          2.有初始值的情況

          如果你打算提供一個初始值作為reduce()方法的第二個參數(shù),以下是運(yùn)行過程及結(jié)果:

          [0, 1, 2, 3, 4].reduce((accumulator, currentValue, currentIndex, array) => {     return accumulator + currentValue }, 10)
          登錄后復(fù)制

          es6怎么求數(shù)組最大值

          這種情況下reduce()返回的值是20。

          reduce使用場景

          reduce使用場景1.將二維數(shù)組轉(zhuǎn)化為一維

          var flattened = [[0, 1], [2, 3], [4, 5]].reduce(   function(a, b) {     return a.concat(b);   },   [] ); // flattened is [0, 1, 2, 3, 4, 5]
          登錄后復(fù)制

          寫成箭頭函數(shù)的形式:

          var flattened = [[0, 1], [2, 3], [4, 5]].reduce(  ( acc, cur ) => acc.concat(cur),  [] );
          登錄后復(fù)制

          注意?。?!上面這個例子,有初始值,初始值是一個空數(shù)組[]

          concat()方法介紹:

          concat() 方法用于合并兩個或多個數(shù)組。

          const array1 = ['a', 'b', 'c']; const array2 = ['d', 'e', 'f']; const array3 = array1.concat(array2);  console.log(array3); // expected output: Array ["a", "b", "c", "d", "e", "f"]
          登錄后復(fù)制

          連接兩個數(shù)組

          以下代碼將兩個數(shù)組合并為一個新數(shù)組:

          var alpha = ['a', 'b', 'c']; var numeric = [1, 2, 3];  alpha.concat(numeric); // result in ['a', 'b', 'c', 1, 2, 3]
          登錄后復(fù)制

          連接三個數(shù)組

          以下代碼將三個數(shù)組合并為一個新數(shù)組:

          var num1 = [1, 2, 3],     num2 = [4, 5, 6],     num3 = [7, 8, 9];  var nums = num1.concat(num2, num3);  console.log(nums); // results in [1, 2, 3, 4, 5, 6, 7, 8, 9]
          登錄后復(fù)制

          reduce使用場景2.數(shù)組里所有值的和

          var sum = [0, 1, 2, 3].reduce(function (accumulator, currentValue) {   return accumulator + currentValue; }, 0); // 和為 6
          登錄后復(fù)制

          寫成箭頭函數(shù)的形式:

          var total = [ 0, 1, 2, 3 ].reduce(   ( acc, cur ) => acc + cur,   0 );
          登錄后復(fù)制

          注意,這里設(shè)置了初始值,為0,如果不這個初始值會怎么樣呢?數(shù)組為空的時候,會拋錯TypeError,再看一遍下面的描述:

          如果數(shù)組為空且沒有提供initialValue,會拋出TypeError 。如果數(shù)組僅有一個元素(無論位置如何)并且沒有提供initialValue, 或者有提供initialValue但是數(shù)組為空,那么此唯一值將被返回并且callback不會被執(zhí)行。

          所以,在使用reduce時我們可以先判斷一下數(shù)組是否為空,來避免這個問題。

          贊(0)
          分享到: 更多 (0)
          網(wǎng)站地圖   滬ICP備18035694號-2    滬公網(wǎng)安備31011702889846號