关于JavaScript的深浅拷贝

JavaScript的数据类型就是基本数据类型和引用数据类型
但是对于基本数据类型不存在深浅拷贝的区别,所谓的深浅拷贝是针对于引用类型而言的

关于浅拷贝:

1. Array.concat() / Array.slice()

如果针对数组,可以使用他们来进行浅拷贝。如下:
关于JavaScript的深浅拷贝_第1张图片
关于JavaScript的深浅拷贝_第2张图片
但是,如果数组里面有数组或者对象时,就会发生这种情况:
关于JavaScript的深浅拷贝_第3张图片
由上面可以发现,不管新数组还是老数组都发生了变化,说明拷贝不彻底。

2. Object.assign()

针对普通对象使用Object.assign()来拷贝对象
关于JavaScript的深浅拷贝_第4张图片
但是,如果里面还有对象或者数组就会拷贝不彻底
关于JavaScript的深浅拷贝_第5张图片

关于深拷贝

1. JSON.Parse() / JSON.stringify()

这种一般满足需求
关于JavaScript的深浅拷贝_第6张图片
但是他存在一些问题:

  1. undefined、null、正则表达式、symbol,在序列化的过程中会被忽略或者会被转为null,如下
    关于JavaScript的深浅拷贝_第7张图片
  2. 无法拷贝函数
    关于JavaScript的深浅拷贝_第8张图片

简单实现一个深拷贝

function my_Deep(obj) {
	if(typeof obj !== 'object') return 
	var newObj = obj instanceof Array ? [] : {}
	for (var key in obj){
		if(obj.hasOwnProperty(key)) { // 判断对象是否包含特定的自身(非继承)属性
			newObj[key] = typeof obj[key] === 'object' ? my_Deep(obj[key]) : obj[key]
		}
	}
	return newObj
}
var m = [1, undefined, {na: 123}, {code: function(){console.log('hi!!')}}]
 console.log(my_Deep(m))

关于JavaScript的深浅拷贝_第9张图片

你可能感兴趣的:(JavaScript)