JavaScript中的浅拷贝和深拷贝

认识对象的深拷贝和浅拷贝

在js的使用过程中, 赋值操作是最常见的一环, 而在赋值操作中, 会有一个容易被初学者忽略的问题就是对象的深浅拷贝.
当赋值的类型是基本数据类型时, 是不会遇到上述的问题的, 而当赋值类型为对象时(其中数组也是对象), 我们赋给的其实只是该对象的引用, 当修改新赋予的对象的值的时候, 旧的对象的值也会被修改. 这种赋值操作被称为浅拷贝(即只拷贝了对象类型的引用)

var a = 5;
var b = a;  //将a的值赋给b
b = 10;  //将b的值修改为10, a不会受到影响

var c = {
  foo: 5
}
var d = c;   //将a的对象赋给b
d.foo = 10;  //修改b中foo的值时, a中的foo也会被修改
console.log(c.foo);  //  -> 10

var e = [ 1, 2, 3];
var f = e;  //将数组e赋值给f
f[0] = 100;  //修改f[0]
console.log(e);  //  -> [100, 2, 3]

很多时候, 我们不想仅仅获得对象的引用, 而是和原对象完全一样的新对象, 这时候就需要实现对象的深拷贝

如何实现对象的深拷贝

1. JSON.parse(JSON.stringfy(obj))
   最简单的方法就是使用JSON序列化的方法, 将一个对象转化为JSON字符串然后再解析成js语句, 在对象深度只有一层的时候, 该方法简单有效, 而当对象中嵌套了对象的时候, 内层的对象仍为对象的引用. 且JSON序列化会忽略函数对象.