跳到主要内容

JavaScript 与 JSON

提示
  1. JSON基本概念：JSON（JavaScript Object Notation）是一种基于文本的数据格式，用于存储和传输数据，包含以键值对形式组织的数据。
  2. JSON与JavaScript对象的区别：虽然JSON语法类似于JavaScript对象字面量，但JSON的键必须用双引号，且不能包含函数，而JavaScript对象的键可以不用双引号，且可以包含函数。
  3. JSON的转换和应用：可以使用JSON.parse()将JSON转换为JavaScript对象，使用JSON.stringify()将JavaScript对象转换为JSON格式。JSON广泛用于服务器与客户端间的数据交换。

JSON 代表 JavaScript 对象表示法。JSON 是一种基于文本的数据格式，用于存储和传输数据。例如，

// JSON 语法
{
 "name": "John",
 "age": 22,
 "gender": "male",
}

在 JSON 中，数据以 键/值 对的形式存在，用逗号 , 分隔。

JSON 源自 JavaScript。因此，JSON 语法类似于 JavaScript 对象文字语法。然而，JSON 格式也可以被其他编程语言访问和创建。

注意：JavaScript 对象和 JSON 不是一回事。你将在本教程后面了解它们的区别。

JSON 数据​

JSON 数据由类似于 JavaScript 对象属性的 键/值 对组成。键和值用双引号写成，用冒号 : 分隔。例如，

// JSON 数据
"name": "John"

注意：JSON 数据要求键使用双引号。

JSON 对象​

JSON 对象写在大括号 { } 里。JSON 对象可以包含多个 键/值 对。例如，

// JSON 对象
{ "name": "John", "age": 22 }

JSON 数组​

JSON 数组写在方括号 [ ] 里。例如，

// JSON 数组
["apple", "mango", "banana"][
  // 包含对象的 JSON 数组
  ({ name: "John", age: 22 },
  { name: "Peter", age: 20 },
  { name: "Mark", age: 23 })
];

注意：JSON 数据可以包含对象和数组。然而，与 JavaScript 对象不同，JSON 数据不能包含函数作为值。

访问 JSON 数据​

你可以使用点表示法来访问 JSON 数据。例如，

// JSON 对象
const data = {
  name: "John",
  age: 22,
  hobby: {
    reading: true,
    gaming: false,
    sport: "football",
  },
  class: ["JavaScript", "HTML", "CSS"],
};

// 访问 JSON 对象
console.log(data.name); // John
console.log(data.hobby); // { gaming: false, reading: true, sport: "football"}

console.log(data.hobby.sport); // football
console.log(data.class[1]); // HTML

我们使用 . 表示法来访问 JSON 数据。其语法是：variableName.key

你也可以使用方括号语法 [] 来访问 JSON 数据。例如，

// JSON 对象
const data = {
  name: "John",
  age: 22,
};

// 访问 JSON 对象
console.log(data["name"]); // John

JavaScript 对象与 JSON 的比较​

尽管 JSON 的语法与 JavaScript 对象相似，但 JSON 与 JavaScript 对象是不同的。

JSONJavaScript 对象
键/值对中的键必须用双引号括起来。键/值对中的键可以不用双引号。
JSON 不能包含函数。JavaScript 对象可以包含函数。
JSON 可以被其他编程语言创建和使用。JavaScript 对象只能在 JavaScript 中使用。

将 JSON 转换为 JavaScript 对象​

你可以使用内置的 JSON.parse() 函数将 JSON 数据转换为 JavaScript 对象。例如，

// json 对象
const jsonData = '{ "name": "John", "age": 22 }';

// 转换为 JavaScript 对象
const obj = JSON.parse(jsonData);

// 访问数据
console.log(obj.name); // John

将 JavaScript 对象转换为 JSON​

你也可以使用 JavaScript 内置的 JSON.stringify() 函数将 JavaScript 对象转换为 JSON 格式。例如，

// JavaScript 对象
const jsonData = { name: "John", age: 22 };

// 转换为 JSON
const obj = JSON.stringify(jsonData);

// 访问数据
console.log(obj); // "{"name":"John","age":22}"

JSON 的使用​

JSON 是用于从服务器传输数据（数据交换）到客户端以及反之的最常用格式。JSON 数据非常容易解析和使用。访问和操作 JSON 数据非常快，因为它们只包含文本。

JSON 是语言无关的。你也可以在其他编程语言中创建和使用 JSON。

最后于 更新