JavaScript: JSON.parse()和JSON.stringify() 简介功能

JSON.parse() 和 JSON.stringify() 详解

功能简介

JSON.parse()

将 JSON 字符串转换为 JavaScript 对象

JSON.stringify()

将 JavaScript 值转换为 JSON 字符串

详细属性参数说明

JSON.parse(text[, reviver])

• text：必需，要解析为对象的 JSON 字符串

• reviver：可选，转换结果的函数，可修改解析生成的原始值

JSON.stringify(value[, replacer[, space]])

• value：必需，要转换为 JSON 字符串的值

• replacer：可选，用于转换结果的函数或数组

• space：可选，用于控制缩进的空格数或字符串

使用方法讲解

JSON.parse()

const obj = JSON.parse('{"name":"John", "age":30}');

使用 reviver：

const obj = JSON.parse('{"name":"John", "age":30}', (key, value) => {
  if (key === 'age') return value + 1;
  return value;
});

JSON.stringify()

const json = JSON.stringify({name: "John", age: 30});

使用 replacer：

const json = JSON.stringify({name: "John", age: 30}, ['name']);

使用 space 参数：

const json = JSON.stringify({name: "John", age: 30}, null, 2);

案例内容解析

案例1：解析 JSON 字符串

const jsonStr = '{"name":"Alice","age":25,"hobbies":["reading","coding"]}';
const person = JSON.parse(jsonStr);
console.log(person.name); // 输出: Alice

案例2：转换对象为 JSON 字符串

const user = {
  name: "Bob",
  age: 35,
  isAdmin: true,
  lastLogin: new Date()
};
const json = JSON.stringify(user);
console.log(json); // 输出: {"name":"Bob","age":35,"isAdmin":true,"lastLogin":"2023-05-01T12:00:00.000Z"}

案例3：使用 reviver 函数

const jsonStr = '{"name":"Charlie","birthDate":"1990-01-01"}';
const person = JSON.parse(jsonStr, (key, value) => {
  if (key === 'birthDate') return new Date(value);
  return value;
});
console.log(person.birthDate.getFullYear()); // 输出: 1990

案例4：使用 replacer 数组

const data = {
  id: 1,
  name: "David",
  password: "secret",
  email: "david@example.com"
};
const json = JSON.stringify(data, ['id', 'name', 'email']);
console.log(json); // 输出: {"id":1,"name":"David","email":"david@example.com"}