JavaScript数组如何灵活分组：按行分组和按列分组详解？

在JavaScript中，数组的分组操作可以通过多种方式实现，具体取决于你想要的分组方式。下面我们将详细讨论如何按行分组和按列分组。

1. 按行分组

按行分组通常是指将数组中的元素按照一定的规则分成多个子数组。假设我们有一个二维数组，我们想要将其按行分组。

示例代码：

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

// 按行分组
const rowGroups = array.map(row => row);
console.log(rowGroups);

在这个例子中，array 是一个二维数组，我们使用 map 方法将其按行分组。rowGroups 将包含与原始数组相同的结构。

2. 按列分组

按列分组通常是指将二维数组中的每一列提取出来，形成一个新数组。这可以通过遍历数组的列来实现。

示例代码：

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

// 按列分组
const columnGroups = array[0].map((_, colIndex) => array.map(row => row[colIndex]));
console.log(columnGroups);

在这个例子中，我们首先使用 array[0].map 来遍历每一列的索引，然后使用 array.map 来提取每一列的元素。columnGroups 将包含每一列的元素组成的数组。

3. 按条件分组

有时候我们需要根据某些条件对数组进行分组。例如，我们可以根据元素的某个属性或值来分组。

示例代码：

const array = [
  { name: 'Alice', age: 25 },
  { name: 'Bob', age: 30 },
  { name: 'Charlie', age: 25 }
];

// 按年龄分组
const ageGroups = array.reduce((acc, obj) => {
  const key = obj.age;
  if (!acc[key]) {
    acc[key] = [];
  }
  acc[key].push(obj);
  return acc;
}, {});

console.log(ageGroups);

在这个例子中，我们使用 reduce 方法根据 age 属性对数组进行分组。ageGroups 将是一个对象，其中键是年龄，值是对应的对象数组。

4. 按多列分组

如果你需要按多列进行分组，可以使用类似的方法，但需要组合多个键。

示例代码：

const array = [
  { name: 'Alice', age: 25, city: 'New York' },
  { name: 'Bob', age: 30, city: 'Los Angeles' },
  { name: 'Charlie', age: 25, city: 'New York' }
];

// 按年龄和城市分组
const multiColumnGroups = array.reduce((acc, obj) => {
  const key = `${obj.age}-${obj.city}`;
  if (!acc[key]) {
    acc[key] = [];
  }
  acc[key].push(obj);
  return acc;
}, {});

console.log(multiColumnGroups);

在这个例子中，我们使用 reduce 方法根据 age 和 city 属性对数组进行分组。multiColumnGroups 将是一个对象，其中键是组合的 age-city，值是对应的对象数组。

总结

• 按行分组：使用 map 方法遍历每一行。
• 按列分组：使用 map 方法遍历每一列。
• 按条件分组：使用 reduce 方法根据条件进行分组。
• 按多列分组：使用 reduce 方法组合多个键进行分组。

这些方法可以帮助你在JavaScript中灵活地对数组进行分组操作。