數組的高階方法map filter reduce的使用

數組中經常使用的高階方法：

　　foreach    map    filter    reduce    some    every

在這些方法中都是對數組中每個元素進行遍歷操做，只有foreach是沒有返回值的，reduce是的回調函數中，是有四個參數的，下面說一下他們的基本用法

 

map:    映射,能夠對數組中每一個元素進行操做，並逐一返回，生成一個理想的新數組

arr.map(function(item,index,arr){
    ..............
})

//map方法內能夠傳入一個js自帶的字段處理函數，須要注意的是傳入的函數參數問題
let arr1 = [1,4,9]
let newArr1 = arr1.map(Math.sqrt)       //Math.sqrt() 只接受一個參數，因此默認接受的是數組內每個元素   傳入對數組的每個元素進行開放 
console.log(newArr1);        //  [1,2,3]

let arr2 = [1,4,9]
let newArr2 = arr2.map(parseInt)
console.log(newArr2);        // [1,NaN,NaN]        由於parseInt()能夠接受兩個參數，第一個參數是處理的數，第二個參數是轉換的進制，在這裏將數組中的下標當作了第二個參數，因此後兩個元素是將4轉爲1進制，9轉爲2進制，都是NaN

//map能夠對數組中的每一個對象進行處理
let arr3 = [{a:1},{b:2},{c:3}]
// 對數組中的每一個對象元素增長一個y屬性，而且將每一個新對象返回，組成一個新的數組
let newArr3 = arr3.map(item => {
    item.y = 0
    return item
})
console.log(newArr3);    //[{a:1,y:0},{b:2,y:0},{c:3,y:0}]

//返回對象中指定的字段，組成新數組
let arr4 = [{a:1,x:2},{a:2,x:2},{a:3,x:2}]
let newArr4 = arr4.map(item => item.a)
console.log(newArr4);        //[1, 2, 3]

 

 

filter：過濾(當返回值爲ture時，纔會返回當前處理的元素)：

//過濾掉數組中不符合的元素
let arr = [1,2,3]
ler newArr = arr.map(item => return item > 1)

// 過濾掉數組中空項，轉爲布爾爲false的元素
let arr = [1,'',undefined,2,3]
let newArr = arr.filter(item => item)

// 過濾掉數組內不符合條件的對象
let arr = [{a:1},{a:2},{a:3}]
let newArr = arr.filter(item => item.a > 1)
console.log(newArr);    // [{a:2},{a:3}]

//過濾掉指定的空項，將沒有x屬性的對象過濾掉
let arr = [{a:1,x:2},{b:1},{c:1,x:3}]
let newArr = arr.filter(item => item.x)
console.log(newArr);

// 數組去重
var arr = [1,2,3,1,2,5,4,3,3,1]
var newArr = arr.filter((item,index,arr)=>{
return arr.indexOf(item) === index
})
console.log(newArr)

 

reduce：

    接收一個函數做爲累加器（accumulator），數組中的每一個值（從左到右）開始合併，最終爲一個值。

 

 callback(執行數組中每一個值的函數，包含四個參數)        

     previousValue(上一次調用回調函數返回的值，或者是提供的初始值（initialValue）)

     currentValue(數組中當前被處理的元素)

     index（當前元素在數組中的索引）

    array（調用reduce的數組）      

 

reduce能夠傳一個初始值，也能夠不傳，直接，將previousValue當作初始值

初始值能夠傳任何類型的值

// 不傳遞初始值，直接以數組內的第一個元素爲初始值。沒傳遞初始值時，第一個參數就是上一次回調返回的值，這裏的init依次是：1   3   6
let arr = [1,2,3,4]
let data = arr.reduce((init,now) => {
    return init+now
})
// data 爲10

// 傳遞一個Number初始值，
//init第一次是初始值10，以後每次都是上一次回調函數返回的值：
10      11    13    16
let arr = [1,2,3,4]
let data = arr.reduce((init,now) => {
    return init+now
},10)
//data爲20

//傳遞一個Object初始值.  使對象裏的屬性和某數組內的元素累加
let arr = [1,2,3,4]
let data = arr.reduce((init,now) => {
    init.sum = init.sum + now
    return init
},{sum:2})
console.log(data);  // {sum:12}

//對象內的某個屬性進行累加
let arr = [
    {a:1,name:'a'},
    {a:2,name:'b'},
    {a:3,name:'c'},
]
let data = arr.reduce((init,now) => {
    return init + now.a
},0)
console.log(data);    // 6

//  查看某字符串，每一個字符出現的次數
var str = 'abccacbbaacaa'
var obj = str.split('').reduce((init,now) => {
init[now] ? ++init[now] : init[now] = 1
return init
},{})
console.log(obj); //{a: 6, b: 3, c: 4}