JSON Merge

Related

What is JSON Merge?

Use Cases

• Merge multiple microservice API responses into a unified JSON structure for the front-end
• Aggregate base / dev / prod layered config files into the final config via environment override
• Merge multiple i18n translation files by language, deduplicate, and complete into a full dictionary
• Combine multiple mock data arrays or paginated API responses into a complete dataset
• Front-end component merging default config + user customization + remote A/B experiment config
• During data migration, merge multiple source systems' JSON exports into a unified downstream format

How to Use

1. Paste 2 to N JSON segments to be merged into the left input boxes (2 by default), or click "+" to add more inputs
2. Select a merge strategy from the toolbar dropdown: Deep Merge / Shallow Merge / Array Concat / Array Replace
3. Click the "Merge" button; the right output box shows the formatted result. If the input has syntax errors, the specific line number and error message are shown
4. After confirming the result, click "Copy" to put the merged output in the clipboard, or click "Download" to save as merged.json for further formatting, Schema validation, etc.

Features

• 4 merge strategies: Deep Merge / Shallow Merge / Array Concat / Array Replace, switchable with one click to fit different business scenarios
• Supports 2 to N JSON segments: default 2 input boxes, click "+" to dynamically add more source JSON, flexible for multi-source aggregation
• Deep recursive merge: intelligently handles multi-level nested objects, resolves leaf conflicts by the specified strategy, preserving all valid fields
• Flexible conflict resolution: top-level conflicts follow the selected strategy; nested object conflicts go deep; array conflicts differentiate via arrayConcat/arrayReplace
• Unified formatted output: results are shown with 2-space indent for easy human review and direct copy to downstream tools
• Real-time execution: click "Merge" right after pasting to get results; errors display specific JSON line numbers and error messages
• Local processing for privacy: parsing, merging, and formatting all happen locally in the browser, no input sent to any server
• Seamless downstream handoff: results can be one-click copied to JSON Formatter, Schema Validator, code generators, etc.

Code Examples

// 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'] };

// Deep merge: nested objects merge recursively, leaf nodes take the later value
const deep = merge({}, a, b);
console.log(deep);
// => { user: { name: 'Alice', age: 29, email: 'a@x.com' }, tags: ['admin', 'editor'] }

// Shallow merge: top-level keys are replaced wholesale, no descent into nesting
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"]}

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

# Note: mergedeep defaults to array concat; string/number overwrite.
# For array overwrite, add strategy='override'

# Merge multiple JSON arrays into one long array
jq -s 'add' a.json b.json c.json

# Recursively merge multiple JSON objects (jq 1.6+)
jq -s 'reduce .[] as $item ({}; . * $item)' a.json b.json

# Shallow merge: overlay b's top-level keys onto a
jq -s '.[0] * .[1]' a.json b.json

# Merge arrays and keep only deduplicated id fields
jq -s '[.[].items[]] | unique_by(.id)' a.json b.json

FAQ

Troubleshooting

Glossary

JSON Merge

Operation of combining two or more JSON objects into a new one by specified rules. The core challenge is the strategy for resolving key name conflicts.

Deep Merge

Strategy that recursively enters nested objects and merges at each leaf node; recurses only when both sides are plain objects, otherwise falls back to overwrite.

Shallow Merge

Strategy that only merges top-level keys and replaces same-named keys in their entirety; equivalent in JS to `Object.assign({}, a, b)`.

Array Concat

One of the array merge strategies: combines multiple arrays into a long array preserving all element order; often used for API response aggregation.

Array Replace

One of the array merge strategies: same-named arrays are replaced in their entirety with the later input; often used for config override.

Object.assign

Built-in JavaScript method that shallow-copies all enumerable own properties from one or more source objects to a target object; the de-facto standard implementation of shallow merge.

lodash.merge

Deep merge function provided by the Lodash library; the most common deep merge implementation in the Node.js ecosystem; arrays are concatenated, not overwritten.

mergedeep (Python)

Deep merge library in the Python ecosystem (pip install mergedeep); supports a strategy parameter to control array concat vs replace behavior.

jq -s 'add'

jq command that sums multiple JSON arrays into one; merging multiple JSON objects requires `reduce .[] as $item ({}; . * $item)`.

BFF (Backend for Frontend)

Aggregation layer in microservices architecture located between front-end and back-end services; often needs to merge JSON responses from multiple services into a unified response — a classic JSON merge scenario.

4 JSON Merge Strategies Compared

Common JSON Merge Implementations Compared

Authoritative References

• MDNObject.assign - MDN Web Docs
• LodashLodash _.merge official docs
• jqjq manual - reduce and add
• IETFJSON Specification (RFC 8259)