javascript中数组的常见的简便写法，javascript中map, filter, forEach, reduce 等方法组合使用

一、单独使用

1、map

功能：对数组中的每个元素执行指定的映射操作，返回一个新的数组。

const numbers = [1, 2, 3];
const squares = numbers.map(num => num * num); // [1, 4, 9]

2、filter

功能：过滤数组中的元素，返回符合条件的新数组。

const phones = [
  { name: "PhoneA", price: 500 },
  { name: "PhoneB", price: 1000 },
  { name: "PhoneC", price: 300 }
];
const expensivePhones = phones.filter(phone => phone.price > 500); // [{ name: "PhoneB", price: 1000 }]

3、forEach

功能：对数组中的每个元素执行指定操作，不返回新数组，适用于简单的遍历。

const users = ["Alice", "Bob", "Charlie"];
users.forEach((user, index) => console.log(index, user)); // 0 Alice, 1 Bob, 2 Charlie

4、reduce

功能：对数组中的元素进行累积操作，可以将数组聚合为一个单一的值。

const sum = [1, 2, 3, 4].reduce((acc, curr) => acc + curr, 0); // 10

二、组合使用

1.使用 map 和 filter

筛选出数组中的偶数，并将每个偶数加 1。

const numbers = [1, 2, 3, 4, 5];
const result = numbers.filter(num => num % 2 === 0).map(num => num + 1); // [3, 5]

2.使用 map 和 forEach

输出数组中每个元素的平方。

const numbers = [1, 2, 3];
numbers.map(num => num * num).forEach(num => console.log(num)); // 1,4,9

3.使用 map 和 reduce

计算数组中所有偶数的和。

const numbers = [1, 2, 3, 4, 5];
const sumOfEven = numbers.filter(num => num % 2 === 0).reduce((acc, curr) => acc + curr, 0); // 6 (2 + 4)

4.使用 forEach 和 filter

动态创建一个对象，记录相同名称的数量。

const phones = [
  { name: "PhoneA", price: 500 },
  { name: "PhoneA", price: 500 },
  { name: "PhoneB", price: 1000 }
];
const counts = {};
phones.forEach(phone => {
  const filteredPhone = phones.filter(p => p.name === phone.name);
  counts[phone.name] = filteredPhone.length;
});
console.log(counts); // { PhoneA: 2, PhoneB: 1 }

5.使用 map、filter 和 reduce

将两个数组合并为一个数组，并去重。

const array1 = [1, 2, 3];
const array2 = [3, 4, 5];
const merged = array1.concat(array2).filter((num, index, self) => self.indexOf(num) === index); // [1,2,3,4,5]

统计数组中每种数字的出现次数。

const numbers = [1, 2, 2, 3, 3, 3];
const counts = numbers.reduce((acc, num) => {
  acc[num] = (acc[num] || 0) + 1;
  return acc;
}, {});
console.log(counts); // { '1': 1, '2': 2, '3': 3 }

6.使用 map 和 filter

处理嵌套数组。

const users = [
  { name: "Alice", age: 25, skills: ["JavaScript", "React"] },
  { name: "Bob", age: 30, skills: ["Python", "Django"] },
  { name: "Charlie", age: 35, skills: ["JavaScript", "Node.js"] }
];

// 获取所有 JavaScript 开发者的技能
const javascriptDevelopersSkills = users
  .filter(user => user.skills.includes("JavaScript"))
  .map(user => user.skills);
// [
//   ["JavaScript", "React"],
//   ["JavaScript", "Node.js"]
// ]

7.使用some 和every

检查是否满足条件。
some 方法用于检查数组中是否至少有一个元素满足条件，every 方法用于检查是否所有元素都满足条件：

let array = [1, 2, 3, 4, 5];
let hasEven = array.some((num) => num % 2 === 0); // 检查是否有偶数
let allEven = array.every((num) => num % 2 === 0); // 检查是否都是偶数

8.使用reduce 与 Object.assign

将 array 中的元素组合成一个对象。

let array = [["key1", "value1"], ["key2", "value2"]];
let obj = array.reduce((acc, [key, value]) => Object.assign(acc, { [key]: value }), {});
// { key1: "value1", key2: "value2" }。

三、利用map返回值实现的简便写法

1. map 与 parseInt

将字符串数组中的元素转换为整数：

let strArray = ["1", "2", "3"];
let intArray = strArray.map(parseInt);
// [1, 2, 3]

2. map 与 parseFloat

将字符串数组中的元素转换为浮点数：

let strArray = ["1a", "2b", "3c"];
let intArray = strArray.map(parseFloat);
 // [1, 2, 3]

3. map 与 Number

将字符串数组转换为数字数组（可以是整数或浮点数）：

let strArray = ["1.23", "4", "5.67"];
let numArray = strArray.map(Number);
// [1.23, 4, 5.67]

4. map 与 String

将数组中的元素都转换为字符串：

let numArray = [1, 2, 3];
let strArray = numArray.map(String);
// ["1", "2", "3"]