js之JSON格式用法和序列化JSON.stringify(value, replacer, space)以及反序列化JSON.parse(string)

JSON是一种数据交换格式，不是编程语言。

1、JSON格式与普通对象区别:

1. 键必须用双引号包裹，单引号都不行，值是数字、true、null 可以不使用双引号,但是 undefined 必须加双引号作为字符使用。
2. 不能包含函数。
3. 也不能使用注释。
4. 文件使用后缀.JSON格式.

2、JSON格式有三种写法：

第一种：字符串写法

"hello",
"null",
"true"

上面是错误的JSON字符格式，只能有一个字符串，多行字符报错

"hello"

第二种：对象形式

{
	"name":"wang",
	"age":18,
	"shool":{
		"shoolname":"diyizhongxue",
		"address":"zhongguoqu"
	},
	"hobbies":["codding","playgame"]
}

第三种：数组格式

[
	"abc",
	123,
	{
		"name":"wang",
		"age":144,
		"hobbies":["codding","playgame"]
	},
	"true",
	"null"
]

3、JSON序列化和反序列化

1. JSON序列化JSON.stringify(value, replacer, space)

**将对象转换成JSON字符串**

• value:要转换的数据，通常为对象和数组。
• replacer：函数或数组，函数用来装饰键值对，数组用来过滤
• space：用来缩进，是数字的时候表示缩进的空格数，是字符串的时候表示缩进显示字符
• 返回值是一个JSON字符串

let json = {age:11,"name":"wang"}
let p = JSON.stringify(json,null,2)
console.log(p);
console.log(typeof p);

其实返回的是最外层带引号的字符串，只是被省略了，如下：

" {
  "age": 11,
  "name": "wang"
} "

2. JSON反序列化JSON.parse(string)

**将JSON字符串转换成对象**	返回值是一个对象

let json = {age:11,"name":"wang"}
let p = JSON.stringify(json,null,2)
console.log(p);
console.log(typeof p);

let pobj = JSON.parse(p)
console.log(pobj);

4、JSON序列化时如果有函数和undefined，则忽略函数和undefined项。

let json = {age:11,"name":"wang","und":undefined,"func":function(){}}
let p = JSON.stringify(json,null,2)
console.log(p);

5、当localstorage和sessionstorage需要 JSON序列化和反序列化

本地存储和会话存储只能存储字符串，如果不是字符串，会调用toString方法转化为字符串，而对象调用toString，显示的是[object Object ]

<script type="text/javascript">
	let obj = {age:11,"name":"wang","und":undefined,"func":function(){}}
	localStorage.setItem('obj',obj)			
</script>

可用 JSON.stringify( obj ) 进行转换

<script type="text/javascript">
	let obj = {age:11,"name":"wang","und":undefined,"func":function(){}}
	// localStorage.setItem('obj',obj)		
	localStorage.setItem('obj',JSON.stringify(obj))
</script>

当获取本地和会话存储时，返回的是字符串，需要转化为对象，用JSON.parse()

<script type="text/javascript">
			let obj = {
				age: 11,
				"name": "wang",
				"und": undefined,
				"func": function() {}
			}
			localStorage.setItem('objs', JSON.stringify(obj))
			let pobj = localStorage.getItem('objs')
			console.log(typeof pobj); // string
			console.log(pobj); // "{"age":11,"name":"wang"}" 字符串
</script>

需要注意的是，当用JSON.parse()时需要将其放在外面包裹localStorage

<script type="text/javascript">
			let obj = {
				age: 11,
				"name": "wang",
				"und": undefined,
				"func": function() {}
			}
			localStorage.setItem('objs', JSON.stringify(obj))
			// JSON.parse需要放在外面
			let pobj =  JSON.parse(localStorage.getItem('objs')) 
			console.log(typeof pobj);
			console.log(pobj);
		</script>

之后就可以用pobj.name调取里面的内容了。

6、JSON序列化和反序列化的深拷贝

<script type="text/javascript">
			let obj = {
				age: 11,
				"name": "wang",
				"und": undefined,
				"func": function() {}
			}
			// newobj是一个新对象，与obj没有关联
			let newobj = JSON.parse(JSON.stringify(obj))
			newobj.name='ljdlksflsj'
			console.log(newobj);
			console.log(obj);			
</script>

序列化拷贝的缺点就是不能拷贝出函数