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 相关文章推荐
NiftyCube——轻松实现圆角边框
Feb 20 Javascript
js生成动态表格并为每个单元格添加单击事件的方法
Apr 14 Javascript
Jquery attr()方法 属性赋值和属性获取详解
Apr 15 Javascript
jQuery实现三级菜单的代码
May 09 Javascript
标准的js无缝滚动效果
Aug 30 Javascript
JavaScript轻松创建级联函数的方法示例
Feb 10 Javascript
Vue响应式添加、修改数组和对象的值
Mar 20 Javascript
Vue通过input筛选数据
Oct 26 Javascript
使用clipboard.js实现复制功能的示例代码
Oct 16 Javascript
JS中原始值和引用值的储存方式示例详解
Mar 23 Javascript
vue和webpack安装命令详解
Jun 15 Javascript
jquery插件实现代码雨特效
Apr 24 jQuery
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
WordPress中邮件的一些修改和自定义技巧
2015/12/15 PHP
从父页面读取和操作iframe中内容方法
2009/07/25 Javascript
JS实现一个列表中包含上移下移删除等功能
2014/09/24 Javascript
jquery中EasyUI使用技巧小结
2015/02/10 Javascript
检测一个函数是否是JavaScript原生函数的小技巧
2015/03/13 Javascript
JS模拟键盘打字效果的方法
2015/08/05 Javascript
在Mac OS上安装使用Node.js的项目自动化构建工具Gulp
2016/06/18 Javascript
JavaScript中利用构造器函数模拟类的方法
2017/02/16 Javascript
JS常见算法详解
2017/02/28 Javascript
Javascript前端经典的面试题及答案
2017/03/14 Javascript
Nodejs搭建wss服务器教程
2017/05/24 NodeJs
vue实现点击关注后及时更新列表功能
2018/06/26 Javascript
JavaScript实现的级联算法示例【省市二级联动功能】
2018/12/25 Javascript
vuejs简单验证码功能完整示例
2019/01/08 Javascript
使用原生js编写一个简单的框选功能方法
2019/05/13 Javascript
bootstrap-table+treegrid实现树形表格
2019/07/26 Javascript
使用纯前端JavaScript实现Excel导入导出方法过程详解
2020/08/07 Javascript
如何构建一个Vue插件并生成npm包
2020/10/26 Javascript
python计算书页码的统计数字问题实例
2014/09/26 Python
pycharm执行python时,填写参数的方法
2018/10/29 Python
Python3.4学习笔记之类型判断,异常处理,终止程序操作小结
2019/03/01 Python
pycharm运行scrapy过程图解
2019/11/22 Python
Win10用vscode打开anaconda环境中的python出错问题的解决
2020/05/25 Python
python 将html转换为pdf的几种方法
2020/12/29 Python
加拿大女鞋品牌:ALDO
2016/11/13 全球购物
eharmony澳大利亚:网上约会服务
2020/02/29 全球购物
应届生护士求职信
2013/11/01 职场文书
金融专业推荐信
2013/11/14 职场文书
医学检验专业大学生求职信
2013/11/18 职场文书
村班子对照检查材料
2014/08/18 职场文书
2014统计局民主生活会对照检查材料思想汇报
2014/10/02 职场文书
学校党的群众路线教育实践活动总结材料
2014/10/30 职场文书
财务人员个人工作总结
2015/02/27 职场文书
简历中自我评价范文
2015/03/11 职场文书
社会主义核心价值观主题教育活动总结
2015/05/07 职场文书
2015年清剿火患专项行动工作总结
2015/07/27 职场文书