JS深拷贝与浅拷贝的区别

深拷贝与浅拷贝适合数组和对象

1.数组

浅拷贝：相当于使两个数组指针指向相同的地址，任一个数组元素发生改变，影响另一个。

var a=[1,2,3,4]
 b=a
 console.log('a'---a)
 console.log('b'---b)
//运行结果输出:'a'---[1,2,3,4],'b'---[1,2,3,4]

看看下面的这种情况:

b[0] = 666;
console.log('a'--a)
console.log('b'--b)
//运行结果输出:'a'---[666,2,3,4],'b'---[666,2,3,4]

数组a会输数组b的改变而改变

深拷贝：两数组指针指向不同的地址，数组元素发生改变时不会相互影响。

数组的concat方法
concat方法用于连接两个或多个数组，返回一个新数组

var a=[1,2,3,4]
 b=a.concat([])
 console.log('a'---a)
 console.log('b'---b)
//运行结果输出:'a'---[1,2,3,4],'b'---[1,2,3,4]

b[0] = 666;
onsole.log('a'--a)
console.log('b'--b)
//运行结果输出:'a'---[1,2,3,4],'b'---[666,2,3,4]

数组的slice方法
方法可从已有数组中返回选定的元素，返回一个新数组

var a=[1,2,3,4]
 b=a.slice(0)
 console.log('a'---a)
 console.log('b'---b)
//运行结果输出:'a'---[1,2,3,4],'b'---[1,2,3,4]

b[0] = 666;
onsole.log('a'--a)
console.log('b'--b)
//运行结果输出:'a'---[1,2,3,4],'b'---[666,2,3,4]

2.对象

浅拷贝：只拷贝对象的第一层属性，对于属性中包含的属性不会复制；由于JS中的对象均以地址的方式存储，所以浅拷贝导致多个对象的属性均指向同一个地址。
深拷贝：把对象的每层的属性进行复制，且深层次的属性也不会指向同一个地址。

示例：
浅拷贝：

var a = {name:"jack",
         child:{
            name:"rose"
               }
         }
var b = {
    name:a.name,
    child:a.child
}
a.name = "copy"
a.child.name = "浅拷贝"
console.log(a)
//{name: "字面量属性拷贝", child: Object{name:"浅拷贝"}}
console.log(b)
// {name: "jack", child: Object{name:"浅拷贝"}}

浅拷贝只是拷贝了对象的基础属性值，对对象或数组的属性值则是只是拷贝了引用。所以修改a.name的时候，由于name的属性值为字符串类型所以直接拷贝了，a的修改不影响b。当修改a.child属性的时候，由于该属性值是对象，因为b只拷贝了引用，故b.child也变化了

深拷贝：

var a = {
      name:"jack",
       child:{
           name:"rose"
        }
  }
//深拷贝
var b = {
    name:a.name,
    child:{
        name:a.child.name
    }
}
a.name = "Deepcopy"
a.child.name = "深拷贝"
console.log(a)
// {name: "字面量属性拷贝", child: Object{name:"深拷贝"}}
console.log(b)
//{name: "jack", child: Object{name:"rose"}}

深拷贝是对浅拷贝的进一步解析，直到所有的属性都为基础属性值为止，所以深拷贝的对象是完全独立的一个新对象。所以对象的地址也是不一样的。