두 개의 Object array 특정 키 값으로 Join 하는 방법

JavaScript에서 두 개의 객체 배열(Object Array)을 특정 키를 기준으로 join하려면 SQL의 JOIN처럼 직접 구현해야 합니다. JavaScript에는 기본적으로 SQL처럼 자동으로 JOIN해주는 기능이 없기 때문에, map, filter, find 또는 reduce 등의 메서드를 활용해서 수동으로 조합해야 합니다. 아래는 다양한 방법으로 inner join(교집합 형태)을 구현하는 예시입니다.

---

✅ 예시 상황

const users = [
  { id: 1, name: '철수' },
  { id: 2, name: '영희' },
  { id: 3, name: '민수' }
];

const orders = [
  { userId: 1, product: '노트북' },
  { userId: 2, product: '키보드' },
  { userId: 4, product: '마우스' }
];

위처럼 users.id와 orders.userId를 기준으로 join하고 싶다고 가정하면...

---

🔁 방법 1: map + find를 이용한 inner join

const joined = users.map(user => {
  const order = orders.find(order => order.userId === user.id);
  if (order) {
    return {
      ...user,
      ...order
    };
  }
}).filter(Boolean);

console.log(joined);

✅ 결과:

[
  { id: 1, name: '철수', userId: 1, product: '노트북' },
  { id: 2, name: '영희', userId: 2, product: '키보드' }
]

---

⚡ 방법 2: reduce와 Map을 활용한 성능 최적화 (대량 데이터에 유리)

const orderMap = new Map(orders.map(order => [order.userId, order]));

const joined = users.reduce((acc, user) => {
  const order = orderMap.get(user.id);
  if (order) {
    acc.push({ ...user, ...order });
  }
  return acc;
}, []);

console.log(joined);

✅ 성능 장점:

• orderMap은 O(1) 조회를 제공하므로, 전체 연산이 O(n)입니다.
• find 기반 map은 O(n^2)이라 데이터가 많을수록 느려질 수 있어요.

---

🔄 Left Join 구현 예시

const leftJoined = users.map(user => {
  const order = orders.find(order => order.userId === user.id);
  return {
    ...user,
    product: order ? order.product : null
  };
});

console.log(leftJoined);

---

🔄 Full Outer Join 예시

const allIds = new Set([
  ...users.map(u => u.id),
  ...orders.map(o => o.userId)
]);

const fullJoin = Array.from(allIds).map(id => {
  const user = users.find(u => u.id === id);
  const order = orders.find(o => o.userId === id);
  return {
    id,
    name: user?.name ?? null,
    product: order?.product ?? null
  };
});

console.log(fullJoin);

---

📦 라이브러리 추천 (lodash)

lodash 같은 유틸 라이브러리를 쓰면 더 깔끔하게 처리할 수 있어요.

npm install lodash

import _ from 'lodash';

const joined = _.map(users, user => {
  const order = _.find(orders, { userId: user.id });
  return {
    ...user,
    ...(order || {})
  };
});

---

🧠 마무리 정리

Join 종류 코드 방식 설명

Inner Join	map + find + filter(Boolean)	공통 키만 매칭
Left Join	map + 기본값 처리	왼쪽 기준으로 다 출력
Full Outer Join	Set으로 key 결합 후 find	모든 키를 포함
성능 최적화	Map으로 구성 후 reduce 사용	빠름 (대용량 데이터 적합)