3分钟掌握常用的JS操作JSON方法总结


Posted in Javascript onApril 25, 2017

工作中做了几款自动化测试工具都是跟日志读取相关,日志格式又大多数都是JSON,所以这里把常用的JS操作JSON的方法做了总结~~

一、概要简介

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,同时,JSON是 JavaScript 原生格式,这意味着在 JavaScript 中处理 JSON数据不须要任何特殊的 API 或工具包。

在JSON中,有两种结构:对象和数组

1、对象以“{”开始,“}”结束,“key/value”之间运用 “,”分隔。

3分钟掌握常用的JS操作JSON方法总结 

2、数组以“[”开始,“]”结束。值之间运用 “,”分隔。

3分钟掌握常用的JS操作JSON方法总结 

二、JSON对象和JSON字符串的转换

在数据传输过程中,JSON是以字符串的形式传递的,而JS操作的是JSON对象,所以,JSON对象和JSON字符串之间的相互转换是关键。如下:

JSON字符串:

3分钟掌握常用的JS操作JSON方法总结 

JSON对象:

3分钟掌握常用的JS操作JSON方法总结 

1、将String转化为JSON

3分钟掌握常用的JS操作JSON方法总结 

2、将JSON转化为String

3分钟掌握常用的JS操作JSON方法总结 

三、JSON的输出美化

上一节我们讲到了将JSON对象转化为JSON字符串可以用JSON.stringify() 方法,stringify还有个可选参数space(1<=space<=10),可以指定缩进的空格数,用于美化输出;

3分钟掌握常用的JS操作JSON方法总结 

我们看下代码:

3分钟掌握常用的JS操作JSON方法总结 

待美化的JSON:

3分钟掌握常用的JS操作JSON方法总结 

美化后的输出,是不是看得更清晰了:

3分钟掌握常用的JS操作JSON方法总结 

四、JSON字符串的替换

日志处理中常常有这样的字符串,如下:

3分钟掌握常用的JS操作JSON方法总结 

需要经过替换后,才能变成标准的JSON字符串格式,从而转化成JSON对象。这里我们需要用JS实现replaceAll的功能,将所有的 ' \\" ' 替换成  ' " ' 。

代码如下,这里的gm是固定的,g表示global,m表示multiple:

3分钟掌握常用的JS操作JSON方法总结 

替换后的效果如下:

3分钟掌握常用的JS操作JSON方法总结 

五、遍历JSON对象和数组

1、遍历JSON对象,代码如下:

3分钟掌握常用的JS操作JSON方法总结 

2、遍历JSON数组,代码如下:

3分钟掌握常用的JS操作JSON方法总结 

六、递归遍历JSON对象

为了实现一些复杂功能常常需要递归遍历JSON对象,这里给出一个递归的例子,希望能给大家作为参考。

例子中要求处理JSON字符串,遇到数组的时候,数组中有超过一个对象,删除第一个对象之后的所有对象,假设原始JSON如下:

3分钟掌握常用的JS操作JSON方法总结 

要求处理后的数组中只保留第一个对象,处理完成后应该如下图所示:

3分钟掌握常用的JS操作JSON方法总结 

递归代码如下:

3分钟掌握常用的JS操作JSON方法总结 

以上所述是小编给大家介绍的3分钟掌握常用的JS操作JSON方法总结,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
网页常用特效代码整理
Jun 23 Javascript
JavaScript 模拟用户单击事件
Dec 31 Javascript
jQuery boxy弹出层插件中文演示及使用讲解
Feb 24 Javascript
禁用页面部分JavaScript方法的具体实现
Jul 31 Javascript
常用的JavaScript验证正则表达式汇总
Nov 26 Javascript
js生成验证码并直接在前端判断
May 15 Javascript
js实现Select头像选择实时预览代码
Aug 17 Javascript
ES6中如何使用Set和WeakSet
Mar 10 Javascript
JavaScript reduce和reduceRight详解
Oct 24 Javascript
jQuery实现鼠标点击处心形漂浮的炫酷效果示例
Apr 12 jQuery
JS+HTML5 Canvas实现简单的写字板功能示例
Aug 30 Javascript
js屏蔽退格键(backspace或者叫后退键与F5)
Feb 10 Javascript
vue.js父组件使用外部对象的方法示例
Apr 25 #Javascript
ES6学习笔记之正则表达式和字符串正则方法分析
Apr 25 #Javascript
Javascript中类式继承和原型式继承的实现方法和区别之处
Apr 25 #Javascript
整理一些最近经常遇到的前端面试题
Apr 25 #Javascript
Vue.js 2.0学习教程之从基础到组件详解
Apr 24 #Javascript
js实现延迟加载的几种方法
Apr 24 #Javascript
利用Vue.js+Node.js+MongoDB实现一个博客系统(附源码)
Apr 24 #Javascript
You might like
漫威DC即将合作联动,而双方早已经秘密开始
2020/04/09 欧美动漫
无线电广播的开始
2002/01/30 无线电
S900/ ETON E1-XM 收音机
2021/03/02 无线电
PHP原生函数一定好吗?
2014/12/08 PHP
smarty模板引擎中内建函数if、elseif和else的使用方法
2015/01/22 PHP
php上传文件并存储到mysql数据库的方法
2015/03/16 PHP
怎样搭建PHP开发环境
2015/07/28 PHP
PHP常用文件操作函数和简单实例分析
2016/06/03 PHP
YII2框架中日志的配置与使用方法实例分析
2020/03/18 PHP
JQuery实现用户名无刷新验证的小例子
2013/03/22 Javascript
javascript调试过程中找不到哪里出错的可能原因
2013/12/16 Javascript
jQuery悬停文字提示框插件jquery.tooltipster.js用法示例【附demo源码下载】
2016/07/19 Javascript
jQuery自制提示框tooltip改进版
2016/08/01 Javascript
Vue.js每天必学之构造器与生命周期
2016/09/05 Javascript
第一次接触Bootstrap框架
2016/10/24 Javascript
NodeJS设计模式总结【单例模式,适配器模式,装饰模式,观察者模式】
2017/09/06 NodeJs
Nodejs 和 Electron ubuntu下快速安装过程
2018/05/04 NodeJs
详解JavaScript的数据类型以及数据类型的转换
2019/04/20 Javascript
javascript设计模式 ? 抽象工厂模式原理与应用实例分析
2020/04/09 Javascript
JS出现404错误原理及解决方案
2020/07/01 Javascript
pygame学习笔记(2):画点的三种方法和动画实例
2015/04/15 Python
Python实现基本线性数据结构
2016/08/22 Python
Python自然语言处理 NLTK 库用法入门教程【经典】
2018/06/26 Python
对python 命令的-u参数详解
2018/12/03 Python
keras模型可视化,层可视化及kernel可视化实例
2020/01/24 Python
Python 如何测试文件是否存在
2020/07/31 Python
python tqdm实现进度条的示例代码
2020/11/10 Python
基于python的opencv图像处理实现对斑马线的检测示例
2020/11/29 Python
法国珠宝店:CLEOR
2017/01/29 全球购物
澳大利亚和新西兰最大的在线旅行社之一:Aunt Betty
2019/08/07 全球购物
餐厅总经理岗位职责
2013/12/31 职场文书
学生期末评语大全
2014/04/30 职场文书
影子教师研修方案
2014/06/14 职场文书
初中生散播谣言检讨书
2014/11/17 职场文书
大学社团活动总结怎么写
2019/06/21 职场文书
Python如何把不同类型数据的json序列化
2021/04/30 Python