Javascript遍历数组的各种方式

初学者做一个小笔记，如有遗漏欢迎各位大佬补充，理性讨论不要yygq，谢谢

var arr = [1, 2, 3, 4, 4, 4, 4];

/* 
  1、for循环
  参数：遍历出来的每个都是item即每一项
    返回值：无
*/
for (var i = 0; i < arr.length; i++) {
  console.log(arr[i]);
}

/* 
  2、for……of 循环，遍历出来的每个value都是数值对应的值
    参数：遍历出来的每个都是item即每一项
    返回值：无
*/
for (value of arr) {
  console.log(value);
}

/* 
  3、for……in 循环
    参数：遍历出来的每个都是index值即数组下标
    返回值：无
*/
for (index in arr) {
  console.log(index);
}

/* 
  4、forEach循环（高阶函数）
    参数：value数组中的当前项, index当前项的索引, array原始数组；
    返回值：无
*/
arr.forEach((value, index, array) => {
  console.log(value);
  console.log(index);
  console.log(array);
});

/* 
  5、filter方法（高阶函数）
    参数：item数组中的当前项, index当前项的索引, array原始数组；
    返回值：新数组，其包含通过所提供函数实现的测试的所有元素。
*/
const a = arr.filter((item, index, array) => {
  console.log(item, index, array);
  return item > 3;
});
console.log(a);

// 引用自MDN Web Docs
const words = [
  "spray",
  "limit",
  "elite",
  "exuberant",
  "destruction",
  "present",
];
const result = words.filter((word) => word.length > 6); // 没有括号是直接省略return语句
console.log(result);
// expected output: Array ["exuberant", "destruction", "present"]

/* 
  6、map方法（高阶函数）
    参数：item数组中的当前项, index当前项的索引, array原始数组；
    返回值：新数组，其包含通过所提供函数实现的测试的所有元素。
    备注：
      因为map生成一个新数组，当你不打算使用返回的新数组却使用map是违背设计初衷的，请用forEach或者for-of替代。
      你不该使用map: A)你不打算使用返回的新数组，或/且 B) 你没有从回调函数中返回值。
*/
const newArr = arr.map((item, index, array) => {
  console.log(item);
  console.log(index);
  console.log(array);
  return item * 4;
});
console.log(newArr);

/* 
  7、reduce方法（高阶函数）
    参数：
      Accumulator (acc) (累计器)
      Current Value (cur) (当前值)
      Current Index (idx) (当前索引)
      Source Array (src) (源数组)
    返回值：数值，函数的返回值分配给累计器，该返回值在数组的每个迭代中被记住，并最后成为最终的单个结果值。
*/
const sum = [0, 1, 2, 3, 4].reduce(function (
  accumulator,
  currentValue,
  currentIndex,
  array
) {
  return accumulator + currentValue;
});
console.log(sum);

/* 
  8、every方法（高阶函数）
    参数：
      callback
        用来测试每个元素的函数，它可以接收三个参数：
      element
        用于测试的当前值。
      index可选
        用于测试的当前值的索引。
      array可选
        调用 every 的当前数组。
      thisArg
        执行 callback 时使用的 this 值。
    返回值：布尔值
    备注：every() 方法测试一个数组内的所有元素是否都能通过某个指定函数的测试。它返回一个布尔值。
*/
// 下面的例子检测在数组中是否所有元素大于 10。
function isBigEnough(element, index, array) {
  return element >= 10;
}
const big = [12, 5, 8, 130, 44].every(isBigEnough); // false
const bigg = [12, 54, 18, 130, 44].every(isBigEnough); // true
console.log(big);
console.log(bigg);

/* 
  9、every方法（高阶函数）
    参数：
      callback
        用来测试每个元素的函数，接受三个参数：
      element
        数组中正在处理的元素。
      index 可选
        数组中正在处理的元素的索引值。
      array可选
        some()被调用的数组。
      thisArg可选
        执行 callback 时使用的 this 值。
    返回值：布尔值
    备注：some() 方法测试数组中是不是至少有1个元素通过了被提供的函数测试。它返回的是一个Boolean类型的值。
*/
// 下面的例子检测在数组中是否有元素大于 10。
function isBiggerThan10(element, index, array) {
  return element > 10;
}

const some = [2, 5, 8, 1, 4].some(isBiggerThan10); // false
const somee = [12, 5, 8, 1, 4].some(isBiggerThan10); // true
console.log(some);
console.log(somee);