JSON.parse() 全面用法介绍

news2024/11/24 17:50:58

JSON 通常用于与服务端交换数据。在接收服务器数据时一般是字符串。我们可以使用 JSON.parse() 方法将数据转换为 JavaScript 对象。

语法

JSON.parse(text[, reviver])

text:必需, 一个有效的 JSON 字符串。
reviver: 可选,一个转换结果的函数, 将为对象的每个成员调用此函数。如果是一个函数,则规定了原始值如何被解析改造,在被返回之前。
如果从服务端接收的是数组的 JSON 数据,则 JSON.parse 会将其转换为 JavaScript 数组:

例如:

myArr = JSON.parse(this.responseText);
document.getElementById(“demo”).innerHTML = myArr[1];

如果从服务端接收的是 JSON 对象,则 JSON.parse 会将其转换为 JavaScript 对象:

myObj = JSON.parse(this.responseText);
document.getElementById(“demo”).innerHTML = myObj.name;
使用 JSON.parse()
JSON.parse(‘{}’); // {}
JSON.parse(‘true’); // true
JSON.parse(‘“foo”’); // “foo”
JSON.parse(‘[1, 5, “false”]’); // [1, 5, “false”]
JSON.parse(‘null’); // null
JSON.parse(‘1’); // 1

使用 reviver 函数

如果指定了 reviver 函数,则解析出的 JavaScript 值(解析值)会经过一次转换后才将被最终返回(返回值)。更具体点讲就是:解析值本身以及它所包含的所有属性,会按照一定的顺序(从最最里层的属性开始,一级级往外,最终到达顶层,也就是解析值本身)分别的去调用 reviver 函数,在调用过程中,当前属性所属的对象会作为 this 值,当前属性名和属性值会分别作为第一个和第二个参数传入 reviver 中。如果 reviver 返回 undefined,则当前属性会从所属对象中删除,如果返回了其他值,则返回的值会成为当前属性新的属性值。

当遍历到最顶层的值(解析值)时,传入 reviver 函数的参数会是空字符串 “”(因为此时已经没有真正的属性)和当前的解析值(有可能已经被修改过了),当前的 this 值会是 {“”: 修改过的解析值},在编写 reviver 函数时,要注意到这个特例。(这个函数的遍历顺序依照:从最内层开始,按照层级顺序,依次向外遍历)

JSON.parse(‘{“p”: 5}’, function (k, v) {
if(k === ‘’) return v; // 如果到了最顶层,则直接返回属性值,
return v * 2; // 否则将属性值变为原来的 2 倍。
}); // { p: 10 }

JSON.parse(‘{“1”: 1, “2”: 2,“3”: {“4”: 4, “5”: {“6”: 6}}}’, function (k, v) {
console.log(k); // 输出当前的属性名,从而得知遍历顺序是从内向外的,
// 最后一个属性名会是个空字符串。
return v; // 返回原始属性值,相当于没有传递 reviver 参数。
});
// 1
// 2
// 4
// 6
// 5
// 3
// “”

注意事项:

JSON.parse() 不允许用逗号作为结尾,否则会报语法错误。
在这里插入图片描述
代码:

JSON.parse(“[1, 2, 3, 4, ]”);
JSON.parse(‘{“foo” : 1, }’);

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

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

相关文章

SPI协议解析

SPI协议介绍 引言介绍SPI简介物理层协议层通讯的起始和停止信号SPI 模式 优缺点优点缺点 使用例程基于STM32的SPI通信准备硬件连接 软件实现 总结 引言 SPI是串行外设接口的缩写,是一种高速的,全双工,同步的通信总线。由于SPI高速和同步的特…

vite环境变量与模式

环境变量 Vite 在一个特殊的 import.meta.env 对象上暴露环境变量。这里有一些在所有情况下都可以使用的内建变量: import.meta.env.MODE: {string} 应用运行的模式。 import.meta.env.BASE_URL: {string} 部署应用时的基本 URL。他由base 配置项决定。 import.m…

【ESP8266】使用MQTT协议 连接华为云iotDA,实现设备属性上报

相关资料:https://github.com/CQUPTLei/ESP8266 往期文章:【ESP8266】基础AT指令和常用WIF指令 【MQTT 5.0】协议 ——发布订阅模式、Qos、keepalive、连接认证、消息结构 一、华为云iotDA1.1 什么是iotDA1.2 创建 iotDA 产品 二、使用ESP8266上报设备…

【杂谈理解】STM32F10X标准库工程模板

前言 基于STM官网的STM32F10x标准外设库V3.6.0版本,文件的操作流程是参考江科大的。记录下此文方便学习和回忆。文章后也会放置完整的工程文件和意法官网下载STM32F10x标准外设库的压缩包。 流程 到意法官网下载STM32F10x标准外设库的压缩包。先找到压缩包的地址&a…

CMake详解

file文件操作 cmake的file命令_cmake file_物随心转的博客-CSDN博客 set指令 CMake中的set指令详解_cmake set_guanguanboy的博客-CSDN博客 include_directories指令 Cmake命令之include_directories介绍 - 简书 add_subdirectory Cmake命令之add_subdirectory介绍 - 简书…

两台电脑用网线传输文件的一些问题解决

两台电脑用网线传输文件 步骤如下: 一、两台电脑插上网线 网线568A和568B可能没什么影响 二、 ipv4地址配置 两个网线插上电脑会自动生成一个ipv4地址 cmd里使用ipconfig查看 用这个就行了如果不想用自动生成的ip地址 也可以自己配置ipv4地址和网关&#xff08…

升级Nginx

目录 前言 一、升级Nginx 1)首先在官网下载一个新版本的Nginx 2)首先将下载的压缩包进行解包 3)进入已解包的目录中 4)配置安装路径 5)make 6)备份原来Nginx的资源 7)重启Nginx服务 8&#…

面向对象程序设计|运算符重载

题目一:分数的加减乘除(运算符重载) 题目描述: Fraction类的基本形式如下: 要求如下: 1.实现Fraction类;common_divisor()和contracted()函数体可为空,不实现具体功能。 2.编写m…

Qt QPainterPath

作用 为painter设置好绘画路径 成员函数 painter.drawPath() 1,使用当前笔画轮廓; 2,填充path指定的路径绘画出来的图形。 xxx.to() lineTo() moveTo() 使用path作画,一定要先将path的启动移动到需要开始绘画的点,否则默认从 (0&…

【大数据之Hive】十三、Hive-HQL函数之单行函数和高级聚合函数

Hive内置函数:单行函数、聚合函数、炸裂函数、窗口函数。 --查看系统内置函数: show functions;--查看内置函数用法: desc function 函数名;--查看内置函数详细信息: desc function extended 函数名;一、单行函数 单行…

GDB调试大全

嵌入式开发必备工具!!!学就完事了!!! 目录 GDB初使用 准备条件:Makefile,section1.cpp 初步使用命令 启动调试 启动调试别传入参数 附加到进程 逐过程执行 逐语句执行 退出函…

apm装机教程(二):四旋翼

文章目录 前言一、接线二、刷固件三、设置机架四、校准遥控器五、设置遥控开关六、校准传感器七、设置参数 前言 硬件: pix2.4.8 250穿越机 云卓T10遥控 软件: APM4.3.7 QGC MP 一、接线 GPS接gps和i2c口,接收机的p/s口接飞控RCIN 二、刷…

SAP从入门到放弃系列之BOM行项目类别-R类别-Part3

文章目录 一、BOM行项目类别设置二、BOM主数据维护三、参数详解3.1、尺寸大小3.2、尺寸大小单位3.3、公式3.4、所需数量3.5、可变尺寸数量3.6、可变尺寸数量单位 四、测试示例演示:小结 一、BOM行项目类别设置 创建或者更改BOM时,BOM行项目类别选择R&am…

SSM超市库存商品管理系统+jsp【附万字文档(Lun文)】

主要功能 管理员权限登录: ①主页、个人中心:修改密码、个人信息 ②员工管理:可以根据员工姓名、手机号、身份证查询,以及增删改查操作 ③会员管理:可以根据会员姓名、手机号、身份证查询,以及增删改查操作…

【进阶]Java:线程通信(了解)

什么是线程通信? 当多个线程共同操作共享的资源时,线程间通过某种方式互相告知自己的状态,以相互协调,并避免无效的资源争夺。 线程通信的常见模型(生产者与消费者模型) 生产者线程负责生产数据消费者线…

IDE/VS2017社区版安装+Qt部署+旧项目迁移

文章目录 概述安装包获取卸载旧版本安装过程首次使用Qt插件配置和使用插件配置Qt项目创建向导 VS2015项目迁移到VS2017 概述 这几天想开始使用glog这个开源日志库,发现其已经在很大程度上使用C14标准了,而VS2015并不能完全支持该标准。根据一些教程试图…

Java的Set接口及其实现类(面试题)

Set接口中没有额外定义新的方法,使用的都是Collection接口中声明过的方法。 * 1. Set接口的框架:** |----Collection接口:单列集合,用来存储一个一个的对象* |----Set接口:存储无序的、不可重复的数据 --&g…

【Spring】— 应用案例——基于注解的Spring MVC应用

目录 应用案例——基于注解的Spring MVC应用1.搭建项目环境2.修改配置文件3.修改Controller类4.启动项目,测试应用 应用案例——基于注解的Spring MVC应用 为了帮助读者熟悉掌握Spring MVC的核心类和注解的使用,接下来将以注解的方式对入门案例进行改写…

CPU多核一定比单核性能强吗

在一般人的眼中,多核性能肯定比单核强,处理器核心越多越好,但果真如此吗? 许多人认为CPU 内核越多越好。然而,情况并非总是如此。这就是为什么更多内核并非在所有情况下都是好的选择,这不仅仅是因为在芯片…

数据结构——单向链表(万字讲解)

单向链表(又名单链表、线性链表)是链表的一种,其特点是链表的链接方向是单向的,对链表的访问要通过从头部开始,依序往下读取。 //单链表的打印 void SLTPrint(SLTNode* phead) {SLTNode* cur phead;while (cur){pri…