常用的遍历方法用途和运用

最近写代码，用到的遍历方法有点多。总结一下，方便后面需要的时候查看。需要的可以收藏。先写基本的用途和运用，后续遇到好的例子会更改。如果简单的例子还没有理解，这里每一条都会附上mdn官方的描述。

一、map

• 用途：对数组中的每个元素执行回调函数，并返回一个新数组，新数组中的元素是回调函数的返回值。
• 返回值：新数组，长度与原数组相同。
• 是否改变原数组：否。
• mdn描述
• 示例：

  const arr = [1, 2, 3]; 
  const newArr = arr.map(x => x * 2); 
  console.log(newArr); // [2, 4, 6]

二、some

• 用途：检查数组中是否至少有一个元素满足回调函数的条件。
• 返回值：布尔值（true 或 false），只要有一个元素满足条件即返回 true，否则返回 false。
• 是否改变原数组：否。
• mdn描述
• 示例：

  const arr = [1, 2, 3]; 
  const hasEven = arr.some(x => x % 2 === 0); 
  console.log(hasEven); // true

三、forEach

• 用途：对数组中的每个元素执行回调函数，但不返回值。
• 返回值：undefined。
• 是否改变原数组：否（除非在回调函数中显式修改原数组）。
• mdn描述
• 示例：

  const arr = [1, 2, 3]; 
  arr.forEach(x => console.log(x)); // 1, 2, 3

四、filter

• 用途：过滤数组，返回一个包含所有满足回调函数条件的元素的新数组。
• 返回值：新数组，长度可能小于或等于原数组。
• 是否改变原数组：否。
• mdn描述
• 示例：

  const arr = [1, 2, 3]; 
  const evenNumbers = arr.filter(x => x % 2 === 0); 
  console.log(evenNumbers); // [2]

五、reduce

• 用途：对数组中的每个元素执行回调函数，将数组缩减为单个值（可以是任意类型，如数字、字符串、对象等）。
• 返回值：回调函数累计计算的结果。
• 是否改变原数组：否。
• mdn描述
• 示例：

  const arr = [1, 2, 3];
   const sum = arr.reduce((acc, x) => acc + x, 0); 
  console.log(sum); // 6

六、every

• 用途：检查数组中的每个元素是否都满足回调函数的条件。
• 返回值：布尔值（true 或 false），只有所有元素都满足条件时才返回 true，否则返回 false。
• 是否改变原数组：否。
• mdn描述
• 示例：

  const arr = [1, 2, 3]; 
  const allEven = arr.every(x => x % 2 === 0); 
  console.log(allEven); // false

七、find

• 用途：返回数组中第一个满足回调函数条件的元素。
• 返回值：找到的元素，如果未找到则返回 undefined。
• 是否改变原数组：否。
• mdn描述
• 示例：

  const arr = [1, 2, 3]; 
  const firstEven = arr.find(x => x % 2 === 0); 
  console.log(firstEven); // 2

八、findIndex

• 用途：返回数组中第一个满足回调函数条件的元素的索引。
• 返回值：找到的元素的索引，如果未找到则返回 -1。
• 是否改变原数组：否。
• mdn描述
• 示例：

  const arr = [1, 2, 3]; 
  const firstEvenIndex = arr.findIndex(x => x % 2 === 0); 
  console.log(firstEvenIndex); // 1

九、flatMap

• 用途：先对数组中的每个元素执行 map 操作，然后将结果“扁平化”一层。
• 返回值：新数组。
• 是否改变原数组：否。
• mdn描述
• 示例：

  const arr = [1, 2, 3]; 
  const flattened = arr.flatMap(x => [x, x * 2]); 
  console.log(flattened); // [1, 2, 2, 4, 3, 6]

十、总结对比

方法	用途	返回值	是否改变原数组
map	对每个元素执行回调，返回新数组	新数组	否
some	检查是否有元素满足条件	布尔值	否
forEach	对每个元素执行回调，无返回值	undefined	否
filter	过滤满足条件的元素	新数组	否
reduce	将数组缩减为单个值	任意类型	否
every	检查是否所有元素都满足条件	布尔值	否
find	返回第一个满足条件的元素	元素或 undefined	否
findIndex	返回第一个满足条件的元素的索引	索引或 -1	否
flatMap	先 map 再扁平化一层	新数组	否