ES6原生循环数组方法

​ 函数表达式和箭头函数

函数表达式写法

const array = [1, 2, 3, 4, 5, 6, 7];

array.forEach(function(item, index) {
  console.log(item); // 输出数组的每一个元素
});

箭头函数

const array = [1, 2, 3, 4, 5, 6, 7];

array.forEach((item, index) => {
  console.log(item); // 输出数组的每一个元素
});

数组遍历

​

foreach和map方法

forEach不会创建新的数组
map会创建新的数组

返回值：
1.map()方法会返回一个新数组，该数组包含应用操作后的每个元素。原始数组不会被修改。
2.foreach()方法没有返回值。它只是对每个数组元素执行操作，不能改变原始数组。

使用目的：
1.map()方法通常用于将原始数组中的每个元素转换为不同的值，并将转换后的值以相同顺序放入新数组中。
2.foreach()方法主要用于对数组元素执行某些操作，如打印输出、更新全局变量等。它不会创建新数组。

find和filter的用法

find()
1.返回满足条件的第一个元素，如果找不到符合条件的元素，则返回 undefined。
2.使用 find 方法时，一旦找到满足条件的元素，就会立即停止搜索。
3.适用于查找数组中的单个元素。

filter()
1.返回所有满足条件的元素组成的新数组，如果没有符合条件的元素，则返回空数组 []。
2.使用 filter 方法时，会对数组中的每个元素进行遍历，将满足条件的元素都添加到新数组中。
3.适用于查找多个符合条件的元素，并将它们组合成一个新的数组。
​

const numbers = [1, 2, 3, 4, 5, 6];

const findResult = numbers.find(num => num > 3);
console.log(findResult); // 输出: 4

const filterResult = numbers.filter(num => num > 3);
console.log(filterResult); // 输出: [4, 5, 6]

​const this.statsData = [
  { prop: 'John', value: 0 },
  { prop: 'Jane', value: 0 },
  { prop: 'Adam', value: 0 }
];

const statisticsData = [
  { name: 'John', count: 10 },
  { name: 'Jane', count: 5 },
  { name: 'Adam', count: 3 }
];

this.statsData.forEach(e => {
  const item = statisticsData.find(t => t.name == e.prop) || {};
  e.value = item.count || 0;
});

console.log(this.statsData);
// 输出:
// [
//   { prop: 'John', value: 10 },
//   { prop: 'Jane', value: 5 },
//   { prop: 'Adam', value: 3 }
// ]