新手指南:什麼是 JSON?

更新日期: 2024 年 10 月 27 日

JSON 是什麼?

JSON(JavaScript Object Notation)是一種輕量級的資料交換格式,它易於閱讀和撰寫,並且非常適合用於不同應用之間的資料傳遞。

雖然 JSON 的名字包含 “JavaScript”,但它並不是 JavaScript 所特有的格式,幾乎所有的現代編程語言都能讀取和生成 JSON。

簡單來說,JSON 就是用來表示資料的結構,你可以將它想像成一個書面說明,用來描述資料的形式。

因為它的格式簡單明瞭,使得它非常適合應用程式之間的數據交換。

JSON 的格式

JSON 由兩種主要的結構組成:

  1. 物件(Object):以 {} 括住,包含以鍵值對表示的資料。
  2. 陣列(Array):以 [] 括住,包含一組有序的值。

以下是一個典型的 JSON 範例:

{
  "name": "Alice",
  "age": 25,
  "isStudent": false,
  "skills": ["JavaScript", "HTML", "CSS"],
  "address": {
    "city": "New York",
    "zip": "10001"
  }
}
  • 物件:在這個 JSON 中,最外層是一個物件,它由 {} 包圍,裡面包含幾個鍵值對(例如 “name”: “Alice”)。
  • 鍵值對:每個鍵(如 “name”、”age”)和其對應的值(如 “Alice”、25)構成一個鍵值對。
  • 陣列:”skills” 是一個陣列,包含多個技能名稱。
  • 巢狀物件:”address” 是一個物件,包含在主物件之內,這稱為巢狀結構。

JSON 在網頁開發中的應用

API 資料交換

JSON 最常見的應用場景是在API 資料交換中。

當前端應用程式需要從伺服器獲取資料時,通常會使用 API,而這些 API 返回的資料通常是以 JSON 格式表示的。

因為 JSON 結構簡單,易於解析,所以它成為了應用程式之間,交換資料的標準格式。

例如,假設你正在開發一個天氣應用程式,你可以向伺服器發送請求,伺服器會返回包含天氣資訊的 JSON 資料,如:

{
  "city": "Los Angeles",
  "temperature": 28,
  "description": "Sunny"
}

前端應用程式接收到這個 JSON 後,就可以將它解析並顯示在頁面上。

簡單易用的資料結構

JSON 的另一個好處,是它非常適合作為儲存和傳遞資料的結構化格式。

它可以用來描述各種複雜的資料,比如一個包含用戶資訊的物件陣列:

[
  {
    "id": 1,
    "name": "Alice",
    "email": "alice@example.com"
  },
  {
    "id": 2,
    "name": "Bob",
    "email": "bob@example.com"
  }
]

在這個例子中,我們有一個陣列,裡面包含兩個物件,每個物件都包含用戶的基本資訊。

這種結構讓資料的表示和存取變得非常簡單。


如何使用 JSON?

在 JavaScript 中,處理 JSON 主要有兩個常用的方法:

  1. JSON.parse():將 JSON 格式的字串轉換為 JavaScript 物件。
  2. JSON.stringify():將 JavaScript 物件轉換為 JSON 格式的字串。

範例:解析 JSON

假設我們從伺服器獲得了一個 JSON 格式的字串,現在我們想將它轉換為 JavaScript 可以使用的物件:

const jsonString = '{ "name": "Alice", "age": 25 }';
const user = JSON.parse(jsonString);
console.log(user.name); // 輸出 "Alice"

範例:將物件轉換為 JSON

如果我們有一個 JavaScript 物件,需要將它轉換為 JSON 格式來傳送到伺服器:

const user = {
  name: "Bob",
  age: 30
};
const jsonString = JSON.stringify(user);
console.log(jsonString); // 輸出 '{"name":"Bob","age":30}'

JSON vs XML

在 JSON 流行之前,XML(可擴展標記語言)是最常用的資料交換格式。

然而,與 XML 相比,JSON 更加輕量和易於讀寫,這使得它在現代 Web 開發中得到廣泛應用。

  • 可讀性:JSON 的結構更簡單,容易理解,尤其是對初學者而言。
  • 資料解析:JavaScript 可以直接將 JSON 轉換為物件,而 XML 則需要更多的解析步驟。

因此,儘管 XML 在某些應用中仍然存在,但 JSON 已經成為現代 Web 開發中資料交換的主流格式。


小結

JSON 是一種輕量級的資料交換格式,廣泛用於現代 Web 開發中。

它的結構簡單、易於閱讀和撰寫,使得它成為了應用程式之間傳遞資料的理想選擇。

無論是用於 API 資料交換,還是儲存結構化的資料,JSON 都能大大提高開發效率。

希望這篇文章能幫助你理解 JSON 的基本概念,並能在實際的開發中靈活應用它!

如果你想了解更多如何使用 JSON 的例子,隨時可以告訴我!

Similar Posts

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *