es6中reduce的基本使用方法
前言
為啥要把es6 中 reduce 單獨拿出來說呢,因為這個功能實在太騷,值得如此。
reduce() 方法接收一個函數(shù)作為累加器,數(shù)組中的每個值(從左到右)開始縮減,最終計算為一個值。reduce() 方法接受四個參數(shù):初始值(或者上一次回調(diào)函數(shù)的返回值),當(dāng)前元素值,當(dāng)前索引,調(diào)用 reduce() 的數(shù)組。
reduce() 的幾個強(qiáng)大用法:
數(shù)組求和
var total = [ 0, 1, 2, 3 ].reduce(( acc, cur ) => { return acc + cur }, 0); console.log(total) // 6
二維數(shù)組轉(zhuǎn)為一維數(shù)組
var array = [[1, 2], [3, 4], [5, 6]].reduce(( acc, cur ) => { return acc.concat(cur) }, []); console.log(array) // [ 0, 1, 3, 4, 5, 6 ]
計算數(shù)組中每個元素出現(xiàn)的次數(shù)
方法一
let names = ['tom', 'jim', 'jack', 'tom', 'jack']; const countNames = names.reduce((allNames, name) => { if (name in allNames) { allNames[name] ++; } else { allNames[name] = 1; } return allNames; }, {}); console.log(countNames) // { tom: 2, jim: 1, jack: 2 }
方法二
const arraySum = (arr, val) => arr.reduce((acc, cur) => { return cur == val ? acc + 1 : acc + 0 }, 0); let arr = [ 0, 1, 3, 0, 2, 0, 2, 3 ] console.log(arraySum(arr, 0)) // 數(shù)組arr中 0 元素出現(xiàn)的次數(shù)為3
數(shù)組去重
1.方法一
let arr = [1, 2, 1, 2, 3, 5, 4, 5, 3, 4, 4, 4, 4]; let result = arr.sort().reduce((init, current) => { if (init.length === 0 || init[init.length - 1] !== current) { init.push(current); } return init; }, []); console.log(result); //[1,2,3,4,5]
2.方法二
當(dāng)然,對于數(shù)組去重,也可以直接使用es6的…[拓展運算符] + Set 實現(xiàn):
// console.log(...new Set([1,2,3,4,5,2,4,1])) const dedupe = (array) => { return Array.from(new Set(array)); } console.log(dedupe([1, 1, 2, 3])) //[1,2,3]
總結(jié)
以上就是這篇文章的全部內(nèi)容了,希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,謝謝大家對腳本之家的支持。
相關(guān)文章
javascript實現(xiàn)頁面內(nèi)關(guān)鍵詞高亮顯示代碼
關(guān)鍵詞高亮想必大家對它都不陌生吧,應(yīng)用也比較廣泛的,下面為大家介紹下通過javascript是如何實現(xiàn)頁面內(nèi)關(guān)鍵詞高亮顯示2014-04-04基于JavaScript實現(xiàn)圖片連播和聯(lián)級菜單實例代碼
這篇文章主要介紹了基于JavaScript實現(xiàn)圖片連播和聯(lián)級菜單實例代碼,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2017-07-07javascript中callee與caller的區(qū)別分析
有些小伙伴可能會問caller,callee 是什么?在javascript 中有什么樣的作用?那么本篇會對于此做一些基本介紹。希望能夠?qū)Υ蠹依斫鈐avascript中的callee與caller有所幫助。2015-04-04