详解JSON.stringify()的5个秘密特性

详解JSON.stringify()的5个秘密特性

JSON.stringify() 是将一个 JavaScript 对象或值转换为 JSON 字符串的方法。但是,如果您不了解 JSON.stringify() 的所有“秘密特性”,则无法在实际开发中充分利用它的性能和灵活性。以下是5个最重要的“秘密特性”。

1. JSON.stringify() 可以通过选项参数输出特定的 JSON 字符串格式

在使用 JSON.stringify() 转换对象时,您可以传递一个选项参数(可以是一个对象)。这使您可以修改组合生成的 JSON 字符串的行为。例如,您可以使用选项参数缩进并统一生成的 JSON 字符串中属性/值对的执行方式。以下是一个示例:

const person = {
  name: "Alice",
  age: 30,
  interests: ["coding", "reading"],
  address: {
    city: "Shanghai",
    country: "China"
  }
};

const jsonStr = JSON.stringify(person, null, 2); 
console.log(jsonStr);

这段代码会将 person 对象转换成 JSON 格式,其中第二个参数 null 指定了过滤器函数(这个示例不使用过滤器)。第三个参数 2 指示输出应该使用两个空格的缩进格式,输出的结果如下:

{
  "name": "Alice",
  "age": 30,
  "interests": [
    "coding",
    "reading"
  ],
  "address": {
    "city": "Shanghai",
    "country": "China"
  }
}

2. JSON.stringify() 可以处理“循环引用”的情况

如果您尝试将有循环引用的对象(例如,一个对象引用了一个对象,而前面的对象又引用了后者)编码为 JSON 字符串,您会遇到错误。但是,如果您使用 JSON.stringify(),将对象作为“引用”进行编码,可以避免这个问题,并确保循环引用得到正确处理。以下是一个示例:

const person = {
  name: "Alice",
  friends: []
};

person.friends.push(person);

const jsonStr = JSON.stringify(person); 
console.log(jsonStr);

这段代码会输出以下 JSON 字符串:

{
  "name": "Alice",
  "friends": [
    "[Circular ~]"
  ]
}

注意,这里的 [Circular ~] 表示对该对象的引用。

3. JSON.stringify() 可以替换对象属性的值

您可以提供一个转换函数,该函数将处理对象期望序列化的属性值(例如,剥离一个影响性能的日期对象)。以下是一个示例:

const person = {
  name: "Alice",
  age: 30,
  dateOfBirth: new Date("1993/01/01")
};

const jsonStr = JSON.stringify(person, function replacer(key, value) {
  if (key === "dateOfBirth") {
    return value.getFullYear();
  }
  return value;
}, 2); 
console.log(jsonStr);

这段代码会将 person 对象转换成 JSON 格式,受到转换函数的影响,dateOfBirth 属性的值被替换为出生日期的年份。输出的结果如下:

{
  "name": "Alice",
  "age": 30,
  "dateOfBirth": 1993
}

4. JSON.stringify() 可以序列化函数

JSON.stringify() 没有办法序列化函数。但是,您可以增加一个选项参数,获得函数源代码的序列化字符串。以下是一个示例:

const func = function sayHello() { console.log("Hello, world!"); }
const jsonStr = JSON.stringify(func, function(key, value) {
  if (typeof value === 'function') {
    return value.toString();
  }
  return value;
}, 2);

console.log(jsonStr);

这段代码将输出以下 JSON 字符串:

"function sayHello() { console.log(\"Hello, world!\"); }"

5. JSON.stringify() 可以重写原型的 toJSON 方法

您可以轻松地改写对象原型的 toJSON 方法,以自定义在使用 JSON.stringify() 序列化该对象时的行为。以下是一个示例:

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  toJSON() {
    return {
      name: this.name.toUpperCase(),
      age: this.age
    };
  }
}

const alice = new Person("Alice", 30);
const jsonStr = JSON.stringify(alice, null, 2); 
console.log(jsonStr);

这段代码会将带有 toJSON()Person 类型的对象转换成 JSON 格式。受到 toJSON() 的影响,输出的结果如下:

{
  "name": "ALICE",
  "age": 30
}

总结

JSON.stringify() 不仅能简单地将 JavaScript 对象转化为 JSON 格式字符串,还具有灵活性强,表现力丰富的特性,它可以方便地实现对象的自定义序列化,处理循环引用、json格式控制和函数序列化等问题。

本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:详解JSON.stringify()的5个秘密特性 - Python技术站

(0)
上一篇 3天前
下一篇 3天前

相关文章

  • 在JavaScript中处理字符串之link()方法的使用

    让我详细讲解一下JavaScript中处理字符串之link()方法的使用吧! link() 方法是什么? link() 是字符串对象的方法,它可以生成一个HTML链接标签 (<a>) 用于把指定的字符串转换成可点击的链接。link() 方法具有以下语法: str.link(url) 其中: str:需要生成链接的字符串。 url:链接所指向的UR…

    JavaScript 2天前
    00
  • JavaScript数组Array对象增加和删除元素方法总结

    JavaScript数组Array对象增加和删除元素方法总结 增加元素 push() 方法 可以使用push()方法将元素添加到数组的末尾。 语法: arr.push(item1, item2, …, itemX) 示例: var fruits = ["apple", "banana"]; fruits.push(…

    JavaScript 2天前
    00
  • 一文了解什么是TypeScript?

    一文了解什么是TypeScript? 什么是TypeScript? TypeScript 是一种由微软开发和维护的自由和开源的编程语言,是 JavaScript 的一个超集,在 JavaScript 基础上添加了静态类型和其他特性。TypeScript 在许多方面都可以增强 JavaScript 的能力,并且还可以提高代码的可读性和可维护性。 TypeScr…

    JavaScript 1天前
    00
  • JavaScript小技巧整理篇(非常全)

    JavaScript小技巧整理篇(非常全) 本文整理了一些需要注意的细节和小技巧,以帮助读者更好地理解和使用JavaScript。 一、变量声明 在JavaScript中,变量声明有三种方式:var、let和const。 1.1 let和const let和const是在ES6中引入的新的变量声明方式。let会在当前代码块作用域内声明一个变量,而const会…

    JavaScript 2023年5月17日
    00
  • JavaScript面向对象之七大基本原则实例详解

    JavaScript面向对象之七大基本原则实例详解 本文将向大家介绍面向对象编程的七大基本原则,并结合示例详细讲解这些原则的实现方法。 七大基本原则 单一职责原则(SRP) 单一职责原则是指一个类只应该有一个单一的功能。如果一个类承担了过多的职责,那么这个类就会变得不可控,难以维护,并且不易复用。 开放封闭原则(OCP) 开放封闭原则是指软件实体(类、模块、…

    JavaScript 3天前
    00
  • Unicode中的CJK(中日韩统一表意文字)字符小结

    Unicode中的CJK(中日韩统一表意文字)字符小结 什么是CJK字符 CJK字符是指中文、日文、韩文等东亚文字的一种统称。CJK字符的特点是字形复杂,有很多笔画,而且其中有很多类似的字形。为了便于处理这些东亚文字,Unicode(标准化的字符编码系统)将CJK字符统一编码为一组字符集,称为CJK统一表意字符集。 CJK字符在Unicode中的编码 在Un…

    JavaScript 2023年5月19日
    00
  • JS基于Location实现访问Url、重定向及刷新页面的方法分析

    让我详细讲解一下 “JS基于Location实现访问Url、重定向及刷新页面的方法分析” 的完整攻略。 什么是 Location 对象? Location 对象代表了当前窗口中当前文档的URL,还提供了与URL相关的信息和一些导航功能。它是window对象下的属性,所以可以通过 window.location 或者 location 来访问。 访问URL 获…

    JavaScript 2天前
    00
  • JS中的回调函数实例浅析

    JS中的回调函数实例浅析 什么是回调函数 回调函数是一种在函数执行完毕后,将另一个函数作为参数传递给它,并在后者执行的函数。它的特点是:回调函数是作为参数传递给另一个函数的,当另一个函数执行完毕后,回调函数才会被执行。 回调函数通常用于异步编程中,由于JavaScript是单线程的,异步调用的函数执行完毕后需要得到回调函数的执行结果,以便继续执行后续的代码。…

    JavaScript 2天前
    00
  • JS 文字符串转换unicode编码函数

    当我们需要在JavaScript程序中使用包含非字符文本的字符串时,这些字符必须转换为Unicode编码格式。因此我们需要将字符串文本转换为Unicode格式,这就需要一个JavaScript函数来实现。 以下是一个将字符串文本转换为Unicode编码格式的JavaScript函数: function textToUnicode(text) { var un…

    JavaScript 2023年5月19日
    00
  • javascript中xml操作实现代码

    下面是关于JavaScript中XML操作实现代码的完整攻略。 XML简介 XML是一种被广泛用于Web应用程序中的标记式语言,用于存储和传输数据。XML有很多好处,包括易于阅读和理解,易于自定义,可扩展性强等。 基础知识 在JavaScript中,我们可以使用XMLDOM对象处理XML文档。XMLDOM是一个跨平台的API,可用于处理XML文档。XMLDO…

    JavaScript 2天前
    00