如何将JavaScript数组中的相同元素分组组成新的二维数组

你可以通过哈希表映射的方式实现需求，时间复杂度为O(n)，仅需遍历一次原数组即可完成分组：

基础实现（对象存储） #

const arr = ['a', 'b', 'c', 'a', 'b', 'c', 'd']
// 用对象存储每个元素对应的分组子数组
const groupMap = {}

arr.forEach(item => {
  // 元素第一次出现时初始化对应子数组
  if (!groupMap[item]) {
    groupMap[item] = []
  }
  // 将当前元素推入对应分组
  groupMap[item].push(item)
})

// 提取所有分组子数组得到最终结果
const result = Object.values(groupMap)
console.log(result) // [['a','a'], ['b','b'], ['c','c'], ['d']]

兼容顺序保证版本（Map存储） #

如果需要严格保证分组顺序和元素首次出现的顺序完全一致，且兼容旧版JS环境，可以改用Map实现：

const arr = ['a', 'b', 'c', 'a', 'b', 'c', 'd']
const groupMap = new Map()

arr.forEach(item => {
  if (!groupMap.has(item)) {
    groupMap.set(item, [])
  }
  groupMap.get(item).push(item)
})

const result = Array.from(groupMap.values())

极简reduce写法 #

也可以用数组reduce方法简化代码：

const arr = ['a', 'b', 'c', 'a', 'b', 'c', 'd']
const result = Object.values(arr.reduce((acc, cur) => {
  acc[cur] = acc[cur] || []
  acc[cur].push(cur)
  return acc
}, {}))

内容的提问来源于stack exchange，提问作者Gary Oak