重温JS数组常用方法与奇巧淫技，引领你步入编程之巅！

2023-12-07 06:14:17

引言

数组是JavaScript中非常重要且常用的数据结构，它可以存储多个值，并且可以通过索引访问这些值。数组有很多方法可以帮助我们处理数据，其中一些方法非常有用，但鲜为人知。本文将重温JS数组的常用方法和奇巧淫技（奇巧淫技主要是reduce~），助你突破编程难关，引领你步入编程之巅！

JS数组常用方法

1. map()

map()方法可以对数组中的每个元素进行操作，并返回一个由操作后的元素组成的新数组。例如，我们可以使用map()方法将数组中的每个元素乘以2，得到一个新的数组：

const numbers = [1, 2, 3, 4, 5];
const doubledNumbers = numbers.map((number) => number * 2);
console.log(doubledNumbers); // [2, 4, 6, 8, 10]

2. filter()

filter()方法可以对数组中的每个元素进行判断，并返回一个由满足条件的元素组成的新数组。例如，我们可以使用filter()方法过滤出数组中大于3的元素，得到一个新的数组：

const numbers = [1, 2, 3, 4, 5];
const filteredNumbers = numbers.filter((number) => number > 3);
console.log(filteredNumbers); // [4, 5]

3. find()

find()方法可以对数组中的每个元素进行判断，并返回第一个满足条件的元素。例如，我们可以使用find()方法找到数组中第一个大于3的元素：

const numbers = [1, 2, 3, 4, 5];
const firstNumberGreaterThan3 = numbers.find((number) => number > 3);
console.log(firstNumberGreaterThan3); // 4

4. every()

every()方法可以对数组中的每个元素进行判断，并返回一个布尔值，表示是否所有的元素都满足条件。例如，我们可以使用every()方法判断数组中的所有元素是否都大于3：

const numbers = [1, 2, 3, 4, 5];
const allNumbersGreaterThan3 = numbers.every((number) => number > 3);
console.log(allNumbersGreaterThan3); // false

5. some()

some()方法可以对数组中的每个元素进行判断，并返回一个布尔值，表示是否至少有一个元素满足条件。例如，我们可以使用some()方法判断数组中是否至少有一个元素大于3：

const numbers = [1, 2, 3, 4, 5];
const someNumbersGreaterThan3 = numbers.some((number) => number > 3);
console.log(someNumbersGreaterThan3); // true

6. reduce()

reduce()方法可以将数组中的所有元素累积成一个单一的值。例如，我们可以使用reduce()方法计算数组中所有元素的和：

const numbers = [1, 2, 3, 4, 5];
const sumOfNumbers = numbers.reduce((accumulator, currentValue) => accumulator + currentValue);
console.log(sumOfNumbers); // 15

JS数组奇巧淫技

1. 使用reduce()方法计算数组中出现次数最多的元素

const numbers = [1, 2, 3, 4, 5, 1, 2, 3];
const mostFrequentNumber = numbers.reduce((acc, curr) => {
  acc[curr] = (acc[curr] || 0) + 1;
  return acc;
}, {});

const maxCount = Math.max(...Object.values(mostFrequentNumber));
const result = Object.entries(mostFrequentNumber).filter(([key, value]) => value === maxCount);

console.log(result); // [['1', 2], ['2', 2], ['3', 2]]

2. 使用reduce()方法将数组中的对象按某个属性分组

const data = [
  { name: 'John', age: 20 },
  { name: 'Mary', age: 25 },
  { name: 'Bob', age: 30 },
  { name: 'Alice', age: 25 },
];

const groupedData = data.reduce((acc, curr) => {
  const key = curr.age;
  if (!acc[key]) {
    acc[key] = [];
  }
  acc[key].push(curr);
  return acc;
}, {});

console.log(groupedData);
// {
//   20: [{ name: 'John', age: 20 }],
//   25: [{ name: 'Mary', age: 25 }, { name: 'Alice', age: 25 }],
//   30: [{ name: 'Bob', age: 30 }]
// }

3. 使用reduce()方法将数组中的对象转换成Map

const data = [
  { name: 'John', age: 20 },
  { name: 'Mary', age: 25 },
  { name: 'Bob', age: 30 },
  { name: 'Alice', age: 25 },
];

const map = data.reduce((acc, curr) => {
  acc.set(curr.name, curr);
  return acc;
}, new Map());

console.log(map);
// Map {
//   'John' => { name: 'John', age: 20 },
//   'Mary' => { name: 'Mary', age: 25 },
//   'Bob' => { name: 'Bob', age: 30 },
//   'Alice' => { name: 'Alice', age: 25 }
// }