首先,深拷贝和浅拷贝针对的是对象类型(对象,数组,函数)。

浅拷贝指的是只是拷贝了对象的引用地址,彼此之间高耦合,一个改变,另一个可能也随之改变;

深拷贝是指只是完整的将变量的值拷贝过来,是一个新的对象,和被拷贝对象解耦合,一个改变,不会影响其它的内容。

浅拷贝

当对象有多层属性值时,只拷贝第一层, 是浅拷贝。如果被拷贝对象只有一层,下面的方法就是深拷贝。

1)对象遍历赋值

let copy = function(target,source){
for(let property in source){
target[property] = source[property]
}
return target;
}

2) 对象合并函数Object.assign({})--复制可遍历属性(元属性enumerable为true)

当Object.assign(obj)只有一个参数时,相当于返回自身。
let copy = Object.assign(obj); // copy === obj// 注意:当obj的值为原始类型的值(boolean,string,number)时,会将原始值转为包装对象。当obj为undefined或者null时,无法转为对象会报错。 当Object.assign(target, source1, source2,...)有多个参数时,将第一个设为空对象{}
// 浅拷贝
let copy = Object.assign({}, source);

// 注意: 当source为undefined或者null或者(boolean,number)时,会忽略source;当source为string类型时,会将字符串转为对象
Object.assign({},str) ---> //{0: "a", 1: "b", 2: "c"}

3)扩展运算符(...)性质同1)

let a = {
age: {
my: 18
}
}
let b = {...a};
b.age.my = 20;
a; //{age: {my: 20}}

4) [xxx].slice() 浅拷贝

var a = [[1,2,3]]; //目标对象是多维数组
var b = slice();
b[0][0] = 100;
a; // [[100,2,3]]

深拷贝

为了不出现上面例子中,嵌套关系拷贝只拷贝地址的情况,我们需要遍历到最底层,逐级赋值,实现深拷贝

1.JSON.parse(JSON.stringify(obj))

该方法可以解决大多数的深拷贝问题。实际开发任务中,基本都可以使用。但是有些特殊情况:

具体使用JSON.stringify的特殊的情况如下:

1)忽略属性值为undefined和function类型和Symbol类型的值;

JSON.parse(JSON.stringify({a:1, b:function(){}, c:undefined, d: Symbol()}))
// 结果如下:
{a: 1}

2) 值为Regex,Error类型的值会变成空对象{};

JSON.parse(JSON.stringify({a:1, b: RegExp('a'), c: new Error('err')}));
// 结果
{a:1, b: {}, c: {}}

3) 值NaN,Infinity,-Infinity的值会变成null;

JSON.parse(JSON.stringify({a:1, b: NaN, c:Infinity, d: -Infinity}))
// 结果
{a:1, b: null, c: null, d: null}

4)不能序列化循环引用的对象,会抛出异常

var a = {};
a.b = a;
JSON.stringify(a);
// Uncaught Error: Converting circular structure to JSON

5)当参数对象有自定义的toJSON()方法时,JSON.stringify()会将该方法的返回值作为最后的参数值,忽然其它的参数。

6)当参数值为Date对象类型时,因为Date对象有toJSON()方法,则JSON.stringify()会将Date类型的值按照字符串转换,

然后JSON.parse()去解析JSON字符串,最终会解析成字符串,不会解析成Date类型。

2.通用的深拷贝方法

1)直接使用lodash中的cloneDeep方法

2)手写一个深拷贝方法

function deepClone(obj, hash=new WeakMap()) {
// 如果obj为null/undefined
if(obj == null){// null == undefined
return obj;
}
if (obj instanceof RegExp) {
return new RegExp(obj); //拷贝正则对象,需要新生成一个对象
}
if (obj instanceof Date) {
return new Date(obj);
}
if(obj instanceof Error) {
return new Error(obj);
}
// 如果是原始类型的值(string/number/boolean/symbol)或者function
// function不需要被拷贝,使用时是调用
if(typeof obj !== 'object'){
return obj;
}
// 如果是对象(Array,Object)需要递归拷贝
if(hash.get(obj)) return hash.get(obj);
let cloneObj = new obj.constructor;
// 防止出现对象属性循环调用自身的情况: var a ={}; a.b= a;
hash.set(obj, cloneObj);
for(let key in obj) {
if (obj.hasOwnProperty(key)) {// 只拷贝自身的属性
cloneObj[key] = deepClone(obj[key], hash);
}
}
return cloneObj;
} //测试
var a = {a:1, b:function(){}, c:undefined, d: Symbol()};
var b = {a:1, b: RegExp('a'), c: new Error('err')};
var c = {a:1, b: NaN, c:Infinity, d: -Infinity};
var d = {a:1, b: new Date()}
var e = {}; e.a = e;
console.log(deepClone(a)); // {a:1, b:function(){}, c:undefined, d: Symbol()};
console.log(deepClone(b)); // {a:1, b: RegExp('a'), c: new Error('err')};
console.log(deepClone(b)); // {a:1, b: NaN, c:Infinity, d: -Infinity};
console.log(deepClone(d)); // {a:1, b: new Date()}
console.log(deepClone(e)); // {a: [Circular]}

浅拷贝(Shallow Copy) VS 深拷贝(Deep Copy)的更多相关文章

  1. 由Python的浅拷贝(shallow copy)和深拷贝(deep copy)引发的思考

    首先查看拷贝模块(copy)发现: >>> help(copy)Help on module copy:NAME    copy - Generic (shallow and dee ...

  2. [置顶] operator overloading(操作符重载,运算符重载)运算符重载,浅拷贝(logical copy) ,vs, 深拷贝(physical copy)

    operator overloading(操作符重载,运算符重载) 所谓重载就是重新赋予新的意义,之前我们已经学过函数重载,函数重载的要求是函数名相同,函数的参数列表不同(个数或者参数类型).操作符重 ...

  3. copy&mutableCopy 浅拷贝(shallow copy)深拷贝 (deep copy)

    写在前面 其实看了这么多,总结一个结论: 拷贝的初衷的目的就是为了:修改原来的对象不能影响到拷贝出来得对象 && 修改拷贝出来的对象也不能影响到原来的对象 所以,如果原来对象就是imm ...

  4. angular.extend深拷贝(deep copy)

    在用到angular.extend的时候,正好碰到一个对象,是层层嵌套的Array, 结果发现只能extend第一层,查阅官文档,确实不支持deep copy: Note: Keep in mind ...

  5. [置顶] 运算符重载,浅拷贝(logical copy) ,vs, 深拷贝(physical copy),三大件(bigthree problem)

    一般的我们喜欢这样对对象赋值: Person p1;Person p2=p1; classT object(another_object), or    A a(b); classT object = ...

  6. 运算符重载,浅拷贝(logical copy) ,vs, 深拷贝(physical copy),三大件(bigthree problem)

    一般的我们喜欢这样对对象赋值: Person p1;Person p2=p1; classT object(another_object), or    A a(b); classT object = ...

  7. javascript 求最大前5个数; 对象 深拷贝 deep copy

    * 用数组 function getTopN(a, n) { function _cloneArray(aa) { var n = aa.length, a = new Array(n); for ( ...

  8. python deep copy and shallow copy

    Python中对于对象的赋值都是引用,而不是拷贝对象(Assignment statements in Python do not copy objects, they create bindings ...

  9. JS Object Deep Copy & 深拷贝 & 浅拷贝

    JS Object Deep Copy & 深拷贝 & 浅拷贝 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Refe ...

随机推荐

  1. kubernetes系列11—PV和PVC详解

    本文收录在容器技术学习系列文章总目录 1.认识PV/PVC/StorageClass 1.1 介绍 管理存储是管理计算的一个明显问题.该PersistentVolume子系统为用户和管理员提供了一个A ...

  2. OpenCC的编译与多语言使用

    OpenCC全称Open Chinese Convert,是一个Github上面的开源项目,主要用于简繁体汉字的转换,支持语义级别的翻译.本文就来简单介绍一下该库的编译以及python.C++和JAV ...

  3. 【资料总结】| Deep Reinforcement Learning 深度强化学习

    在机器学习中,我们经常会分类为有监督学习和无监督学习,但是尝尝会忽略一个重要的分支,强化学习.有监督学习和无监督学习非常好去区分,学习的目标,有无标签等都是区分标准.如果说监督学习的目标是预测,那么强 ...

  4. mysql-8.0 安装教程(自定义配置文件,密码方式已修改)

    下载zip安装包: MySQL8.0 For Windows zip包下载地址:https://dev.mysql.com/downloads/file/?id=476233,进入页面后可以不登录.后 ...

  5. 最新阿里Java技术面试题,看这一文就够了!

    金三银四跳槽季即将到来,作为 Java 开发者你开始刷面试题了吗?别急,小编整理了阿里技术面试题,看这一文就够了! 阿里面试题目目录 技术一面(基础面试题目) 技术二面(技术深度.技术原理) 项目实战 ...

  6. 详解块级格式化上下文(BFC)

    相信大家和我一样,第一次听到别人说CSS 块级格式化上下文(block formatting context,简称:BFC)的时候一头雾水,为了帮助大家弄清楚块级格式化上下文,我翻阅了W3C的CSS规 ...

  7. 深入理解group by 语句的执行顺序 from→where→group by→select(含聚合函数)

    由于之前没有对group by 语句的执行顺序(执行原理)做深入的了解,所以导致在实际应用过程中出现了一些问题.举个简单的粟子,比如一个表testA中的所有数据如下图: 我现在想从testA中查询us ...

  8. Asp.Net中virtual、override理解

    virtual关键字用于指定属性或方法在派生类中重写.默认情况下,派生类从其基类继承属性和方法,如果继承的属性或方法需要在派生类中有不同的行为,则可以重写它,即可以在派生类中定义该属性或方法的新实现, ...

  9. 猴子选大王 (约瑟夫环)(c#)

    猴子选大王问题: 一堆猴子都有编号,编号是1,2,3 ...m ,这群猴子(m个)按照1到m的顺序围坐一圈, 从第1开始数,每数到第n个,该猴子就要离开此圈,这样依次下来,直到圈中只剩下最后一只猴子, ...

  10. ILRuntime入门笔记

    基础知识 官方地址:https://github.com/Ourpalm/ILRuntime 官方文档:https://ourpalm.github.io/ILRuntime/ 文档Markdown源 ...