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 相关文章推荐
模仿jQuery each函数的链式调用
Jul 22 Javascript
IE不支持getElementsByClassName最终完美解决方案
Dec 17 Javascript
提高jQuery性能的十个诀窍
Nov 14 Javascript
javascript跨域的4种方法和原理详解
Apr 08 Javascript
JS实现在页面随时自定义背景颜色的方法
Feb 27 Javascript
jQuery 插件封装的方法
Nov 16 Javascript
Vue.js组件tree实现无限级树形菜单
Dec 02 Javascript
过期软件破解办法实例详解
Jan 04 Javascript
BootStrap selectpicker后台动态绑定数据的方法
Jul 28 Javascript
微信小程序仿美团城市选择
Jun 06 Javascript
vue+layui实现select动态加载后台数据的例子
Sep 20 Javascript
Vue实现仿iPhone悬浮球的示例代码
Mar 13 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
PHP Header用于页面跳转要注意的几个问题总结
2008/10/03 PHP
smarty 缓存控制前的页面静态化原理
2013/03/15 PHP
PHP检测移动设备类mobile detection使用实例
2014/04/14 PHP
PHP实现获取域名的方法小结
2014/11/05 PHP
php+mysqli预处理技术实现添加、修改及删除多条数据的方法
2015/01/30 PHP
php实现字符串反转输出的方法
2015/03/14 PHP
PHP面向对象之后期静态绑定功能介绍
2015/05/18 PHP
JQuery中操作Css样式的方法
2014/02/12 Javascript
js检测浏览器版本、核心、是否移动端示例
2014/04/24 Javascript
js和jquery中循环的退出和继续学习记录
2014/09/06 Javascript
AngularJS中实现用户访问的身份认证和表单验证功能
2016/04/21 Javascript
JS实现的多张图片轮流播放幻灯片效果
2016/07/22 Javascript
vuejs开发组件分享之H5图片上传、压缩及拍照旋转的问题处理
2017/03/06 Javascript
jQuery滑动效果实现方法分析
2018/09/05 jQuery
实例讲解JavaScript预编译流程
2019/01/24 Javascript
详解基于webpack&amp;gettext的前端多语言方案
2019/01/29 Javascript
vue单页面在微信下只能分享落地页的解决方案
2019/04/15 Javascript
原生JS实现贪吃蛇小游戏
2020/03/09 Javascript
nodejs使用Sequelize框架操作数据库的实现
2020/10/21 NodeJs
Python使用time模块实现指定时间触发器示例
2017/05/18 Python
python监测当前联网状态并连接的实例
2018/12/18 Python
让你Python到很爽的加速递归函数的装饰器
2019/05/26 Python
在Pytorch中使用样本权重(sample_weight)的正确方法
2019/08/17 Python
超实用的 30 段 Python 案例
2019/10/10 Python
python爬虫模拟浏览器的两种方法实例分析
2019/12/09 Python
Python 为什么推荐蛇形命名法原因浅析
2020/06/18 Python
五分钟学会HTML5的WebSocket协议
2019/11/22 HTML / CSS
美国从事品牌鞋类零售的连锁店:Famous Footwear
2016/08/25 全球购物
美国户外烹饪产品购物网站:Outdoor Cooking
2020/01/10 全球购物
简单介绍Object类的功能、常用方法
2013/10/02 面试题
中专毕业自我鉴定
2013/10/16 职场文书
小学教师的个人自我鉴定
2013/10/26 职场文书
人力资源求职信
2014/05/25 职场文书
家长会开场白和结束语
2015/05/29 职场文书
国王的演讲观后感
2015/06/03 职场文书
竞聘开场白方式有哪些?
2019/08/28 职场文书