深拷贝和浅拷贝最根本的区别在于是否是真正获取了一个对象的复制实体,而不是引用,
深拷贝在计算机中开辟了一块内存地址用于存放复制的对象,而浅拷贝仅仅是指向被拷贝的内存地址,如果原地址中对象被改变了,那么浅拷贝出来的对象也会相应改变。
深拷贝在计算机中开辟了一块内存地址用于存放复制的对象,而浅拷贝仅仅是指向被拷贝的内存地址,如果原地址中对象被改变了,那么浅拷贝出来的对象也会相应改变。
深拷贝
最简单的方法就是JSON.parse(JSON.stringify())
function deepCopy(o) { return JSON.parse(JSON.stringify(o))}var c = { age: 1, name: undefined, sex: null, tel: /^1[34578]\d{9}$/, say: () => { console.log('hahha') }}// { age: 1, sex: null, tel: {} }
需要注意的是:这种拷贝方法不可以拷贝一些特殊的属性(例如正则表达式,undefined,function)
用递归去复制所有层级属性
var obj = { a: 20, name: '张三', address: { city: 'beijing' }, arr: ['a', 'b', 'c'] }; /** * * 深拷贝 * @param {Object} obj * @returns obj */ function deepClone(obj = {}) { if (typeof obj != 'object' || obj == null) { return obj; } //判断是数组还是对象,是对象result就返回result,是数组就返回数组 let result = Array.isArray(obj) ? [] : {}; for (let key in obj) { //保证key是否是自身的属性,不是原型的属性 if (obj.hasOwnProperty(key)) { result[key] = deepClone(obj[key]) } } return result } var obj1 = deepClone(obj); obj1.address.city = '上海' console.log(obj.address.city)
浅拷贝
Object.assign 方法只复制源对象中可枚举的属性和对象自身的属性
如果目标对象中的属性具有相同的键,则属性将被源中的属性覆盖。后来的源的属性将类似地覆盖早先的属性
Object.assign 会跳过那些值为 [null] null 是一个 JavaScript 字面量,表示空值(null or an "empty" value),即没有对象被呈现(no object value is present)。它是 JavaScript 原始值 之一。") 或 undefined 的源对象。
如果目标对象中的属性具有相同的键,则属性将被源中的属性覆盖。后来的源的属性将类似地覆盖早先的属性
Object.assign 会跳过那些值为 [null] null 是一个 JavaScript 字面量,表示空值(null or an "empty" value),即没有对象被呈现(no object value is present)。它是 JavaScript 原始值 之一。") 或 undefined 的源对象。
发表评论
侧栏公告
寄语
譬如朝露博客是一个分享前端知识的网站,联系方式11523518。
热评文章
标签列表
热门文章
友情链接