Json.stringify()和Json.parse()的用法以及区别

一.json.stringify()和json.parse()的用法和区别：

两者区别：json.stringify()是把javascript对象转换成json字符串；
json.parse()是把字符串转换成对象。简单来说两者的作用是相对的。

1.json.stringify():
(1) json.stringify()–把javascript对象转换成json字符串；
(2) json.stringfy()–起到对参数序列化的作用。
比如说：前端调用后台接口需要传参数，如果传递的参数是简单的字段可以不需要序列化，但是如果传递的参数中含有特殊字符，比如富文本中的内容，会出现特殊字符以及转义等各种问题，这个时候就需要使用json.stringify()对参数进行序列化。

  $.ajax({
		type: 'POST',
        contentType:"application/json; charset=utf-8",
		url:"saveKnowLedge",
		data:JSON.stringify({knTitle:kn_title,knAuthor:kn_author,knImage:kn_image,content:content}),
		dataType:'json',
	    success:function (data) {
			   if(data){
			        layer.close(index);
			        layer.alert('提交成功', {
			        	icon:1,
			        },function(re) {
			        	 layer.close(re);
			             parent.location.reload();
			        })
			        }else{
			        		layer.close(index);
			        		 layer.alert('提交失败', {
			        			 icon:2,
			        		 },function(re) {
			        			    layer.close(re);
			        			    parent.location.reload();
			        		})
			        	}
			        }
			    });

2.json.parse()
(1) json.parse()–把json字符串转换成对象；
(2) json.parse()–json字符串的键值都必须使用双引号包起来

let a = '["1","2"]';
let b = "['1','2']";
console.log(JSON.parse(a));// Array [1,2]
console.log(JSON.parse(b));// 报错

二.Json.Stringify()的几种用法

1.判断数组中是否包含对象，或者对象是否相等

//判断数组是否包含某对象
let data = [
    {name:'echo'},
    {name:'听风是风'},
    {name:'天子笑'},
    ],
val = {name:'天子笑'};
JSON.stringify(data).indexOf(JSON.stringify(val)) != -1;//true

//判断两数组/对象是否相等
let a = [1,2,3],
    b = [1,2,3];
JSON.stringify(a) === JSON.stringify(b);//true

注意：indexOf()–表示可返回某个指定的字符串值在字符串中首次出现的位置。
indexof方法 != -1–表示检索的字符串存在
indexof方法 == -1–表示检索的字符串不存在

2.让localStorage/sessionStorage可以存储对象
localStorage/sessionStorage默认的是只能存储字符串。但是在我们实际的开发中需要存储的数据往往多为对象类型，这时我们就可以用json.stringify()把对象转换成字符串，在取缓存的时候，在使用json.parse()把字符串转回对象就可以了。

//存
function setLocalStorage(key,val){
    window.localStorage.setItem(key,JSON.stringify(val));
};
//取
function getLocalStorage(key){
    let val = JSON.parse(window.localStorage.getItem(key));
    return val;
};
//测试
setLocalStorage('demo',[1,2,3]);
let  a = getLocalStorage('demo');//[1,2,3]

3.实现对象深拷贝
在实际开发中，会对数据进行操作，如果担心影响原数据的话，我们可以深拷贝出一份数据做任意操作，使用json.stringify()和json.parse()做深拷贝是个不错的选择。

//深拷贝
function deepClone(data) {
    let _data = JSON.stringify(data),
    dataClone = JSON.parse(_data);
    return dataClone;
};
//测试
let arr = [1,2,3],_arr = deepClone(arr);
arr[0] = 2;
console.log(arr,_arr)//[2,2,3]  [1,2,3]

三.Json.stringify()和toString()的区别

这两者虽然都可以讲目标值转为字符串，但是还是有本质区别的。

let arr = [1,2,3];
JSON.stringify(arr);//'[1,2,3]'
arr.toString();//1,2,3

其实，JSON.stringify()的受众更多是对象，而toString()虽然可以将数组转为字符串，但并不能对{name:‘天子笑’}这类对象实现你想要的操作，它的受众更多是数字。