JSON.parse() 和 JSON.stringify()的用法

介绍

JSON.parse()JSON.stringify() 是 JavaScript 中用于处理 JSON 格式数据的两个核心方法。

  • JSON.parse(): 用于将 JSON 字符串解析为 JavaScript 对象。
  • JSON.stringify(): 用于将 JavaScript 对象转换为 JSON 字符串。

JSON.parse() 

JSON.parse() 方法将 JSON 字符串解析为 JavaScript 对象。它接受一个 JSON 字符串作为参数,并返回与该字符串对应的 JavaScript 对象。

const jsonString = '{"name": "John", "age": 30}';
const jsonObject = JSON.parse(jsonString);console.log(jsonObject); // { name: 'John', age: 30 }
console.log(jsonObject.name); // John
console.log(jsonObject.age); // 30
JSON.parse('{}') // {}
JSON.parse('true') // true
JSON.parse('null') // null
//该方法也支持数字、布尔值和null三个类型的值,转换出对应的字面值。不支持其他类型。
JSON.parse('"前端"')// '前端'
JSON.parse(null) // null
JSON.parse(111.) // 111
JSON.parse(0x12) // 18
JSON.parse(true) // true
JSON.parse([])// Uncaught SyntaxError: Unexpected end of JSON input
//字符串必须使用双引号,不能使用单引号
JSON.parse('"String"') // 'String'
JSON.parse('\'String\'') // Uncaught SyntaxError: Unexpected token ' in JSON at position 0
//只支持十进制的字符串,但小数点后必须跟上数字
JSON.parse('111') // 111
JSON.parse('0x12')
// Uncaught SyntaxError: Unexpected token x in JSON at position 1
JSON.parse('111.232') // 111.232
JSON.parse('111.')
// Uncaught SyntaxError: Unexpected end of JSON input
....

JSON.stringify()

JSON.stringify() 方法将 JavaScript 对象转换为 JSON 字符串。它接受一个 JavaScript 对象作为参数,并返回对应的 JSON 字符串。

const obj = { name: 'John', age: 30 };
const jsonString = JSON.stringify(obj);console.log(jsonString); // '{"name":"John","age":30}'//基本类型值字符串、数字、布尔值,以及String、Boolean、Number对象值,都会转成原始值字符串输出
JSON.stringify(111) // '111'
JSON.stringify(new String('111')) //'"111"'
JSON.stringify(false) // 'false'
JSON.stringify(Boolean(true)) // 'true'
//基本类型的字符串,转换结果会带双引号。 因为在还原时,双引号会让JavaScript知道是字符串,而不是变量。
JSON.stringify('json') === 'json' // false
JSON.stringify('json') === '"json"' // true
.....

使用场景

  1. 数据传输: 在客户端和服务器之间传输数据时,通常会使用 JSON 格式。你可以使用 JSON.stringify() 将 JavaScript 对象转换为 JSON 字符串,然后通过网络发送到服务器,服务器收到后再使用 JSON.parse() 将 JSON 字符串解析为 JavaScript 对象。

  2. 存储数据: 当需要将 JavaScript 对象保存到本地存储(如浏览器的本地存储或数据库)时,通常需要将其转换为 JSON 格式。这样做可以确保数据的序列化和反序列化过程安全可靠。

  3. 与其他系统交互: 当与其他系统进行交互时,如果它们使用的是 JSON 格式作为数据交换的标准,你需要将 JavaScript 对象转换为 JSON 字符串进行发送,并在接收到数据后将 JSON 字符串解析为 JavaScript 对象。

 

总的来说,JSON.parse()JSON.stringify() 是处理 JSON 格式数据的基本工具,它们在数据传输、存储和与其他系统交互等方面都有广泛的应用。 

我这里只是基本使用,更详细的内容大家可以搜索进行了解。

我也是一个入行比较短的小白,有不对的地方可以指正交流哦!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/6662.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

mac通过termius连接Linux服务器

mac上安装 linux系统 如果有 linux服务器账号密码,那么上一步可忽略; 比如:直接连接阿里云或腾讯云账号 1. 安装termius 链接: https://pan.baidu.com/s/1iYsZPZThPizxqtkLPT89-Q?pwdbw6j 提取码: bw6j 官网 Termius - SSH platform for …

【C++】STL — vector的接口讲解 +详细模拟实现

前言: 本章我们将学习STL中另一个重要的类模板vector… vector是表示可变大小数组的序列容器。就像数组一样,vector也采用的连续存储空间来存储元素。但是又不像数组,它的大小是可以动态改变的本质讲,vector使用动态分配数组来存储它的元素v…

配电室智能巡检机器人

近年来,生产过程高度自动化,各工矿企业关键场所需定期巡检维护。但目前巡检主要靠人工,既耗时费力效率又低,且受环境等因素影响,巡检难以全面规范,隐患或问题易被忽视。在此情况下,如何利用现有…

ElasticSearch02(DSL查询文档,DSL处理结果,RestClient查询,旅游案例,数据聚合)【全详解】

目录 一、DSL查询文档 1. 说明 2. 文本检索 3. 精确查询 4. 地理坐标查询 5. 复合查询 6. 课堂演示 7. 小结 二、DSL处理结果 1. 排序 2. 分页 3. 高亮 4. 课堂演示 5. 小结 三、RestClient查询 1.快速入门 2.match查询 3.精确查询 4.布尔查询 5. 算分函数…

锁相环原理解析

在计算机和嵌入式系统中,常常要用锁相环来倍频,那么,锁相环是如何倍频的,其原理又是什么呢? 目录 1. 锁相环基本概念与构成1.1 鉴相器1.2 低通滤波器1.3 压控振荡器 2. 锁相环如何实现倍频3. 锁相环也会失效&#xff…

【前端学习——正则】

https://www.bilibili.com/video/BV1da4y1p7iZ/?spm_id_from333.337.search-card.all.click&vd_source5cef5968d539682b683e7d01b00ad01b 学习网站 https://github.com/ziishaned/learn-regex/blob/master/translations/README-cn.md

【MySql】FIND_IN_SET 字符串逗号分隔,判断是否包含某字符串

FIND_IN_SET 字符串逗号分隔,判断是否包含某字符串 一、FIND_IN_SET FIND_IN_SET 返回某字符串在一串有逗号组成的字符串集合(SET)中的第几位,不存在时为0 -- 查询结果:4 SELECT FIND_IN_SET( ad, ac,ab,aa,ad )-- 查询结果:0 …

Bookends for Mac:文献管理工具

Bookends for Mac,一款专为学术、研究和写作领域设计的文献管理工具,以其强大而高效的功能深受用户喜爱。这款软件支持多种文件格式,如PDF、DOC、RTF等,能够自动提取文献的关键信息,如作者、标题、出版社等&#xff0c…

在M1芯片安装鸿蒙闪退解决方法

在M1芯片安装鸿蒙闪退解决方法 前言下载鸿蒙系统安装完成后,在M1 Macos14上打开闪退解决办法接下来就是按照提示一步一步安装。 前言 重新安装macos系统后,再次下载鸿蒙开发软件,竟然发现打不开。 下载鸿蒙系统 下载地址:http…

MATLAB实现遗传算法优化第三类生产线平衡问题

第三类生产线平衡问题的数学模型 假设: 工作站数量(m)和生产线节拍(CT)是预设并固定的。每个任务(或作业元素)只能分配到一个工作站中。任务的执行顺序是预先确定的,且不可更改。每…

PHP医疗不良事件上报系统源码 AEMS开发工具vscode+ laravel8 医院安全(不良)事件报告系统源码 可提供演示

PHP医疗不良事件上报系统源码 AEMS开发工具vscode laravel8 医院安全(不良)事件报告系统源码 可提供演示 医院安全不良事件报告系统(AEMS);分为外部报告系统和内部报告系统两类。内部报告系统主要以个人为报告单位&…

Docker私有镜像仓库搭建 带图形化界面的

搭建镜像仓库可以基于Docker官方提供的DockerRegistry来实现。 官网地址:https://hub.docker.com/_/registry 先配置私服的信任地址: # 打开要修改的文件 vi /etc/docker/daemon.json # 添加内容: "insecure-registries":["http://192.…

暴力匹配字符串的升级版算法 —— Kmp算法

文章目录 一、Kmp算法是什么?二、算法分析1.构建next数组2.匹配主串 三、完整代码 一、Kmp算法是什么? 简单来说,KMP(Knuth-Morris-Pratt)算法主要用于解决字符串匹配问题。也就是当你有一个主串(text&…

【C++风云录】数字艺术保护:利用C++和相关工具库实现艺术品修复

让艺术焕发新生:C及其工具库在艺术品修复中的应用 前言 在数字时代,艺术品和文物的保护和修复领域正在经历一场革命。本文将详细介绍如何使用C以及各种相关的工具库,如Artigo、RestoreLib、OpenCV、PCL和Dlib,来实现艺术品和文物…

OceanBase 轻量级数仓关键技术解读

码到三十五 : 个人主页 为了更好地聚合和治理跨域数据,帮助企业用较低的成本快速聚合分析,快速决策,不断的让企业积累的数据产生价值,从全域海量数据抓取,高性能流批处理,元数据血缘治理等等方面…

AI-数学-高中52-离散型随机变量概念及其分布列、两点分布

原作者视频:【随机变量】【一数辞典】2离散型随机变量及其分布列_哔哩哔哩_bilibili 离散型随机变量分布列:X表示离散型随机变量可能在取值,P:对应分布在概率,P括号里X1表示事件的名称。 示例:

QT:QT窗口(一)

文章目录 菜单栏创建菜单栏在菜单栏中添加菜单创建菜单项添加分割线 工具栏创建工具栏设置停靠位置创建工具栏的同时指定停靠位置使用QToolBar类提供的setAllowedAreas函数来设置停靠位置 设置浮动属性设置移动属性 状态栏状态栏的创建在状态栏中显示实时消息在状态栏中显示永久…

AI人才争夺战,华尔街入局:豪掷百万美元年薪抢人

继硅谷之后,华尔街也入局**“AI人才争夺大战”**。 他们的目标非常明确——抢的就是高精尖的AI专家。 △图源:Business Insider 现在这条“街”上,不论是银行、对冲基金还是私募股权公司都已纷纷下场,可谓是豪掷千金&#xff0c…

选择深度学习框架:TensorFlow 2 vs PyTorch

TensorFlow 2 vs PyTorch 选择深度学习框架:TensorFlow 2 vs PyTorchTensorFlow 2概述TensorFlow 2的优点TensorFlow 2的缺点 PyTorch概述PyTorch的优点PyTorch的缺点 选择建议对于选择困难症的人,我给你们的答案——PyTorch选择理由:结论&am…