如果您想订阅本博客内容,每天自动发到您的邮箱中, 请点这里
1、首先理解一下“深拷贝”和“浅拷贝”的区别:
浅拷贝:a = b;//a和b中存的是相同的地址,该地址指向堆内存中相同的地方,即a和b就是一个东西,改变a的值b的值也会跟着改变,同理改变b的值a的值也会发生改变;
深拷贝:a和b中存的地址不同,但是地址对应的堆内存中的内容完全一致,即b是a的副本
2、
(1)数组和对象的浅拷贝一样 ,简单的赋值操作
var b = a;
如数组的浅拷贝:
-
var a = ['1','2','3'];
-
var b = a;
-
b[0] = '5';
-
console.log('a',a);
-
console.log('b',b);
输出的值为:
对象的浅拷贝:
-
var a = {name:'1',age:'2',color:'3'};
-
var b = a;
-
b.name = '5';
-
console.log('a',a);
-
console.log('b',b);
输出的值为:
(2)数组的深拷贝
ES5:var b = a.concat();
-
var a = ['1','2','3'];
-
var b = a.concat();
-
b[0] = '5';
-
console.log('a',a);
-
console.log('b',b);
输出的结果为:
ES6 let [...b] = a;
(3)对象的深拷贝
ES5:
-
var a = {name:'1',age:'2',color:'3'};
-
function copyObj(a) {
-
var b = {};
-
for(var key in a) {
-
b[key] = a[key];
-
}
-
return b;
-
}
-
var c = copyObj(a);
-
c.name = '5';
-
console.log('c',c);
-
console.log('a',a);
输出的结果为:
ES6:
let {...b} = a;
蓝蓝设计( www.lanlanwork.com )是一家专注而深入的界面设计公司,为期望卓越的国内外企业提供卓越的UI界面设计、BS界面设计 、 cs界面设计 、 ipad界面设计 、 包装设计 、 图标定制 、 用户体验 、交互设计、 网站建设 、平面设计服务