阵列处理方法 [filter(), find(), forEach(), map(), every(), some(), reduce()]

// 相同的阵列
var people = [
  {
    name : 'Casper' ,
    like : '锅烧意面' ,
    age : 18
  },
  {
    name : 'Wang' ,
    like : '炒面' ,
    age : 24
  },
  {
    name : 'Bobo' ,
    like : '萝卜泥' ,
    age : 1
  },
  {
    name : '卤蛋' ,
    like : '萝卜泥' ,
    age : 3
  }
];

1.Array.prototype.filter()

filter() 会回传一个阵列，其条件是return 后方为true 的物件，很适合用在搜寻符合条件的资料。

var filterEmpty = people.filter( function ( item, index, array ) {
});
console .log(filterEmpty);     //没有条件，会是一个空阵列

var filterAgeThan5 = people.filter( function ( item, index, array ) {
  return item.age > 5 ;        //取得大于五岁的   如果这边符合条件 只要为ture即可
});
console .log(filterAgeThan5);    // Casper, Wang这两个物件

2.Array.prototype.find()

find()与filter()很像，但find() 只会回传一次值，且是第一次为true的值。

var findEmpty = people.find( function ( item, index, array ) {
});
console .log(findEmpty);           //没有条件，会是undefined

var findAgeThan5 = people.find( function ( item, index, array ) {
  return item.age > 5 ;            //取得大于五岁的
});

console .log(findAgeThan5);        //虽然答案有两个，但只会回传Casper这一个物件
var findLike = people.find( function ( item, index, array ) {
  return item.like === '萝卜泥' ;   //取得阵列like === '萝卜泥'
});
console .log(findLike);            //虽然答案有两个，但只会回传第一个Bobo物件

3.Array.prototype.forEach()

forEach 是这几个阵列函式最单纯的一个，不会额外回传值，只单纯执行每个阵列内的物件或值。

var forEachIt = people.forEach( function ( item, index, array ) {
  console .log(item, index, array); //物件,索引,全部阵列
  return item;                      // forEach没在return的，所以这边写了也没用
});

console .log(forEachIt);             // undefined

people.forEach( function ( item, index, array ) {
  item.age = item.age + 1 ;          // forEach就如同for，不过写法更容易
});
console .log(people);                //全部age + 1

4.Array.prototype.map()

使用map() 时他需要回传一个值，他会透过函式内所回传的值组合成一个阵列。
如果不回传则是 undefined
回传数量等于原始阵列的长度
这很适合将原始的变数运算后重新组合一个新的阵列。

var mapEmpty = people.map( function ( item, index, array ) {
});
console .log(mapEmpty);     // [undefined, undefined, undefined, undefined]

var mapAgeThan5 = people.map( function ( item, index, array ) {
  return item.age > 5 ;     //比较大于五岁的
});
console .log(mapAgeThan5); // [true, true, false, false]

var mapAgeThan5_2 = people.map( function ( item, index, array ) {
  // 错误示范
  if (item.age > 5 ) {
    return item;               //回传大于五岁的
  }
  return  false ;                //别以为空的或是false就不会回传
});
console .log(mapAgeThan5_2);    // [{name: 'Casper'...}, {name: 'Wang'...}, false, false]
var mapEat = people.map( function ( item, index, array ) {
  if (item.like !== '萝卜泥' ) {
    return  ` ${item.like}好吃` ;
  } else {
    return  ` ${item.like}不好吃` ;
  }
});
console .log(mapEat);           // ["锅烧意面好吃", "炒面好吃", "萝卜泥不好吃", "萝卜泥不好吃"]

5.Array.prototype.every()

every()可以检查所有的阵列是否符合条件，这仅会回传一个值trueor false，可以用来检查阵列中的内容是否符合特定条件。

var ans = array.every( function ( item, index, array ) {
  console .log(item, index, array); //物件,索引,全部阵列
  return item.age > 10  //当全部age大于10才能回传true
});
console .log(ans); // false:只要有部分不符合，则为false

var ans2 = array.every( function ( item, index, array ) {
  return item.age < 25
});
console .log(ans2); // true:全部age都小于25

6.Array.prototype.some()

some() 与every() 非常接近，都是回传true or false，差异仅在every() 需完全符合，some() 仅需要部分符合。

var ans = people.some( function ( item, index, array ) {
  return item.age > 10  //当全部age大于10才能回传true
});
console .log(ans);   // true:只要有部分符合，则为true

var ans2 = people.some( function ( item, index, array ) {
  return item.age < 25
});
console .log(ans2); // true:只要有部分符合，则为true  

var ans2 = people.some( function ( item, index, array ) {
  return item.age > 25
});
console .log(ans2); // false:全部都不符合则为false

7.Array.prototype.reduce()

reduce() 和其他几个差异就很大了，他可以与前一个回传的值再次作运算，参数包含以下：
accumulator: 前一个参数，如果是第一个阵列的话，值是以另外传入或初始化的值
currentValue: 当前变数
currentIndex: 当前索引
array: 全部阵列

var reduceEmpty = people.reduce( function ( accumulator, currentValue, currentIndex, array ) {
});
console .log(reduceEmpty);                  //没有条件，会是undefined

var reducePlus = people.reduce( function ( accumulator, currentValue, currentIndex, array ) {
  // 分别为前一个回传值, 目前值, 当前索引值
  console .log(accumulator, currentValue, currentIndex);
  return accumulator + currentValue.age;   //与前一个值相加
}, 0 );                                     //传入初始化值为0
console .log(reducePlus);                   //总和为46

var reducePlus = people.reduce( function ( accumulator, currentValue, currentIndex, array ) {
  console .log( 'reduce' , accumulator, currentValue, currentIndex)
  return  Math .max( accumulator, currentValue.age ); //与前一个值比较哪个大
}, 0 );
console .log(reducePlus);                   //最大值为24

转载于 https://wcc723.github.io/javascript/2017/06/29/es6-native-array/