JSON 병합

관련 추천

JSON 병합(JSON Merge)이란 무엇인가요?

사용 사례

• 여러 마이크로서비스 API 응답을 하나의 통합 JSON 구조로 병합하여 프론트엔드에서 사용
• base/dev/prod 다층 설정 파일을 집계하여 환경별 오버라이드로 최종 설정 생성
• 여러 i18n 번역 파일을 언어별로 병합·중복 제거·보완하여 완전한 사전으로 완성
• 여러 mock 데이터 배열이나 페이지네이션 API 응답을 합쳐 완전한 데이터 세트로 구성
• 프론트엔드 컴포넌트에서 기본 설정 + 사용자 커스텀 설정 + 원격 A/B 실험 설정 병합
• 데이터 마이그레이션에서 여러 소스 시스템의 JSON 내보내기 파일을 합쳐 다운스트림 형식으로 통일

이용 방법

1. 병합할 2~N개의 JSON을 왼쪽 입력창에 순서대로 붙여넣거나(기본 2개) 「+」를 클릭하여 입력창을 더 추가
2. 툴바 드롭다운에서 병합 전략을 선택: Deep Merge(깊은 병합) / Shallow Merge(얕은 병합) / Array Concat(배열 이어붙이기) / Array Replace(배열 덮어쓰기)
3. 「병합」 버튼을 클릭하면 오른쪽 출력창에 병합된 포맷 결과가 표시됩니다; 입력에 구문 오류가 있으면 구체적인 행 번호와 오류 메시지가 표시됨
4. 결과가 정확한지 확인한 후 「복사」를 클릭하여 병합 결과를 클립보드에 넣거나 「다운로드」를 클릭하여 merged.json 파일로 저장한 후 포맷팅, Schema 검증 등 후속 처리 진행

주요 기능

• 4가지 병합 전략: Deep Merge / Shallow Merge / Array Concat / Array Replace, 원클릭 전환으로 다양한 비즈니스 시나리오 대응
• 2~N개 JSON 지원: 기본 2개 입력창에 「+」 버튼으로 입력창을 동적 추가 가능, 다중 소스 집계에 유연하게 대응
• 재귀적 깊은 병합: 다층 중첩 객체를 지능적으로 처리하고 리프 노드 충돌을 지정 전략으로 해결하여 모든 유효 필드를 보존
• 유연한 충돌 해결: 최상위 충돌은 선택 전략으로 처리; 중첩 객체 충돌은 깊이 들어가 병합; 배열 충돌은 arrayConcat/arrayReplace로 구분 처리
• 통합 포맷 출력: 병합 결과를 2칸 공백 들여쓰기로 표시하여 수동 검토와 다운스트림 도구로의 직접 복사에 편리
• 실시간 병합 실행: 붙여넣기 후 「병합」 클릭 시 즉시 결과 표시, 오류 발생 시 JSON 행 번호와 오류 메시지를 구체적으로 출력
• 로컬 처리로 프라이버시 보호: 파싱, 병합, 포맷팅이 모두 브라우저 로컬에서 완료되며 입력 내용이 어떤 서버로도 전송되지 않음
• 다운스트림과 매끄럽게 연계: 병합 결과를 원클릭으로 JSON 포맷터, Schema 검증, 코드 생성 등의 도구로 복사하여 후속 처리 가능

코드 예제

// npm install lodash.merge
import merge from 'lodash.merge';

const a = { user: { name: 'Alice', age: 28 }, tags: ['admin'] };
const b = { user: { email: 'a@x.com', age: 29 }, tags: ['editor'] };

// 깊은 병합: 중첩 객체를 재귀적으로 병합, 리프 노드는 나중 입력이 앞 값을 덮어씀
const deep = merge({}, a, b);
console.log(deep);
// => { user: { name: 'Alice', age: 29, email: 'a@x.com' }, tags: ['admin', 'editor'] }

// 얕은 병합: 최상위 키를 통째로 덮어쓰고 중첩으로 들어가지 않음
const shallow = Object.assign({}, a, b);
console.log(shallow);
// => { user: { email: 'a@x.com', age: 29 }, tags: ['editor'] }

# pip install mergedeep
from mergedeep import merge

a = {"user": {"name": "Alice", "age": 28}, "tags": ["admin"]}
b = {"user": {"email": "a@x.com", "age": 29}, "tags": ["editor"]}

# 깊은 병합
result = merge(a, b)
print(result)
# => {'user': {'name': 'Alice', 'age': 29, 'email': 'a@x.com'}, 'tags': ['admin', 'editor']}

# 참고: mergedeep은 기본으로 배열을 이어붙이며 문자열/숫자는 덮어씁니다
# 배열을 덮어쓰려면 strategy='override'를 추가하세요

# 여러 JSON 배열을 하나의 긴 배열로 이어붙이기
jq -s 'add' a.json b.json c.json

# 여러 JSON 객체를 재귀적으로 병합 (jq 1.6+)
jq -s 'reduce .[] as $item ({}; . * $item)' a.json b.json

# 얕은 병합: b의 최상위 키를 a에 덮어쓰기
jq -s '.[0] * .[1]' a.json b.json

# 배열을 이어붙인 후 id 필드 중복 제거
jq -s '[.[].items[]] | unique_by(.id)' a.json b.json

자주 묻는 질문

문제 해결

용어집

JSON Merge

두 개 이상의 JSON 객체를 지정된 규칙에 따라 하나의 새 객체로 합치는 작업. 핵심 과제는 '키 이름 충돌 시 해결 전략'입니다.

Deep Merge / 깊은 병합(딥머지)

중첩 객체 안으로 재귀적으로 들어가 각 리프 노드를 개별적으로 병합하는 전략. 양쪽 모두 일반 객체일 때만 재귀하며 그 외에는 덮어쓰기로 처리합니다.

Shallow Merge / 얕은 병합

최상위 키만 병합하고 동명 키는 전체를 덮어쓰는 전략. JS에서 `Object.assign({}, a, b)`와 동등합니다.

Array Concat / 배열 이어붙이기

배열 병합 전략 중 하나: 여러 배열을 하나의 긴 배열로 이어붙여 모든 요소의 순서를 보존합니다. API 응답 집계에 자주 사용됩니다.

Array Replace / 배열 덮어쓰기

배열 병합 전략 중 하나: 동명 배열을 나중에 입력한 값으로 통째로 덮어씁니다. 설정 오버라이드에 자주 사용됩니다.

Object.assign

JavaScript 내장 메서드로, 모든 열거 가능한 자체 속성을 하나 이상의 소스 객체에서 타겟 객체로 얕게 복사합니다. 얕은 병합의 사실상 표준 구현입니다.

lodash.merge

Lodash 라이브러리가 제공하는 깊은 병합 함수로, Node.js 생태계에서 가장 널리 쓰이는 deep merge 구현체입니다. 배열은 덮어쓰지 않고 이어붙입니다.

mergedeep (Python)

Python 생태계의 깊은 병합 라이브러리. pip install mergedeep로 설치하며 strategy 매개변수로 배열 이어붙이기/덮어쓰기 동작을 제어할 수 있습니다.

jq -s 'add'

jq 명령으로 여러 JSON 배열을 단일 배열로 합칩니다. 여러 JSON 객체를 병합하려면 `reduce .[] as $item ({}; . * $item)`를 사용합니다.

BFF (Backend for Frontend)

마이크로서비스 아키텍처에서 프론트엔드와 백엔드 서비스 사이에 위치한 집계 계층. 여러 서비스의 JSON 응답을 하나의 통합 응답으로 합치는 경우가 많아 JSON 병합의 대표적인 시나리오입니다.

4가지 JSON 병합 전략 비교

주요 JSON 병합 구현 대조표

Authoritative References

• MDNObject.assign - MDN 웹 문서
• LodashLodash _.merge 공식 문서
• jqjq 공식 매뉴얼 - reduce와 add
• IETFJSON 공식 명세 (RFC 8259)