共计 1799 个字符，预计需要花费 5 分钟才能阅读完成。
开发过程中，有时会遇到把现有的一个对象的所有成员属性拷贝给另一个对象的需要，这就是拷贝。接下来咱们就来讲讲 JavaScript 外面的拷贝。在 JavaScript 中，将咱们的拷贝分为两类，一类是深拷贝，还有一类是浅拷贝。
那么怎么辨别深拷贝和浅拷贝呢？
浅拷贝就是间接将一个 Object 对象所有的属性和属性值复制给另一个 Object 对象。这样导致的结果是，新对象和老对象雷同的 Object 类型的属性值在内存中的指向是一样的，也就是新对象和老对象的 Object 类型的同一属性值指向的是同一块内存。因而批改新对象或者原对象，都会相互烦扰。
深拷贝是将一个 Object 对象的内容齐全拷贝一份给新对象。批改原对象的属性或者属性值，都不会影响新对象。原对象和新对象是齐全独立的，互不影响。
他们具体又是如何利用的呢？咱们来举几个例子阐明。
一、浅拷贝
比如说，咱们当初有一个对象 A，他外面有两个属性 id 和 name，还有一个空对象 B，咱们应该如何操作将 A 对象的属性拷贝给 B 对象呢？
var A = {
name:’xl’,
id: 6
};
var B = {};
首先，咱们能够通过一个 for...in 循环来遍历对象 A，而后将失去的每一项赋给对象 B。而后通过打印对象 B 查看是否将 A 的属性值拷贝胜利。for (k in A) {// k 是属性名，A[k]是属性值
B[k] = A[k];
}
console.log(B);
打印后果为：
发现 B 确实拷贝了 A 的所有属性。依照上例，咱们当初在给 A 对象增加一个办法，看看拷贝的后果吧！复制代码
var A = {
name:’xl’,
id: 6,
study: {
doing: ‘ 学习 ’
}
};
打印后果为：
仿佛这样也把咱们新添的办法拷贝胜利了，然而如果咱们批改 B 对象中 study 的值，A 对象中的值会不会变动呢？复制代码
B.study.doing = ‘ 上课 ’;
console.log(A);
打印后果为：
可知，A 外面的属性也相应被扭转了。这是因为，咱们浅拷贝拷贝的该办法的是更深层次对象的地址。阐明：浅拷贝只是拷贝一层，更深层次对象级别的只拷贝援用。
咱们还能够通过 ES6 新增的语法 Object.assign(target, ...sources)来实现咱们的浅拷贝。咱们将上述例子通过该办法实现看看。
var A = {
name:’xl’,
id: 6,
study: {
doing: ‘ 学习 ’
}
};
var B = {};
Object.assign(B,A);
console.log(B);
打印后果为：
能够看出，咱们的这种语法也能够实现成果，然而须要留神的是，该办法也只能实现浅拷贝。复制代码
二、深拷贝
对于深拷贝，咱们的实现思路是：再对对象外面的属性和属性名通过循环表里进行拷贝。这里就要用到递归思维。
还是下面那个例子：
首先，咱们封装一个函数，并将被拷贝的对象和要拷贝的对象传入，封装实现后，再通过 for..in 循环进行遍历。接下来具体操作为：
1、通过 oldA[k]获取属性值
2、通过 instanceof() 判断该值的属性
3、如果值的类型是数组或者对象，则通过递归调用在此循环遍历数组或者对象外面的值进行拷贝。
4、如果值的类型是简略数据类型，就间接赋值。
代码如下：
function deepCopy(newA,oldA){
for(k in oldA){
var item = oldA[k];
if(item instanceof Array){
newA[k] = [];
deepCopy(newA[k],item)
}else if(item instanceof Object){
newA[k] = {};
deepCopy(newA[k],item)
}else{
newA[k] = item;
}
}
}
deepCopy(B,A);
console.log(B);
最初打印的后果为：
胜利拷贝。那么如果咱们扭转 B 对象的 study 办法外面的值会不会影响 A 呢？复制代码
B.study.doing = ‘ 上课 ’;
console.log(A);
打印后果为：
能够发现，B 对象外面的值发生变化并不会影响到 A 对象。因为：深拷贝是将一个 Object 对象的内容齐全拷贝一份给新对象。复制代码
置信大家通过前端培训学习当初应该曾经理解了深拷贝和浅拷贝。那么，他们二者的区别是什么呢？
浅拷贝和深拷贝的区别
浅拷贝是拷贝了对象的援用，当原对象发生变化的时候，拷贝对象也跟着变动；深拷贝是另外申请了一块内存，内容和原对象一样，更改原对象，拷贝对象不会发生变化。