JSON 完全入門指南：從零開始學習 JSON 語法與實際應用
JSON（JavaScript Object Notation）是現代網路開發中最重要的資料交換格式之一。無論您是前端開發者、後端工程師，還是資料分析師，理解和掌握 JSON 都是必備技能。本文將帶您從零開始，全面了解 JSON 的基礎概念、語法規則、實際應用，以及最佳實踐。
🤔 什麼是 JSON？
JSON（JavaScript Object Notation）是一種輕量級的資料交換格式，它易於人類閱讀和編寫，同時也易於機器解析和生成。雖然 JSON 源自 JavaScript，但它已成為一種獨立於程式語言的資料格式，幾乎所有現代程式語言都支援 JSON 的解析和生成。
✨ JSON 的核心特性
- 輕量級：語法簡潔，檔案體積小，傳輸效率高
- 易讀性：採用鍵值對結構，類似自然語言，便於理解
- 語言無關：幾乎所有程式語言都支援 JSON
- 標準化：遵循 RFC 8259 標準，確保一致性
- 廣泛支援：API、配置文件、資料儲存等場景都使用 JSON
JSON vs XML：為什麼選擇 JSON？
在 JSON 出現之前，XML（Extensible Markup Language）是最常用的資料交換格式。相比 XML，JSON 具有以下優勢：
| 特性 | JSON | XML |
|---|---|---|
| 語法複雜度 | ✅ 簡潔 | ❌ 冗長 |
| 檔案大小 | ✅ 較小 | ❌ 較大 |
| 解析速度 | ✅ 快速 | ❌ 較慢 |
| 資料類型支援 | ✅ 原生支援多種類型 | ❌ 所有內容都是字串 |
| 閱讀性 | ✅ 易於閱讀 | ⚠️ 標籤較多，略顯複雜 |
📐 JSON 語法基礎
JSON 的語法規則非常簡單，主要由兩種結構組成：物件（Object）和陣列（Array）。
1️⃣ JSON 物件（Object）
JSON 物件使用大括號 {} 包裹，內部是一組鍵值對（Key-Value Pairs），鍵和值之間用冒號 : 分隔，不同的鍵值對之間用逗號 , 分隔。
{
"name": "張三",
"age": 28,
"isStudent": false,
"email": "[email protected]"
}
- 鍵（Key）必須是字串，且必須用雙引號包裹（不能用單引號）
- 值（Value）可以是字串、數字、布林值、物件、陣列或 null
- 最後一個鍵值對不能有尾隨逗號
2️⃣ JSON 陣列（Array）
JSON 陣列使用方括號 [] 包裹，內部是一組值的有序列表，值之間用逗號 , 分隔。
{
"students": [
"張三",
"李四",
"王五"
],
"scores": [85, 92, 78, 95],
"mixedArray": [
"文字",
123,
true,
null,
{"key": "value"}
]
}
3️⃣ 巢狀結構
JSON 支援任意深度的巢狀結構，物件可以包含陣列，陣列也可以包含物件。
{
"company": "科技公司",
"departments": [
{
"name": "研發部",
"employees": [
{"name": "張三", "role": "工程師"},
{"name": "李四", "role": "設計師"}
]
},
{
"name": "市場部",
"employees": [
{"name": "王五", "role": "市場經理"}
]
}
]
}
🔢 JSON 資料類型詳解
JSON 支援 7 種資料類型，這些類型涵蓋了大多數資料表示需求。
1. 字串（String）
字串必須用雙引號包裹，支援 Unicode 字符和轉義字符。
{
"text": "這是一個字串",
"escaped": "第一行\n第二行",
"unicode": "中文 \u4E2D\u6587"
}
常見轉義字符：\"（雙引號）、\\（反斜線）、\n（換行）、\t（Tab）、\r（回車）
2. 數字（Number）
JSON 支援整數和浮點數，可以使用科學記號。
{
"integer": 42,
"float": 3.14159,
"negative": -273.15,
"scientific": 6.022e23
}
NaN、Infinity 或 -Infinity，這些需要用字串或 null 表示。
3. 布林值（Boolean）
只有兩個值：true 和 false（必須小寫）。
{
"isActive": true,
"isDeleted": false
}
4. 空值（Null）
表示「無值」或「未定義」，使用 null（必須小寫）。
{
"middleName": null,
"previousJob": null
}
5. 物件（Object）
由鍵值對組成的無序集合。
6. 陣列（Array）
值的有序列表。
7. 特殊值
注意：JSON 不支援以下內容：
- ❌ 函式（Function）
- ❌ 日期物件（Date）需轉為字串或時間戳
- ❌ undefined（使用 null 代替）
- ❌ 註解（Comments）
- ❌ 單引號字串（必須用雙引號）
⚠️ 常見錯誤與陷阱
初學者在使用 JSON 時經常會犯以下錯誤，了解這些陷阱可以幫助您避免問題。
❌ 錯誤 1：使用單引號
// ❌ 錯誤
{'name': 'John'}
// ✅ 正確
{"name": "John"}
❌ 錯誤 2：鍵沒有引號
// ❌ 錯誤
{name: "John"}
// ✅ 正確
{"name": "John"}
❌ 錯誤 3：尾隨逗號
// ❌ 錯誤
{
"name": "John",
"age": 30, ← 多餘的逗號
}
// ✅ 正確
{
"name": "John",
"age": 30
}
❌ 錯誤 4：註解
// ❌ 錯誤（JSON 不支援註解）
{
// 這是姓名
"name": "John"
}
// ✅ 正確（移除註解）
{
"name": "John"
}
❌ 錯誤 5：使用 undefined
// ❌ 錯誤
{"value": undefined}
// ✅ 正確
{"value": null}
🌍 實際應用場景
JSON 在現代軟體開發中無處不在，以下是最常見的應用場景。
1️⃣ API 資料交換
幾乎所有現代 Web API（如 RESTful API、GraphQL）都使用 JSON 作為資料交換格式。
// GET /api/users/123 的回應
{
"id": 123,
"username": "john_doe",
"email": "[email protected]",
"profile": {
"firstName": "John",
"lastName": "Doe",
"avatar": "https://example.com/avatar.jpg"
},
"createdAt": "2024-01-15T10:30:00Z"
}
2️⃣ 配置文件
許多應用程式和工具使用 JSON 作為配置文件格式，如 package.json、tsconfig.json、VS Code 設定等。
// package.json 範例
{
"name": "my-project",
"version": "1.0.0",
"dependencies": {
"express": "^4.18.0",
"lodash": "^4.17.21"
},
"scripts": {
"start": "node index.js",
"test": "jest"
}
}
3️⃣ 資料儲存
NoSQL 資料庫（如 MongoDB、CouchDB）使用類似 JSON 的格式（BSON）儲存資料。
4️⃣ 前端狀態管理
React、Vue 等前端框架使用 JSON 格式的資料結構管理應用狀態。
5️⃣ 日誌記錄
結構化日誌（Structured Logging）通常使用 JSON 格式，便於機器解析和分析。
{
"timestamp": "2025-01-27T14:23:45Z",
"level": "ERROR",
"message": "Database connection failed",
"context": {
"host": "db.example.com",
"port": 5432,
"retryCount": 3
}
}
⭐ 最佳實踐建議
1. 保持一致的命名規則
選擇一種命名風格並在整個專案中保持一致：
- camelCase：
firstName、userId（JavaScript 常用） - snake_case：
first_name、user_id（Python、Ruby 常用） - kebab-case：
first-name、user-id（不推薦，需用引號）
2. 使用有意義的鍵名
// ❌ 不好
{"n": "John", "a": 30}
// ✅ 好
{"name": "John", "age": 30}
3. 適當使用巢狀結構
避免過度巢狀（超過 3-4 層），這會降低可讀性和維護性。
4. 驗證 JSON 資料
在生產環境中，始終驗證接收到的 JSON 資料：
- 檢查必要欄位是否存在
- 驗證資料類型
- 檢查數值範圍
- 使用 JSON Schema 定義資料結構
5. 正確處理錯誤
// JavaScript 範例
try {
const data = JSON.parse(jsonString);
// 處理資料
} catch (error) {
console.error('JSON 解析失敗:', error.message);
// 錯誤處理邏輯
}
6. 注意安全性
- 不要直接執行從 JSON 解析的程式碼（避免 XSS 攻擊）
- 驗證資料來源
- 對敏感資料進行加密
- 限制 JSON 檔案大小，防止 DoS 攻擊
7. 格式化與壓縮
- 開發環境：使用格式化（Pretty Print）提高可讀性
- 生產環境：移除空白和換行，減少傳輸大小
🛠️ 工具與資源推薦
線上工具
- JSON 解析器 - 我們的免費線上 JSON 格式化、驗證工具，支援錯誤修正和語法高亮
- JSONLint - JSON 驗證工具
- JSON Schema Validator - 驗證 JSON 是否符合 Schema
程式庫
- JavaScript：內建
JSON.parse()和JSON.stringify() - Python：
json模組 - Java：Jackson、Gson
- C#：Newtonsoft.Json（Json.NET）
學習資源
- JSON 官方網站 - 標準規範和語言支援列表
- RFC 8259 - JSON 官方標準文件
- JSON Schema - 定義 JSON 資料結構的標準
IDE 擴充套件
- VS Code：內建 JSON 支援，推薦安裝 "JSON Tools" 擴充
- IntelliJ IDEA：內建強大的 JSON 編輯功能
- Sublime Text：Pretty JSON 套件
🚀 立即開始使用 JSON
現在您已經掌握了 JSON 的基礎知識，可以開始在實際專案中使用了！如果需要格式化、驗證或調試 JSON 資料，歡迎使用我們的免費線上工具。