带你读《现代Javascript高级教程》十八、深入理解JSON.stringify(1)

简介: 带你读《现代Javascript高级教程》十八、深入理解JSON.stringify(1)

十八、深入理解JSON.stringify

引言

在 JavaScript 中,JSON.stringify() 是一个内置函数,用于将 JavaScript 对象转换为 JSON 字符串。JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,广泛用于前后端数据传输和存储。本文将详细介绍 JSON.stringify() 的属性、应用场景,并提供一个完整而优雅的实现,处理循环引用、特殊类型(如日期和正则表达式)以及性能相关的问题。同时,我们还将讨论注意事项和相关引用资料。

1. JSON.stringify() 属性

JSON.stringify() 函数具有以下属性:

replacer

replacer 是一个可选的参数,它可以是一个函数或一个数组。它用于指定需要序列化的对象的属性。当 replacer 是一个函数时,它将被应用于对象的每个属性,可以用来过滤、替换或转换属性的值。当 replacer 是一个数组时,只有数组中包含的属性才会被序列化。

 

示例:

const obj = {
  name: 'John',
  age: 25,
  address: {
    city: 'New York',
    country: 'USA'
  }};
const jsonString = JSON.stringify(obj, ['name', 'age']);
console.log(jsonString);// 输出: {"name":"John","age":25}

space

space 是一个可选的参数,用于控制生成的 JSON 字符串的缩进和格式化。它可以是一个数字表示缩进的空格数,或者是一个字符串表示缩进的字符串。如果 space 是一个非负整数,则每一级缩进使用指定数量的空格;如果 space 是一个字符串,则使用该字符串作为缩进符号。

 

示例:

 

const obj = { name: 'John', age: 25 };
const jsonString = JSON.stringify(obj, null, 2);
console.log(jsonString);// 输出:// {//   "name": "John",//   "age": 25// }

toJSON

 

如果要序列化的对象具有 toJSON() 方法,那么该方法将被调用,以便返回可序列化的值。toJSON() 方法可以在对象中定义,用于自定义对象在序列化过程中的行为。

 

示例:

 

const obj = {
  name: 'John',
  age: 25,
  toJSON: function() {
    return {
      fullName: this.name,
      yearsOld: this.age
    };
  }};
const jsonString = JSON.stringify(obj);
console.log(jsonString);// 输出: {"fullName":"John","yearsOld":25}

2. 应用场景

JSON.stringify() 在以下场景中非常有用:

数据传输

当需要将 JavaScript 对象转换为字符串,以便在网络中传输给后端或其他系统时,可以使用 JSON.stringify() 进行序列化。

 

const obj = { name: 'John', age: 25 };
const jsonString = JSON.stringify(obj);
console.log(jsonString);// 输出: {"name":"John","age":25}

数据存储

如果需要将 JavaScript 对象保存到本地存储(如浏览器的 LocalStorage 或数据库),可以使用 JSON.stringify() 将对象转换为 JSON 字符串后进行存储。

 

const obj = { name: 'John', age: 25 };
const jsonString = JSON.stringify(obj);
localStorage.setItem('user', jsonString);


带你读《现代Javascript高级教程》十八、深入理解JSON.stringify(2)https://developer.aliyun.com/article/1349574?groupCode=tech_library

相关文章
|
4月前
|
机器学习/深度学习 JavaScript 前端开发
JS进阶教程:递归函数原理与篇例解析
通过对这些代码示例的学习,我们已经了解了递归的原理以及递归在JS中的应用方法。递归虽然有着理论升华,但弄清它的核心思想并不难。举个随手可见的例子,火影鸣人做的影分身,你看到的都是同一个鸣人,但他们的行为却能在全局产生影响,这不就是递归吗?雾里看花,透过其间你或许已经深入了递归的魅力之中。
193 19
|
7月前
|
资源调度 JavaScript 前端开发
前端开发必备!Node.js 18.x LTS保姆级安装教程(附国内镜像源配置)
本文详细介绍了Node.js的安装与配置流程,涵盖环境准备、版本选择(推荐LTS版v18.x)、安装步骤(路径设置、组件选择)、环境验证(命令测试、镜像加速)及常见问题解决方法。同时推荐开发工具链,如VS Code、Yarn等,并提供常用全局包安装指南,帮助开发者快速搭建高效稳定的JavaScript开发环境。内容基于官方正版软件,确保合规性与安全性。
6547 24
|
JSON JavaScript 前端开发
JavaScript实现字符串转json对象的方法
JavaScript实现字符串转json对象的方法
|
JavaScript
vue中使用 HotKeys.js 教程(按键响应、快捷键开发)
vue中使用 HotKeys.js 教程(按键响应、快捷键开发)
460 0
|
11月前
|
Web App开发 JavaScript 前端开发
2024年5月node.js安装(winmac系统)保姆级教程
本篇博客为2024年5月版Node.js安装教程,适用于Windows和Mac系统。作者是一名熟悉JavaScript与Vue的大一学生,分享了Node.js的基本介绍、下载链接及简单安装步骤。安装完成后,通过终端命令`node -v`验证版本即可确认安装成功。欢迎关注作者,获取更多技术文章。
390 2
2024年5月node.js安装(winmac系统)保姆级教程
|
存储 JSON JavaScript
js中JSON的使用
介绍JSON的基本概念和在JavaScript中的使用方式,包括JSON格式的语法规则、使用`JSON.stringify()`和`JSON.parse()`方法进行对象与字符串的转换,以及处理JSON数组数据。
js中JSON的使用
|
存储 JSON JavaScript
JavaScript JSON
【10月更文挑战第7天】JSON 是 JavaScript 中非常重要的一个数据格式,它为数据的表示和传输提供了一种简单而有效的方式。掌握 JSON 的使用方法和特点,对于开发高质量的 JavaScript 应用具有重要意义。
|
JavaScript 前端开发
js教程——函数
js教程——函数
269 4
|
JSON JavaScript 前端开发
js如何格式化一个JSON对象?
js如何格式化一个JSON对象?
435 3
|
XML JSON JavaScript
js的json格式
js的json格式

热门文章

最新文章