JSON学习

最新推荐文章于 2023-02-08 22:09:56 发布

小胖__

最新推荐文章于 2023-02-08 22:09:56 发布

阅读量116

点赞数

分类专栏： Java

本文链接：https://blog.csdn.net/qq_24042659/article/details/85016182

版权

Java 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

JSON简介

JSON: JavaScript Object Notation(JavaScript 对象表示法)
JSON 是存储和交换文本信息的语法。类似 XML。
JSON 比 XML 更小、更快，更易解析。
JSON语法是JavaScript语法的子集

什么是JSON

JSON 指的是 JavaScript 对象表示法（JavaScript Object Notation）
JSON 是轻量级的文本数据交换格式
JSON 独立于语言：JSON 使用 Javascript语法来描述数据对象，但是 JSON 仍然独立于语言和平台。JSON 解析器和 JSON 库支持许多不同的编程语言。目前非常多的动态（PHP，JSP，.NET）编程语言都支持JSON。
JSON 具有自我描述性，更易理解

JSON-转换为JavaScript对象

JSON 文本格式在语法上与创建 JavaScript 对象的代码相同。
由于这种相似性，无需解析器，JavaScript 程序能够使用内建的 eval() 函数，用 JSON 数据来生成原生的 JavaScript 对象。

JSON与XML的区别

与XML相同处

JSON是纯文本
JSON具有“自我描述性”
JSON具有层级结构
JSON可以同JavaScript进行解析
JSON数据可以使用AJAX进行传输

与XML不同之处

没有结束标签
更短
读写的速度更快
能够使用内建的JavaScript eval()方法进行解析
使用数组
不使用保留字

JSON语法规则

数据在名称/值对中
数据由逗号分隔
大括号保存对象
中括号保存数组

JSON名称/值对

"name" : "CSDN"
"url" : "www.csdn.net"

JSON值

JSON的值可以是：
数字（整数或浮点数）
字符串（在双引号中）
逻辑值（true或false）
数组（在中括号中）
对象（在大括号中）
null

JSON数字

{"age" : 30}

JSON对象

//JSON对象在大括号中书写
//对象可以包含多个名称/值
{
	"name" : "百度"
	"url" : "www.baidu.com"
}

JSON数组

JSON数组在中括号中书写
数组可包含多个对象
{
“sites” : [
{“name” : “百度” , “url” : “www.baidu.com”}
{“name” : “CSDN” , “url” : “www.csdn.net”}
{“name” : “博客” , “url” : “www.haoseo.cc”}
]
}

JSON.parse()对象

JSON通常用于与服务端交换数据，在接收服务器数据时一般是字符串，我们可以使用JSON.parse()方法将数据转换为JavaScript对象
语法

JSON.parse(text[,reviver])
// 参数说明：
// text:必需， 一个有效的 JSON 字符串。
// reviver: 可选，一个转换结果的函数， 将为对象的每个成员调用此函数。

列如我们从服务器接收了以下数据：

{"name":"runoob", "alexa":10000, "site":"www.runoob.com"}

使用JSON.parse()方法处理以上数据

var obj = JSON.parse('{"name":"百度","url":"www.baidu.com"}');

JSON.stringify()对象

JSON通常用于与服务端交换数据。
在向服务器发送数据时一般是字符串。
我们可以使用 JSON.stringify() 方法将 JavaScript 对象转换为字符串。
语法

JSON.stringify(value[, replacer[, space]])
/**
	参数说明：
	value:
	必需， 一个有效的 JSON 对象。
	replacer:
	可选。用于转换结果的函数或数组。
	如果 replacer 为函数，则 JSON.stringify 将调用该函数，并传入每个成员的键和值。使用返回值而不是原始值。如果此函数返回 undefined，则排除成员。根对象的键是一个空字符串：""。
	如果 replacer 是一个数组，则仅转换该数组中具有键值的成员。成员的转换顺序与键在数组中的顺序一样。当 value 参数也为数组时，将忽略 replacer 数组。
	space:
	可选，文本添加缩进、空格和换行符，如果 space 是一个数字，则返回值文本在每个级别缩进指定数目的空格，如果 space 大于 10，则文本缩进 10 个空格。space 有可以使用非数字，如：\t。
*/

例如我们向服务器发送以下数据：

var obj = { "name":"runoob", "alexa":10000, "site":"www.runoob.com"};

我们使用 JSON.stringify() 方法处理以上数据，将其转换为字符串：

var myJSON = JSON.stringify(obj);

我们也可以将 JavaScript 数组转换为 JSON 字符串：

var arr = ["google","taobao","baidu"];
var myJSON = JSON.stringify(arr);

JSON实例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h2>JavaScript 创建 JSON 对象</h2>
<p>
网站名称: <span id="jname"></span><br /> 
网站地址: <span id="jurl"></span><br /> 
</p>
<script>
	var JSONObject = {
		"name":"百度"，
		"url":"www.baidu.com"
	}
	document.getELementById("jname").innerHTML = JSONObject.name
	document.getELementById("jurl").innerHTML = JSONObject.url
</script>
</body>
</html>

使用for in循环

var myObj = {
	"name" : "cadn",
	"url" : "www.csdn.net",
};
for(x in myObj){
	alert(x);
}

嵌套JSON对象

JSON对象可以包含另外一个JSON对象

var myObj = {
		"name" : "张三",
		"age" : 18,
		"sex" : "男",
		"sites" : {
			"site1" : "已婚",
			"xx" : "xxx"
		}
 	};
// 使用.或中括号（[]）访问属性
var x = myObj.sites.site1;
var d = myObj.sites["site1"];
// 修改值
myObj.sites.site1 = "未婚";
// 删除对象属性
delete myObj.sites.site1;

嵌套JSON对象中的数组

JSON数组可以包含另一个数组，或者另一个JSON对象

myObj = {
	"name" : "网站",
	"num" : 3,
	"data" : [
		{"name" : "google" , "url" : "www.google.com" , "info" : ["Android","Google搜索","Google翻译"]}
	]
	{ "name":"Taobao", "url" : "www.taobao.com" , "info":[ "淘宝", "网购" ] }
}

从服务器端接收JSON数据

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
	if(this.readyState == 4 && this.status == 200){
		myObj = JSON.parse(this.responseText);
		var x = myObj.name;
	}
};
xmlhttp.open("GET","ter/data.txt",true);
xmlhttp.send();

一下是data.txt的数据

{
	"name" : "数据",
	"length" : "16",
	"sex" : "男"
	"sites" : ["123","151","dsd","username" : "admin"]
}

从服务端接收数组的 JSON 数据

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
myArr = JSON.parse(this.responseText);
document.getElementById("demo").innerHTML = myArr[1];
}
};
xmlhttp.open("GET", "/try/json_demo_array.txt", true);
xmlhttp.send();