JSON 简介

JSON - 介绍

什么是 JSON？

JSON 是 JavaScript Object Notation 的缩写。它是一种轻量级、基于文本的数据交换格式（data-interchange format），易于人类阅读和编写，也易于机器解析（parse）和生成（generate）。

尽管名字中包含 JavaScript，JSON 是与语言无关的（language-independent）。虽然它使用了 C 家族编程语言（包括 C、C++、C#、Java、JavaScript、Perl、Python）程序员熟悉的约定，但许多编程语言都有可用的解析器（parsers）和库（libraries）。

其主要目的是在服务器（server）和 Web 应用程序（web application）之间传输数据，作为 XML 的替代方案。

JSON 与 JavaScript 对象

JSON 格式在语法上与创建 JavaScript 对象的代码类似。这使得在 JavaScript 中使用 JSON 非常方便。

JSON 字符串可以使用 JSON.parse() 函数轻松转换为原生 JavaScript 对象（解析，parsed）。相反，JavaScript 对象可以使用 JSON.stringify() 函数转换为 JSON 字符串（字符串化，stringified）。

示例：在 JavaScript 中解析 JSON

以下是如何解析表示用户数据的 JSON 字符串：

<!DOCTYPE html>
<html lang="en">
<body>

<h2>Parsing JSON in JavaScript</h2>

<p>User Info:</p>
<div id="userInfo"></div>

<script>
    // A JSON string (e.g., received from an API)
    const jsonString = '{
        "name": "Alice Wonderland",
        "email": "alice@example.com",
        "city": "Fantasy City"
    }';

    try {
        // Parse the JSON string into a JavaScript object
        const userObject = JSON.parse(jsonString);

        // Access the data using object properties
        const userInfoDiv = document.getElementById('userInfo');
        userInfoDiv.innerHTML = `
            Name: ${userObject.name}<br>
            Email: ${userObject.email}<br>
            City: ${userObject.city}
        `;
    } catch (error) {
        console.error("Failed to parse JSON:", error);
        document.getElementById('userInfo').textContent = 'Error loading user data.';
    }
</script>

</body>
</html>

JSON 与 XML 对比

JSON 和 XML 都用于数据交换，并且都易于人类阅读。然而，它们有一些关键区别：

相似之处：

都是人类可读的文本格式。
都支持层级结构（值中包含值）。
都可以被多种编程语言解析和使用。
都可以通过 HTTP 请求获取（例如 fetch API）。

区别：

冗余度 (Verbosity)： JSON 更简洁；它不像 XML 那样使用结束标签。
解析 (Parsing)： 在 JavaScript 中，JSON 解析通常更简单快捷，因为有内置的 JSON.parse() 以及它与 JavaScript 对象字面量（object literals）的紧密关系。XML 需要一个 XML 解析器（parser）。
数组 (Arrays)： JSON 内置支持数组（[]），这对于表示数据列表至关重要。在 XML 中表示列表通常更冗余。
可读性 (Readability)： 对于复杂的嵌套数据，JSON 通常被认为更简洁，更容易阅读。
特性 (Features)： XML 支持命名空间（namespaces）、注释（comments）和属性（attributes），而 JSON 不支持。

为何使用 JSON？

对于现代 Web API 和应用程序（applications），由于以下原因，JSON 通常比 XML 更受欢迎：

简洁性 (Simplicity) 和紧凑性 (Conciseness)： 更少的样板代码（boilerplate）意味着更小的数据大小和更快的传输。
在 JavaScript 中的易用性 (Ease of Use)： 原生解析（JSON.parse()）和序列化（serialization，JSON.stringify()）使其能够与前端代码（front-end code）无缝集成。
数据结构支持 (Data Structure Support)： 可以直接映射到常见的如对象/映射 (objects/maps) 和数组/列表 (arrays/lists) 等数据结构。
性能 (Performance)： 与 XML DOM 操作相比，通常解析速度更快。

Web 开发中使用 JSON 的典型工作流程：

客户端 (浏览器) 从服务器 API 端点（API endpoint）请求数据。
服务器处理请求，检索数据（例如，从数据库）。
服务器将数据格式化为 JSON 字符串。
服务器在 HTTP 响应中将 JSON 字符串发送回客户端。
客户端接收响应，提取 JSON 字符串。
客户端使用 JSON.parse() 将字符串转换为 JavaScript 对象/数组。
客户端使用 JavaScript 数据更新 UI（用户界面）或执行其他操作。