Object.groupBy로 배열 그룹핑 한 줄로 끝내기

문제

배열을 특정 기준으로 그룹핑할 때마다 reduce를 써야 했다. 매번 초기값 설정하고, 키 존재 여부 체크하고, 배열에 push하고… 단순한 그룹핑인데 코드가 5줄 이상 나오는 게 좀 짜증났다.

// 이걸 매번 써야 했다
const grouped = items.reduce((acc, item) => {
  const key = item.category;
  if (!acc[key]) acc[key] = [];
  acc[key].push(item);
  return acc;
}, {});

해결

ES2024에 추가된 Object.groupBy를 쓰면 한 줄이다.

const items = [
  { name: '사과', category: '과일' },
  { name: '당근', category: '채소' },
  { name: '바나나', category: '과일' },
  { name: '시금치', category: '채소' },
];

const grouped = Object.groupBy(items, (item) => item.category);
// {
//   '과일': [{ name: '사과', ... }, { name: '바나나', ... }],
//   '채소': [{ name: '당근', ... }, { name: '시금치', ... }]
// }

실무에서 자주 쓰는 패턴들:

// 상태별 주문 분류
const orders = [
  { id: 1, status: 'pending' },
  { id: 2, status: 'shipped' },
  { id: 3, status: 'pending' },
];
const byStatus = Object.groupBy(orders, (o) => o.status);

// 날짜별 로그 그룹핑
const logs = [
  { msg: 'error', date: '2026-03-14' },
  { msg: 'info', date: '2026-03-14' },
  { msg: 'warn', date: '2026-03-13' },
];
const byDate = Object.groupBy(logs, (log) => log.date);

// 조건부 그룹핑 (성인/미성년)
const users = [
  { name: 'Kim', age: 25 },
  { name: 'Lee', age: 17 },
];
const byAge = Object.groupBy(users, (u) => u.age >= 18 ? 'adult' : 'minor');

핵심 포인트

  • Object.groupBy는 null 프로토타입 객체를 반환한다. hasOwnProperty 체크가 필요 없다
  • 키로 심볼을 쓰고 싶으면 Map.groupBy를 쓰면 된다
  • Node.js 21+, Chrome 117+, Safari 17.4+에서 지원한다. 구 브라우저는 core-js 폴리필로 대응 가능하다