JS陣列reduce()方法原理及使用技巧解析
阿新 • • 發佈:2020-07-16
1、語法
arr.reduce(callback,[initialValue])
reduce 為陣列中的每一個元素依次執行回撥函式,不包括陣列中被刪除或從未被賦值的元素,接受四個引數:初始值(或者上一次回撥函式的返回值),當前元素值,當前索引,呼叫 reduce 的陣列。
callback (執行陣列中每個值的函式,包含四個引數)
1、previousValue (上一次呼叫回撥返回的值,或者是提供的初始值(initialValue))
2、currentValue (陣列中當前被處理的元素)
3、index (當前元素在陣列中的索引)
4、array (呼叫 reduce 的陣列)
initialValue (作為第一次呼叫 callback 的第一個引數。)如果沒有提供initialValue,reduce 會從索引1的地方開始執行 callback 方法,跳過第一個索引。如果提供initialValue,從索引0開始。
2、reduce的簡單用法
var arr = [1,2,3,4]; var sum = arr.reduce((x,y)=>x+y) var mul = arr.reduce((x,y)=>x*y) console.log( sum ); //求和,10 console.log( mul ); //求乘積,24
1) 計算陣列中每個元素出現的次數
let names = ['Alice','Bob','Tiff','Bruce','Alice']; let nameNum = names.reduce((pre,cur)=>{ if(cur in pre){ pre[cur]++ }else{ pre[cur] = 1 } return pre },{}) console.log(nameNum); //{Alice: 2,Bob: 1,Tiff: 1,Bruce: 1}
2)陣列去重
let arr = [1,4,1] let newArr = arr.reduce((pre,cur)=>{ if(!pre.includes(cur)){ return pre.concat(cur) }else{ return pre } },[]) console.log(newArr);// [1,4]
3)將二維陣列轉化為一維
let arr = [[0,1],[2,3],[4,5]] let newArr = arr.reduce((pre,cur)=>{ return pre.concat(cur) },[]) console.log(newArr); // [0,1,5]
4)將多維陣列轉化為一維
let arr = [[0,[5,6,7]]] const newArr = function(arr){ return arr.reduce((pre,cur)=>pre.concat(Array.isArray(cur)?newArr(cur):cur),[]) } console.log(newArr(arr)); //[0,5,7]
5)物件裡的屬性求和
var result = [ { subject: 'math',score: 10 },{ subject: 'chinese',score: 20 },{ subject: 'english',score: 30 } ]; var sum = result.reduce(function(prev,cur) { return cur.score + prev; },0); console.log(sum) //60
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支援我們。