JSON 序列化

什么是 JSON 序列化

JSON 序列化是将 JavaScript 对象转换为 JSON 字符串的过程。

JSON.stringify()

JSON.stringify()方法可以用于实现 JSON 序列化。

JSON.stringify()方法接受三个参数：

• value：要序列化的值。
• replacer：可选参数，用于过滤和转换结果。
• space：可选参数，用于格式化输出。

JSON.stringify() 方法的实际执行步骤

1. 尝试调用 toJSON() 方法获取返回值，否则使用默认序列化方法。
2. 如果 replacer 参数存在则调用，传入replacer函数的参数是第 1 步返回的值。
3. 对第 2 步返回的值进行序列化。
4. 如果 space 参数存在则格式化输出。

replacer 参数

replacer 参数可以是一个函数，也可以是一个数组。

如果 replacer 参数是一个函数，则该函数会被递归调用，传入两个参数：当前属性的键和值，并返回一个值，如果返回 undefined 则表示忽略该属性。

const mobile = {
  brand: "Samsung",
  model: "Galaxy",
  year: 2021,
};

const mobileStr = JSON.stringify(mobile, (key, value) => {
  switch (key) {
    case "brand":
      return value.toUpperCase();
    case "year":
      return `Y${value}`;
    default:
      return value;
  }
});

console.log(mobileStr); // {"brand":"SAMSUNG","model":"Galaxy","year":"Y2021"}

如果 replacer 参数是一个数组，则只有数组中包含的属性会被序列化。

const book = {
  title: "Professional JavaScript",
  edition: 4,
  read: true,
};

const bookStr = JSON.stringify(book, ["title", "edition"]);
console.log(bookStr); // {"title":"Professional JavaScript","edition":4}

space 参数

space 参数用于格式化输出，可以是一个数字或字符串。

缩进的最大值是 10，缩进的最大字符数也是 10。

如果 space 参数是一个数字，则表示每个级别缩进的空格数。

const cup = {
  color: "red",
  size: "small",
  material: "ceramic",
};

const cupStr = JSON.stringify(cup, null, 2);
console.log(cupStr);
/*
{
  "color": "red",
  "size": "small",
  "material": "ceramic"
}
*/

如果 space 参数是一个字符串，则表示每个级别缩进的字符串。

const car = {
  brand: "Toyota",
  model: "Corolla",
  year: 2020,
};

const carStr = JSON.stringify(car, null, "---");
console.log(carStr);

/*
{
---"brand": "Toyota",
---"model": "Corolla",
---"year": 2020
}
*/

toJSON() 方法

toJSON() 方法是一个特殊的方法，用于自定义对象的 JSON 序列化。

可以在要序列化的对象上自定义 toJSON() 方法，该方法会在调用 JSON.stringify() 方法时被调用，以便自定义对象序列化的返回值。

class Person {
  name = "Alice";
  age = 25;

  toJSON() {
    return {
      name: this.name.toUpperCase(),
      age: this.age,
    };
  }
}

const alice = new Person();
const aliceStr = JSON.stringify(alice);
console.log(aliceStr); // {"name":"ALICE","age":25}