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

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

一、概要简介

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

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

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

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

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

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

JSON字符串:

JSON对象:

1、将String转化为JSON

2、将JSON转化为String

三、JSON的输出美化

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

我们看下代码:

待美化的JSON:

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

四、JSON字符串的替换

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

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

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

替换后的效果如下:

五、遍历JSON对象和数组

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

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

六、递归遍历JSON对象

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

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

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

递归代码如下:

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

时间: 2017-04-22

JavaScript中对JSON对象的基本操作示例

JSON对象 1.对象的属性: 对象的属性是有键值对组成的,其中key为一个字符串,value可以为任何的Javascript对象. //使用[]设置和获取对象的属性 var obj = new Object(); obj["www.jb51.net"] = "http://www.jb51.net"; alert(obj["www.jb51.net"]); 2.变量既是属性: Javascript引擎在初始化时会构建一个全局对象,所有的变量都是

详解Mysql中的JSON系列操作函数

前言 JSON是一种轻量级的数据交换格式,采用了独立于语言的文本格式,类似XML,但是比XML简单,易读并且易编写.对机器来说易于解析和生成,并且会减少网络带宽的传输. JSON的格式非常简单:名称/键值.之前MySQL版本里面要实现这样的存储,要么用VARCHAR要么用TEXT大文本. MySQL5.7发布后,专门设计了JSON数据类型以及关于这种类型的检索以及其他函数解析. 下面一起来实际操作一下. 创建带有 JSON 字段的表 比如一个'文章'表,字段包括 id.标题 title.标签 t

C# JsonHelper 操作辅助类,拿来直接用

四个主要操作类:JsonConverter .JsonHelper .JsonSplit .AjaxResult 一.JsonConverter: 自定义查询对象转换动态类.object动态类转换json包.json转换object动态类.DataReader转换为Json.DataSet转换为Json.DataTable转成Json.Datatable转换为Json .格式化字符型日期型布尔型.过滤特殊字符等 using System; using System.Collections.Gen

JS操作JSON方法总结(推荐)

JSON概述: JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式.同时,JSON是 JavaScript 原生格式,这意味着在 JavaScript 中处理 JSON数据不需要任何特殊的 API 或工具包. JSON:JavaScript 对象表示法(JavaScript Object Notation). JSON 是存储和交换文本信息的语法.类似 XML. JSON 比 XML 更小.更快,更易解

PHP中SERIALIZE和JSON的序列化与反序列化操作区别分析

本文实例讲述了PHP中SERIALIZE和JSON的序列化与反序列化操作区别.分享给大家供大家参考,具体如下: PHP中SERIALIZE和JSON序列化与反序列化区别是什么呢,对于这个问题我们可以和小编一起来看看,具体的操作细节如下所示. 在PHP中,serialize和json两种方式对一个对象或数组进行序列化或反序列化有什么区别呢? 假设一个对象和一个数组: $web = new stdClass; $web->site = 'tantengvip'; $web->owner = 'tu

json定义及jquery操作json的方法

一.背景 json是一种轻量级数据交换格式,非常利于Java服务与js的交互,本文将介绍json的简单定义和js如何解析json. 二.内容 1.json定义: 简单的json格式为[{"key1":"value1"},{"key2":"value2"}], []代表数组,{}代表数组中的数据对象,key1,key2是一个json对象中的key,一个json中key值唯一,value1,value2,是key键对应的值. 定义

jQuery操作JSON的CRUD用法实例

本文实例讲述了jQuery操作JSON的CRUD用法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  <html xmlns="http://www.w3.org/1999/xht

PHP+JQUERY操作JSON实例

本文实例讲述了PHP+JQUERY操作JSON的方法.分享给大家供大家参考,具体如下: json.html 代码: <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> <title>PHP Json传输数据</title> </head> <script type="te

jQuery操作json常用方法示例

本文实例讲述了jQuery操作json常用方法.分享给大家供大家参考,具体如下: 在项目中经常会用到获取json中的某个值,或者动态的创建一个json对象,今天简单的做了一个通用的js /** * json工具 */ var JsonUtil = (function(){ return { /** * 获取json中的单个值 */ getValue:function(jsonObject,name){ var value = ""; $.each(jsonObject,function

jquery操作select常见方法大全【7种情况】

本文实例讲述了jquery操作select常见方法.分享给大家供大家参考,具体如下: 在前段HTML页面设计中select 下拉框,或者 在 multiple="multiple" 时,表现为列表.经常会在页面上对其进行操作,这些操作不外乎: 1. 得到选中的 select 的 option 的值或者text. 2. 删除选中的 select 的 option. 3. 向select中增加新的option. 4. 得到select option 长度,也就是个数size 5. 清空se

JQUERY操作JSON实例代码

1.jqury如何用ajax的形式调用后台asp.net页面生成的json数据 2.jquery简单的dom操作 3.送本jquery的开发手册给大家(大家慢慢去研究) 准备工作: 首先,我们新建个网站(.net2.0就行). 1.在我们的项目中jquery的js文件. 2.新建一个htm文件,命名为dome.htm吧. 代码如下:(head区的js代码就是实现的全部代码,有详细注释) 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML

jquery操作 iframe的方法

我们先看一下 JQUERY中的对像 contents() 的帮助文件 contents() 概述 查找匹配元素内部所有的子节点(包括文本节点).如果元素是一个iframe,则查找文档内容 示例 描述: 查找所有文本节点并加粗 HTML 复制代码 代码如下: <p>Hello <a href="http://ejohn.org/">John</a>, how are you doing?</p> jQuery 复制代码 代码如下: $(&q

jQuery操作HTML代码方法介绍

html()可以对HTML代码进行操作,类似于元素JavaScript中的innerHTML. 例如: 示例: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"

jQuery操作value值方法介绍

val()可以获取或设置元素的value属性值.语法如下: 示例: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equ

利用js(jquery)操作Cookie的方法说明

Cookie操作是我们在Web开发中经常会用到的功能,以往我们一般是通过javascript实现的.下面这款jquery插件是专门用来进行cookie操作 的,包括cookie的添加.清除.读取--你可以在这款插件的主页下载到它:http://jquery.com/当在页面中引用了jquery文件及该插件文件后,可进行如下操作: 设置cookie设置一个名称为blog,值为css9.net的cookie:$.cookie("blog", "css9.net");设置