JSON 合併

相關推薦

什麼是 JSON 合併（JSON Merge）？

適用場景

• 合併多個微服務 API 響應為統一的 JSON 結構供前端使用
• 聚合 base / dev / prod 多層設定檔，按環境覆蓋生成最終設定
• 把多個 i18n 翻譯檔案按語言合併、去重、補全成完整字典
• 把多個 mock 資料陣列或多個分頁 API 響應合併為完整資料集
• 前端元件合併預設設定 + 使用者自訂設定 + 遠端 A/B 實驗設定
• 資料遷移中合併多個源系統的 JSON 匯出檔案，統一為下游格式

使用方法

1. 將 2 到 N 段需要合併的 JSON 依次貼到左側輸入框（預設 2 個），或點擊「+」新增更多輸入
2. 在工具列下拉框中選擇合併策略：深度合併（Deep）/ 淺層合併（Shallow）/ 陣列拼接（Array Concat）/ 陣列替換（Array Replace）
3. 點擊「合併」按鈕，右側輸出框會顯示合併後的格式化結果；如輸入有語法錯誤會顯示具體行號和報錯資訊
4. 確認結果無誤後點擊「複製」把合併結果放入剪貼簿，或點擊「下載」儲存為 merged.json 檔案繼續做格式化、Schema 校驗等後續處理

功能特點

• 4 種合併策略：深度合併 / 淺層合併 / 陣列拼接 / 陣列替換，可一鍵切換滿足不同業務場景
• 支援 2 到 N 段 JSON：預設 2 個輸入框，可點「+」動態新增更多源 JSON，靈活適配多源聚合
• 深度遞迴合併：智慧處理多層巢狀物件，對葉子節點衝突按指定策略處理，保留所有有效欄位
• 靈活衝突解決：頂層衝突時按所選策略執行；巢狀物件衝突時進入深層合併；陣列衝突時按 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 Web 文件
• LodashLodash _.merge 官方文件
• jqjq 官方手冊 - reduce 與 add
• IETFJSON 官方規範 (RFC 8259)