概念介绍
深拷贝:在堆内存中从新开拓一个存储空间,齐全克隆一个截然不同的对象;
浅拷贝:不在堆内存中从新开拓空间,只复制栈内存中的援用地址。
01、递归形式(举荐,我的项目中最平安最罕用)
应用递归的形式进行对象(数组)的深拷贝,奉上已封装的深拷贝函数:
上方函数的应用形式:
// 函数拷贝
const copyObj = (obj = {}) => { // 变量先置空
let newobj = null;
// 判断是否须要持续进行递归
if (typeof (obj) == 'object' && obj !== null) {newobj = obj instanceof Array ? [] : {}; // 进行下一层递归克隆
for (var i in obj) {newobj[i] = copyObj(obj[i])
} // 如果不是对象间接赋值
} else newobj = obj;
return newobj;
}
02、JSON.stringify();(这个不举荐应用,有坑)
一般的对象也能够进行深拷贝,然而!!!当对象内容项为 number,string.boolean 的时候,是没有什么问题的。然而,如果对象内容项为 undefined,null,Date,RegExp,function,error 的时候。应用 JSON.stringify()进行拷贝就会出问题了。
03、应用第三方库 lodash 中的 cloneDeep()办法
是否举荐应用,看状况吧。如果咱们的我的项目中只须要一个深拷贝的性能,这种状况下为了一个性能引入整个第三方库就显得很不值得了。不如写一个递归函数对于我的项目来说性能更好。
lodash.cloneDeep()代码示例:
import lodash from 'lodash';let obj = {a: { c: 2, d: [1, 3, 5], e:'阿巴阿巴'
}, b: 4}const newObj = lodash.cloneDeep(obj);obj.b = 20;console.log(newObj.b); // 输入 4;不会扭转
实际上,cloneDeep()办法底层应用的原本就是递归办法。只是在外层又封装了一层而已。
所以,如果不是原先我的项目中有应用 lodash 这个库的话,大可不必为了这一个性能而去引入它。
04、jquery 的 extend()办法进行深拷贝(举荐在 JQ 中应用)
这个办法仅实用于 JQuery 构建的我的项目。JQuery 本身携带的 extend()办法能够进行深拷贝,不必本人写递归也不必引入第三方库还没什么坑。
在 JQuery 我的项目中的应用形式:
let obj = {a: { c: 2, d: [1, 3, 5], e:'阿巴阿巴'
}, b: 4}let newObj= $.extend(true, {}, obj1); // 拷贝实现 obj.b = 20;console.log(newObj.b); // 输入 4
总结:
进行深拷贝的办法:
递归函数(举荐应用,我的项目中应用的更多,更小,更平安)
JSON.stringify() 和 JSON.parse() ; (不举荐应用, 如果遇到 Function,Date 等类型的变量容易呈现一些意料之外的问题)
第三方库 lodash 的 cloneDeep()办法(就状况而定,如果我的项目中原先就有 lodash 这个第三方库,能够应用,否则还是举荐应用递归函数。不然老本太高。)
JQuery 的 extend()函数 (举荐在 JQuery 我的项目中应用,其余我的项目仍然举荐是用递归函数)