JSON

[刘鑫婷]

JSON
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
开发工具与关键技术：Visual Studio 2015与jQuery
作者：子衿
撰写时间：2019年5月8日
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
一、JSON简介
1、总的来说，JSON是JavaScript对象的一种表示法（JavaScript Object Notation）。
2、JSON是存储和交换文本信息的一种语法。它是一种轻量级的文本数据交换的格式；它独立于语言和平台，以及具有自我描述性并且更易于理解。
3、JSON与XML相类似，但它比XML更小、更快、更易于解析。我们要着重注意的是它是使用数组的，而且不使用保留字的。其中，XML是指可扩展的一门标记语言；它主要是被用来设计传输和存储数据。
4、简单来说，JSON语法是JavaScript对象表示语法的子集。它具有以下四种特点：
（1）数据是存储在名称/值队中的（数据存储在键值对中）；
（2）数据与数据之间是由逗号分隔开的；
（3）JSON语法中的花括号（{}）保存的是对象；
（4）JSON语法中的方括号（[]）保存的是数组；
5、JSON语法中的值由数字（整数或浮点数）、字符串（在双引号中）、数组（在方括号中）、对象（在花括号中）、逻辑值（true或false）、null组成。
6、JSON对象是在花括号中书写的，它可以包括多个键值对。它跟JS对象的区别分别是：
（1）没有声明变量（在JSON中是没有变量的概念的）；
（2）末尾无分号（因为它不是JavaScript语句，所以不需要分号做结束标签）。
例如一组简单的JSON对象以及JS对象：
JSON对象是这样的:{“name”:”lisi”,”sex”:”男”,”age”:20}
而JS对象是这样的:var ren={“name”:”lisi”,”sex”:”男”,”age”:20};
但我们要记住，无论什么时候，JSON对象的属性名都必须要加上双引号。
7、JSON数组是在方括号中书写的，它可以包括多个对象。与JSON对象一样，JSON数组也是没有声明变量以及末尾是没有分号的。
8、当我们把数组和对象结合起来时，可以构成更为复杂的数据结构（数据集合）。例如：表格渲染；
TabAchieveInfor = layuiTable.render({
elem: “#tabAchieveInfor”,//table的ID（HTML元素的ID）
data: [],//url: “SelectStudentInfor”,//数据接口（方法的路径）
toolbar: ‘#toolbarDemo’,
cols: [[//hide:true 隐藏列
{ title: ‘序号’, type: ‘numbers’ },//序号列，title设定标题名称
{ title: ‘学号’, field: ‘StudentNumber’, align: ‘center’ },
{ title: ‘姓名’, field: ‘StudentName’, align: ‘center’, width: ‘8%’},
{ title: ‘性别’, field: ‘StudentSex’, align: ‘center’, width: ‘5%’ },
{ title: ‘班级’, field: ‘ClassName’, align: ‘center’ },
{ title: ‘成绩’, field: ‘Achievement’, align: ‘center’ }，
{ title: ‘合格类型’, field: ‘EligibleType’, align: ‘center’, fixed: ‘right’ },
]],
});
二、解析以及序列化
1、JSON对象具有两个方法。它们分别是将JS对象序列化为JSON字符串的stringify()方法；以及将JSON字符串解析为原生的JS值的parse()方法。即这两个方法的作用主要是JSON对象与JS对象之间进行的一个相互转换。例如：
var json=JSON.stringify(arr); // 将JS对象arr序列化为JSON字符串对象json
console.log(typeof (json));//控制台输出的结果类型是string（字符串)
var arr1=JSON.parse(json); // 将JSON字符串json解析为原生的JS值
console.log(arr1);//控制台输出的结果是JS对象
2、我们需要记住，虽然例子中的arr与arr1具有相同的属性，但它们两个都是相互独立且与对方没有任何关系的对象。
3、我们可以通过使用serialize()方法来将表单中具有name属性的元素值进行序列化，从而生成标准的URL编码文本字符串；它可直接用于ajax请求。
4、serialize()方法的调用格式为： $ (elem).serialize()。
5、调用serialize()方法序列化中文时，结果之所以显示为乱码，是因为serialize()方法调用了encodeURLComponent方法将数据进行了编码。
6、如果我们要在调用serialize()方法序列化中文的时候，不让其结果显示为乱码。我们可以通过调用decodeURLComponent(,true)方法将数据解码。例如：
$ (“#id”).click(function(){
var arr= $ (“#formid”).serialize();
console.log(arr);// 控制台输出的结果是乱码（不是我们需要的值）
arr=decodeURLComponent(arr,true);//解码
console.log(arr);// 控制台输出的结果是之前输入的值（我们真正需要的值）
});
7、我们序列化表单的方法除了serialize()方法外，还有一个序列化数组的格式的serializeArray()方法。使用serializeArray()方法序列化表格元素返回的是JSON数据结构的数据。
8、我们要注意的是以下三点：
（1）serializeArray()方法返回的是JSON对象，而不是JSON字符串。
（2）使用serializeArray()方法后需要使用插件或者第三方库进行字符串化的操作。
（3）serializeArray()方法返回的JSON对象是由一个对象数组组成的；其中，如果value值不为空的话，每个对象都包含一个或两个名值对（name参数和value参数）。例如：
$ (“#id”).click(function(){
var arr= $ (“#formid”).serializeArray();
console.log(“serializeArray”+arr);// 控制台输出的结果是数组
console.log(arr);// 控制台输出的结果是对象
});