数组迭代方法及改造

forEach

用来遍历数组的，让数组的每个元素都执行一次回调函数，类似for语句

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

    // forEach 用来遍历数组，让数组中的每一个元素都执行一次回调函数, 类似for语句
    arr.forEach(function (item, index) {
      if (index == 3) {
        // break;// 不能使用break continue， SyntaxError: Illegal break statement
        return;// 只能结束索引为3这个元素执行的函数，索引为4 5元素的的函数依然会执行。所以在forEach不应该提前结束循环，如果需要提前结束循环，要使用for语句：for(){}  for...in   for...of
      }
      console.log(item, index);
    });

forEach的改造：

 var arr = [2, 4, 6, 8];
 function forEach(fn) {
    for (var i = 0; i < arr.length; i++) {
         fn(arr[i], i);
    }
};

map

map是映射的意思，让数组中每一个元素参与运算，把每一个元素的运算结果存入新数组，map执行完毕，得到一个数组

var arr = [1, 2, '3', '4', 5, 6];
var result = arr.map(function(item){
    return item**2;// return 后面返回了什么值，新数组中存入的就是什么值，可以和数组的元素没有关系，但是一般使用map函数都是对原数组中元素的值进行修改，然后把修改后的值存入新数组
});
console.log(result);



// map判断数组中对象
// 年龄不小于18岁，并且是在线状态，添加一个属性：sign: '赶紧出来浪'
// 年龄不小于18岁，并且是非在线状态，添加一个属性：sign: '赶快来摸鱼'
// 其余，添加一个属性：sign: '我是中国好青年'

var friends = [
      { name: '张三', age: 18, online: true },
      { name: '李四', age: 16, online: false },
      { name: '王五', age: 20, online: true },
      { name: '李明', age: 20, online: false },
      { name: '花花', age: 16, online: true },
    ];
    var result = friends.map(function(item){
      if (item.age>=18 && item.online) {
        item.sign = '赶紧出来浪';
      }else if(item.age>=18 && !item.online){
        item.sign = '赶快来摸鱼';
      }else{
        item.sign = '我是中国好青年';
      }
      // console.log(item);
      return item;
    });
    console.log(result);

map改造：

 var arr = [2, 4, 6, 8];
 function map(fn, arr) {
    var tempArr = [];
    for (i in arr) {
       var res = fn(arr[i], i);
          tempArr.push(res);
     }
    return tempArr;
}

every

every 是每一项的意思，如果每一项都符合条件，回调函数全部返回true，最终结果为true；否则为false

var arr = [6, 8, 10, 1, 2, '3', '4', 5, 6];
// every只要遇到有一项不符合条件，函数返回false，结束整个every函数
var result = arr.every(function (item) {
   console.log('every=', item);
   return item % 2 == 0;
});
console.log(result);

every改造:

var arr = [ 2,6 ]

function every(fn) {
    var inn = true
    for (var i = 0; i < arr.length; i++) {
       if(!fn(arr[i])){
          inn = false
           break;
          }
    }
    return inn
 }

some

some 是某些项的意思，只要有一项符合条件，回到函数返回true，最终结果为true；否则返回false

var arr = [1, 2, '3', '4', 5, 6];
// some只要遇到有一项符合条件，函数返回true，结束整个some函数
var result = arr.some(function (item) {
    console.log('some=', item);
    return item % 2 == 0;
});
console.log(result);

some改造：

var arr = [ 2, 3 ]

function every(fn) {
    var inn = false
    for (var i = 0; i < arr.length; i++) {
        if(fn(arr[i])){
           inn = true
         }
     }
     return inn
  }

filter

filter 是筛选的意思，把数组中符合条件的元素筛选出来，存入新数组中，filte执行完毕，得到一个数组

var arr = [1, 2, '3', '4', 5, 6];
var result = arr.filter(function (item) {
      // return item % 2 == 0;// 当return的值为true的时候，才把数组元素item存入新数组
      // if (item>=2 && item<=5) {
      //   return true;
      // }
 return item >= 2 && item <= 5;
});
console.log(result);


// 找出所有在线的对象存入新数组
var friends = [
   { name: 'Tom', age: 22, online: true },
   { name: 'Lily', age: 21, online: false },
   { name: 'Lucy', age: 20, online: true },
   { name: '李明', age: 20, online: false },
   { name: '花花', age: 20, online: true },
 ];
var result = friends.filter(function (item) {
   console.log(item.online);
 // return item.online == true;
    return item.online;
 });
 console.log(result);

filter改造:

var arr = [1, 2, '3', 4, 5, 6]
function filter(fn) {
    var newArr = [];
    for (var i of arr) {
       if (fn(i)){
          newArr.push(i)
        }
     }
     return newArr
 }

reduce

arr.reduce(function(prev, current, index){}, initValue)

参数1：回调函数，回调函数有四个参数：

prev：根据是否提供初始值initValue取值不一样

current：根据是否提供初始值initValue取值不一样

index：数组元素的索引值，根据是否提供初始值initValue取值不一样

参数2：reduce的函数的初始值

  // 情况1：不存在 initvalue
  // 第一次遍历：prev的值是数组中第一个元素的值，current的值是数组中第二个元素的值
  // 从第二次遍历开始：current是数组中下一个元素的值，prev会存储是回调函数上一次return的值
  // reduce函数的返回值是最后一次回调函数return的值
  var arr = [2, 3, 6, 8, 10];
  var result = arr.reduce(function (prev, current, index) {
    // console.log('prev=', prev, 'current=', current, index);
    // return 100;
    // 第一次遍历 2+3 = prev+current = 5   return 5;    然后prev的值变为5
    // 第二次遍历 5+6 = prev+current = 11  return 11;   然后prev的值变为11
    return prev + current;
  });
  console.log(result);

  // var sum = arr.reduce((prev, current) => prev + current);
  // console.log(sum);

// 情况2：存在initValue
// 第一次遍历：prev的是initValue的值，current的值是数组中第一个元素的值
// 从第二次遍历开始：current是数组中下一个元素的值，prev会存储是回调函数上一次return的值
 var arr = [2, 3, 6, 8, 10];
 var result = arr.reduce(function (prev, current, index) {
    console.log('prev=', prev, 'current=', current, index);
    // return 100;
    // 第一次遍历 0+2 = prev+current = 2   return 2;    然后prev的值变为2
    // 第二次遍历 2+3 = prev+current = 5   return 5;    然后prev的值变为5
    return prev + current;
  }, 0);
console.log(result);

 //看个例题
 var arr = [2, 3, 6, 12, 35, 21];
 // 求数组中的偶数和
 var sum = arr.reduce(function (prev, current) {
    if (current % 2 == 0) {
      return prev + current;
    } else {
      return prev;
    }
 }, 0);
 console.log(sum);

reduce改造:

var arr = [1,2,3,4,5];
function reduce(fn,c) {
    if(c==='' || c === 0){
       for(var i of arr){
          c = fn(c,i);
        } 
        return c;
    }else{
      c = arr[0];
      for(i of arr){
        c = fn(c,i);
      }
       return c;
     }
 };