JSON相关知识汇总


Posted in Javascript onJuly 03, 2015

JSON:JavaScript 对象表示法(JavaScript Object Notation)

JSON 语法规则

数据在名称/值对中

数据由逗号分隔

花括号保存对象

方括号保存数组

JSON有6种类型的值:

对象、数组、字符串、数字、布尔值、null

JSON对象是一个容纳“名/值”对的无序集合

名字:任意字符串

值:任意类型的JSON值,包括数组和对象(对象中可以嵌入对象)
注:JSON字符串必须使用双引号(单引号会报错)

一、对象

javascript中创建字面量:

var object = {
  name:"lily",
  age:22
};

或者:

var object = {
  "name":"lily",
  "age":22
};

JSON:

{
  "name":"lily",
  "age":22
}

二、数组

JSON数组采用的是javascript中数组字面量形式
扩展:

把数组和对象结合起来可以构成更复杂的数据结合
例如:

[
  {
    "name":"lily",
    "age":22,
    "job":"docter"
  },
  {
    "name":"nicy",
    "age":21,
    "job":"teacher"
  },
  {
    "name":"lily",
    "age":22,
    "job":"AE"
  }
]

三、解析与序列化

JSON拥有和javascript类似的语法,可以把JSON数据结构解析为有用的javascript对象

1.JSON对象

收发JSON数据

读取、写入、发送和接收JSON数据对象时,需要转换成字符串,并能从字符串转换为JSON数据对象。(用于javascript相同的方式读写他们)

JSON对象有两个方法:

① stringify(): 把javascript对象序列化为JSON字符串

② parse(): 把JSON字符串解析为原生的javascript值

实例:

var book = {
  title:"professional JavaScript",
  authors:[
    "lily"
  ],
  edition:3,
  year:2011
};
var jsonText = JSON.stringify(book);
alert(jsonText);   //{"title":"professional JavaScript","authors":["lily"],"edition":3,"year":2011}
alert(typeof jsonText);   //string
var bookCopy = JSON.parse(jsonText);
alert(typeof bookCopy);   //object 

这个例子中使用JSON.stringify()把一个javascript对象book序列化为一个JSON字符串,然后保存到jsonText中;将JSON字符串jsonText直接传给JSON.parse()就得到了相应的javascript值

注:序列化javascript对象时,最终值都是有效JSON数据类型的实例属性,任何无效的值都会被跳过

2.序列化选项

JSON.stringify()在序列化javascript对象时,可以接收两个参数

参数一:过滤器,可以是一个数组或函数

参数二:一个选项,表示是否在JSON字符串中保留缩进
1)过滤结果
如果过滤器的参数是数组,那么JSON.stringify()的结果中只包含数组中列出的属性
例如:

var book = {
  "title":"professional JavaScript",
  "authors":[
    "lily"
  ],
  edition:3,
  year:2011
}; 
var jsonText = JSON.stringify(book,["title","edition"]);
alert(jsonText); //{"title":"professional JavaScript","edition":3}
alert(typeof jsonText); // string

2)字符串缩进:
JSON.stringify()方法的第三个参数用于控制结果中的缩进和空白符
3)toJSON()方法
给对象定义toJSON()方法,可以返回其自身的JSON数据格式

四、JSON访问值

第一种:简单数组
['item1','item2','item3']
取值:通过数字索引访问嵌入的值(第一项的索引为0)

['item1','item2','item3']
var items = ['item1','item2','item3'];
alert(items[0]);     // item1

第二种:使用{}表示对象和符合数组
{ "key":"value" }
取值:通过键名访问嵌入的值

var oExample = { "name":"lily" };
alert(oExample.name);     // lily
alert(oExample["name"]);     // lily

使用这两种方式,可以用子记录(带命名的或数值的索引键)描述很多数据结构:

例如:

var oNovelist = {
  "firstName":"lily",
  "lastName":"russ",
  "novels":
      [
        {
          "title":"and choas died",
          "year":"1970"
        },
        {
          "title":"the famale man",
          "year":"1976"
        }
      ]
}; 
var msg = oNovelist.firstName+" "+oNovelist.lastName+"'s"+" "+oNovelist.novels[0].title+" "+"was published in"+oNovelist.novels[0].year;
alert(msg);   // lily russ's and choas died was published in1970

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
跟着JQuery API学Jquery 之三 筛选
Apr 09 Javascript
jquery 元素相对定位代码
Oct 15 Javascript
js获取GridView中行数据的两种方法 分享
Jul 13 Javascript
JS获取鼠标坐标的实例方法
Jul 18 Javascript
JQuery判断子iframe何时加载完成解决方案
Aug 20 Javascript
jquery图片播放浏览插件prettyPhoto使用详解
Dec 19 Javascript
解决bootstrap中modal遇到Esc键无法关闭页面
Mar 09 Javascript
使用jQuery的toggle()方法对HTML标签进行显示、隐藏的方法(示例)
Sep 01 Javascript
HTML Table 空白单元格补全的简单实现
Oct 13 Javascript
JavaScript数据结构与算法之队列原理与用法实例详解
Nov 22 Javascript
详解Node 定时器
Feb 26 Javascript
vue3.0中使用element的完整步骤
Mar 04 Vue.js
javascript表格的渲染组件
Jul 03 #Javascript
解决jquery实现的radio重新选中的问题
Jul 03 #Javascript
移动端JQ插件hammer使用详解
Jul 03 #Javascript
jQuery+AJAX实现无刷新下拉加载更多
Jul 03 #Javascript
Javascript实现字数统计
Jul 03 #Javascript
JavaScript获取表格(table)当前行的值、删除行、增加行
Jul 03 #Javascript
jQuery中 delegate使用的问题
Jul 03 #Javascript
You might like
php object转数组示例
2014/01/15 PHP
PHP5多态性与动态绑定介绍
2015/04/03 PHP
用php定义一个数组最简单的方法
2019/10/04 PHP
JSON.parse 解析字符串出错的解决方法
2010/07/08 Javascript
javascript最常用与实用的创建类的代码
2010/08/12 Javascript
jquery 实现窗口的最大化不论什么情况
2013/09/03 Javascript
escape函数解决js中ajax传递中文出现乱码问题
2014/10/30 Javascript
javascript实现当前页导航激活的方法
2015/02/27 Javascript
js实现文本框选中的方法
2015/05/26 Javascript
在WordPress中加入Google搜索功能的简单步骤讲解
2016/01/04 Javascript
jquery.Jcrop结合JAVA后台实现图片裁剪上传实例
2016/11/05 Javascript
jQuery插件FusionCharts实现的3D柱状图效果实例【附demo源码下载】
2017/03/03 Javascript
js 毫秒转天时分秒的实例
2017/11/17 Javascript
layDate日期控件使用方法详解
2018/11/15 Javascript
express如何解决ajax跨域访问session失效问题详解
2019/06/20 Javascript
JavaScript实现五子棋游戏的方法详解
2019/07/08 Javascript
addEventListener()和removeEventListener()追加事件和删除追加事件
2020/12/04 Javascript
[54:08]LGD女子刀塔学院 DOTA2炼金术士教学
2014/01/09 DOTA
[07:03]显微镜下的DOTA2第九期——430圣堂刺客杀戮秀
2014/06/20 DOTA
[01:28:31]《加油DOTA》真人秀 第五期
2014/09/01 DOTA
[56:48]FNATIC vs EG 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
[03:01]完美盛典趣味短片 DOTA2年度最佳&拉胯英雄
2019/12/07 DOTA
python实现批量转换文件编码(批转换编码示例)
2014/01/23 Python
通过代码实例展示Python中列表生成式的用法
2015/03/31 Python
Python 详解基本语法_函数_返回值
2017/01/22 Python
Python实现分段线性插值
2018/12/17 Python
基于python实现获取网页图片过程解析
2020/05/11 Python
python实现银行账户系统
2021/02/22 Python
Html5饼图绘制实现统计图的方法
2020/08/05 HTML / CSS
社区道德讲堂实施方案
2014/03/21 职场文书
交通安全寄语大全
2014/04/08 职场文书
安全生产演讲稿
2014/05/09 职场文书
简爱电影观后感
2015/06/10 职场文书
2015国庆节放假通知范文
2015/07/30 职场文书
Java实现聊天机器人完善版
2021/07/04 Java/Android
SQL CASE 表达式的具体使用
2022/03/21 SQL Server