JS——JSON数据和解析、引用数据的深拷贝(深复制)

317 阅读1分钟

JSON数据和解析

JSON:是对象的字符串表示法,它使用文本表示从一个JS对象的信息,本质是一个字符串,常常用于网络传输数据的一种字符串格式。

JSON的构成:值

值可以是对象、数组、数字、字符串或者三个字面值(false、null、true)中的一个。

字符串的分类:

1.querystring查询字符串(通常出现于网址中):例:"name=karen&pwd=abc178&count=20";

2.template:模板字符串(通常出现于代码中):例:<div>666</div>

3.JSON json字符串:例:{"name":"karen"}

JSON和JS对象互传:

1.要实现从JSON字符串转换为JS对象,使用JSON.parse()方法;

 JSON.parse(`{"name":"karen"}`)

2.要实现从JS对象转换为JSON字符串,使用JSON.stringify()方法;

JSON.stringify({"name":"karen"})

深拷贝(深复制):

注意:基本数据的直接复制就是深复制,而引用数据直接复制是浅复制。

浅复制:引用数据直接复制,如下:

image.png

引用数据如果直接复制只能实现浅复制,如果想要实现深复制有两种方法,如下:

1.新建一个同类型值;

image.png

2.JSON.parse(JSON.stringify(变量));

前提:内部没有引用数据或者时间、正则、null等数据。

JSON.stringify(变量):先转字符串
JSON.parse(JSON.stringify(变量)):再将字符串转回引用类型值

image.png

image.png 3.利用自调用(没有上述的缺点):

var copy1 = function (obj) { 
if(obj === null) {return null }
if(typeof obj !== 'object'){ return obj;}
if(obj.constructor===Date) {return new Date(obj);} 
if(obj.constructor === RegExp) {return new RegExp(obj);}
var newObj = new obj.constructor ();  //保持继承链
for (var key in obj) {
    if (obj.hasOwnProperty(key)) {   //不遍历其原型链上的属性
        var val = obj[key];
        newObj[key] = typeof val === 'object' ? arguments.callee(val) : val; // 使用arguments.callee解除与函数名的耦合
    }
}  
return newObj;  
}; 

注意:1和2的缺点:原型链没有拷贝,函数和null不会拷贝

例:

image.png

<script type="text/javascript">
			var str="nice to meet you";
			var arr=str.split(" ");
			var arr1=JSON.parse(JSON.stringify(arr));
			var arr2=arr;
			arr1[length-1]="myself";
			document.write(`<h1>${arr1}</h1>`);
			console.log(arr2)
			
	</script>