比較「修正前」與「修正後」，讓改變之處浮現出來——這就是 Diff（差異）。在 Git 的程式碼審查、設定檔備份比較、API 回應對照等開發場景中都會用到。

如何閱讀文字差異 (Diff)：理解行單位與單字單位的比較

本文用具體範例解說閱讀 Diff 的基礎、行單位與單字單位的差異，以及現場實用的用法。

基礎：+ 與 - 的含義

最常見的 unified 格式 Diff 以行首的符號表示變更內容。

 function greet(name) {
-  return "Hello " + name;
+  return `Hello ${name}`;
 }
  • 以 -（紅色）開頭的行是被刪除的行
  • 以 +（綠色）開頭的行是被新增的行
  • 沒有符號的行是未變更的行（作為上下文顯示）

也就是說，「修改」一行時，Diff 會以「刪除舊行、新增新行」這兩行來表示。

行單位 vs 單字單位

Diff 大致有兩種顆粒度。

行單位（line diff）

逐行判定「相同或不同」。適合程式碼與設定檔的比較。缺點是即使只改了一行中的一個字，也會顯示為「整行變更」，無法看出是哪個單字改變。

單字／字元單位

會高亮顯示行中哪個部分改變。在文章校對、比較長的單行（如壓縮的 JSON）時特別有威力。

舉例來說，考慮以下變更：

變更前：價格為未稅 1000 元
變更後：價格為含稅 1100 元

行單位只會告訴你「這一行改變了」，但單字單位會只高亮「未稅→含稅」「1000→1100」兩處，讓改變一目了然。

空白與換行符號的陷阱

有時 Diff 會顯示「全部行都改變了」，令人驚訝。原因多半是看不見的差異。

  • 換行符號：Windows 的 CRLF 與 Unix 的 LF 混用，會使每一行都被視為差異。
  • 縮排：Tab 與空格的差異，或行尾多餘的空格。
  • 全形與半形空格：看起來幾乎相同，卻是不同的字元。

若只想看有意義的變更，開啟 Diff 工具的「忽略空白」選項，即可只擷取本質上的差異。反之，當空白本身很重要時（如某些設定檔），請維持關閉。

實務用法

  • 程式碼審查前的自我檢查：提交前重看變更點，找出忘了刪的除錯程式碼或非預期的變更。
  • 比較設定檔：把可運作與無法運作環境的 .env 或設定檔並列，從差異中找出原因。
  • 對照 API 回應：比較期望的 JSON 與實際回應，找出缺少的欄位（單行 JSON 先格式化再比較較易讀）。
  • 文章校對：以單字單位比較編輯前後的稿件，確認改了哪裡。

機密資料請在本地比較

設定檔與日誌可能含有 API Key 或個資。將這類資料貼到外部線上服務並不可取。文字差異比較工具 在你的瀏覽器內完成處理，不會將輸入資料傳送到伺服器。打開 Network 分頁進行比較時，可以確認沒有任何請求送出。

常見問題

為什麼只改一行卻產生兩行的差異？

因為 Diff 把「變更」表示為「刪除＋新增」。原本的行顯示為 -，新的行顯示為 +，所以一行的修改看起來像兩行。切換到單字單位比較，即可只高亮實際改變的部分。

差異顯示所有行都變了。

這通常是換行符號（CRLF 與 LF）的差異、行尾空白，或縮排的 Tab／空格混用所致。請試試「忽略空白」選項，或事先統一換行符號。

大型檔案也能比較嗎？

在瀏覽器內處理的工具，遇到極大的檔案時動作可能變慢。此時請只擷取需要比較的範圍，或搭配使用命令列的 diff 或 git diff。對日常的程式碼與設定檔比較而言，瀏覽器工具已相當實用。