操作數據的map/filter/forEach/every/some方法總結

1.forEach不會返回新的數組,而是在原數組的基礎上改變數組,可以用於數組的修改


  var arr = new Array();

  arr = [1, 2, 3, 4, 5, 6];

  arr.forEach((item, index, a) => {

    console.log(item, index, a) //子元素,索引,原數組

    arr[index] = item + 1

  })

  console.log(arr) //arr是一個新的數組 [2, 3, 4, 5, 6, 7]

2.map不改變原數組,會將處理過的數據組成一個新的數組

 var arr = new Array(), arrNew = new Array();

  arr = [1, 2, 3, 4, 5, 6];

  arrNew = arr.map((item, index, a) => {

    // console.log(item,index,a) //子元素,索引,原數組

    return item * item

  })

  console.log(arr);//[1, 2, 3, 4, 5, 6]

  console.log(arrNew);//[1, 4, 9, 16, 25, 36]

3.filter不會改變原數組,但是也會將滿足條件的元素組成印個新的數組,return出來

var arr = new Array(), arrNew = new Array();

  arr = [1, 2, 3, 4, 5, 6];
  //filter:
  arrNew = arr.filter((item, index, a) => {

    // console.log(item,index,a) //子元素,索引,原數組

    return item > 3

  })

  console.log(arr);//[1, 2, 3, 4, 5, 6]

  console.log(arrNew);//[4, 5, 6]
  // map:
  arrNew = arr.map((item, index, a) => {

    // console.log(item,index,a) //子元素,索引,原數組

    return item > 3

  })

  console.log(arr);//[1, 2, 3, 4, 5, 6]

  console.log(arrNew);//[false, false, false, true, true, true]

//map和filter的區別主要在於,當過濾而不是改變的時候,map return的是一個盛放布爾值的數組

4.every不是過濾也不是進行處理,也不會生成新的數組,他是對數組中的每一個元素進行判斷

每一個元素都滿足要求就返回true,只要有一個不滿足就返回false

 var arr = new Array();

  arr = [1, 2, 3, 4, 5, 6];

  var arrNew = arr.every((item, index, a) => {

    return item > 3

  })

  console.log(arr);//[1, 2, 3, 4, 5, 6]

  console.log(arrNew); //false

 

 5.some和every一樣不是過濾也不是進行處理,也不會生成新的數組,他是對數組中的每一個元素進行判斷

  但是隻要有一個元素滿足要求就返回true,都不滿足就返回false

 var arr = new Array();

  arr = [1, 2, 3, 4, 5, 6];

  var arrNew = arr.some((item, index, a) => {

    return item > 5

  })

  console.log(arr);//[1, 2, 3, 4, 5, 6]

  console.log(arrNew); //true

6.

過去有很長一段時間,我一直很難理解 reduce() 這個方法的具體用法,平時也很少用到它。事實上,如果你能真正瞭解它的話,其實在很多地方我們都可以用得上,那麼今天我們就來簡單聊聊JS中 reduce() 的用法。

arr.reduce(function(prev,cur,index,arr){
...
}, init);

arr 表示原數組;
prev 表示上一次調用回調時的返回值,或者初始值 init;
cur 表示當前正在處理的數組元素;
index 表示當前正在處理的數組元素的索引,若提供 init 值,則索引爲0,否則索引爲1;
init 表示初始值。

使用場景:
1.求數組和:
注意:(由於傳入了初始值0,所以開始時prev的值爲0,cur的值爲數組第一項3,相加之後返回值爲3作爲下一輪迴調的prev值,然後再繼續與下一個數組項相加,以此類推,直至完成所有數組項的和並返回。)
let arr=[1,4,3,5,7,8,9,1,3,4];
let sum=arr.reduce((pre,cur)=>{
  return pre+cur
},0)
2.求數組最大值項:
注意:init無值 pre參數第一項是arr[0],cur是從arr[1]開始  有init pre最開始取init的值 cur取arr[0](由於未傳入初始值,所以開始時prev的值爲數組第一項3,cur的值爲數組第二項9,取兩值最大值後繼續進入下一輪迴調)
let max=arr.reduce((pre,cur)=>{
  return Math.max(pre,cur)
})
3.數組去重
let newArr=arr.reduce((pre,cur)=>{
  pre.indexOf(cur)==-1&&pre.push(cur)
  return pre
},[])

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章