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

yizhihongxing

详解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)
上一篇 2023年5月27日
下一篇 2023年5月27日

相关文章

  • JS输出空格的简单实现方法

    要实现JS输出空格,有多种方法。下面我们介绍两种方法: 方法一:使用HTML中的空格符 HTML中的空格符,即&nbsp;,可以被JS读取并输出。使用这个符号,可以轻易地输出空格,如下所示: <!DOCTYPE html> <html> <head> <title>JS输出空格的方法示例</tit…

    JavaScript 2023年5月28日
    00
  • event.X和event.clientX的区别分析

    那么让我们来详细分析一下“event.X和event.clientX的区别”。 1. 事件对象(event)简介 在JavaScript中,与事件相关的数据都被封装在一个事件对象中,该对象用来携带事件发生时的一些信息,比如事件类型、目标元素、鼠标坐标、键盘按键等。 2. event.X和event.clientX的区别 event.X表示鼠标相对于当前元素的…

    JavaScript 2023年6月11日
    00
  • arrayToJson将数组转化为json格式的js代码

    arrayToJson是一个用于将JavaScript数组转换为JSON格式字符串的JS函数,以下是使用该函数的攻略: 1. 编写arrayToJson函数的JS代码 以下是将数组转换为JSON格式的JavaScript代码,其中的函数arrayToJson接受一个JavaScript数组作为输入参数,并输出一个JSON格式字符串: function arr…

    JavaScript 2023年5月27日
    00
  • JS中input表单隐藏域及其使用方法

    当需要向后台传递某些信息时,可以使用input表单中的隐藏域。那么在JS中,如何创建隐藏域以及如何使用它呢?本文将详细讲解JS中input表单隐藏域的使用方法,帮助您完成这项技能。 创建隐藏域 在JS中创建input表单中用于发送信息的“隐藏域”,首先需要创建一个空的元素,然后通过设置其type为“hidden”来将它转化为隐藏类别。随后,需要给这个元素赋值…

    JavaScript 2023年6月10日
    00
  • javascript 函数及作用域总结介绍

    Javascript 函数及作用域总结介绍 Javascript 函数及作用域是 Javascript 学习中最核心和重要的部分之一,下面我们将深入学习并总结它们的基本知识。 函数(Function) 定义 在 Javascript 中,函数是一种数据类型,可以被执行。函数有两种方式定义,一种是函数声明方式,另一种是函数表达式方式。 函数声明方式 funct…

    JavaScript 2023年5月27日
    00
  • 在JavaScript中使用JSON数据

    在JavaScript中使用JSON数据的完整攻略包括以下几个步骤: 1.了解JSON格式 JSON(JavaScript Object Notation)是一种格式化和交换数据的格式,使用键值对的方式来表示数据,并使用大括号包裹数据。示例: { "name": "张三", "age": 18, &…

    JavaScript 2023年5月27日
    00
  • JavaScript的模块化:封装(闭包),继承(原型) 介绍

    JavaScript的模块化是一种将代码按照一定方式进行组织的方法。在JavaScript中,我们可以使用封装和继承实现模块化。 封装 封装是一种通过闭包实现的模块化方式,可以将一些数据和函数放在一个私有的作用域中,从而避免污染全局变量,同时将一些方法暴露出来,使之成为共有的API。 示例1 下面是一个简单的封装示例,通过IIFE(立即调用的函数表达式)创建…

    JavaScript 2023年6月10日
    00
  • 微信小程序 页面跳转和数据传递实例详解

    微信小程序 页面跳转和数据传递实例详解 一、页面跳转 在微信小程序中,页面跳转有两种方式,分别是: wx.navigateTo:保留当前页面,跳转到应用内的某个页面。可通过wx.navigateBack方法返回到原页面。 wx.redirectTo:关闭当前页面,跳转到应用内的某个页面。不可通过wx.navigateBack方法返回到原页面。 1. wx.n…

    JavaScript 2023年6月11日
    00
合作推广
合作推广
分享本页
返回顶部