JS浅拷贝与深拷贝

JS浅拷贝与深拷贝

浅拷贝

将一个obj对象拷贝到另一个空的o对象

//被拷贝的对象
var obj = {
	name: '张三',
	age: 18,
	msg:{
		sex:'男'
	},
	color:['red','yellow']
}
//拷贝到的对象
var o = {};

1.可以利用for in遍历obj对象

 for (var k in obj) {
 	 o[k] = obj[k];
}
console.log(o);

2.利用ES5新增方法assign的方法(常用)

//Object.assign(要拷贝到的对象, 被拷贝的对象);
Object.assign(o, obj);
console.log(o);

注意点：
浅拷贝只能拷贝内容中简单的数据类型，更复杂的数据类型（比如说Array数组、Object对象）只拷贝指向内存中存储数据的地址，也就是说修改拷贝后的数据会影响原来的数据。

o.msg.sex = '女'; //这里只修改拷贝到的对象o中的数据
console.log(obj); //输出的结果原来的obj数据也会被修改

深拷贝

深拷贝拷贝出来的新的对象，修改其中复杂数据类型中的数据不会影响原来的数据。

主要思路是遍历旧对象，判断当前数据是不是数组或对象，如果是就创建一个空的新对象，递归传入空的新对象和当前数据内容，否则就将旧对象中数据直接赋值给新的对象。

下面是封装的深拷贝函数代码

function deepCopy(newObj, oldObj) {
	  for (var k in oldObj) {
		 var item = oldObj[k];
			 if (item instanceof Array) {
				newObj[k] = [];
				deepCopy(newObj[k], item);
			} else if (item instanceof Object) {
             	newObj[k] = {};
             	deepCopy(newObj[k], item);
            } else {
				newObj[k] = item;
		}
	}
}
deepCopy(o, obj);

这里要注意必须先判断数组，再判断对象，因为数组也是属于对象的。

再提一种简洁的深拷贝方法（常用）
将对象转换为字符串，再转化为对象赋值给一个obj_copy

var obj_copy = JSON.parse(JSON.stringify(obj));
obj_copy.color[1] = 'blue';
console.log(obj, obj_copy);