当前位置: 首页 > Web前端 > HTML5

前端面试经典题:Object.assign是浅拷贝还是深拷贝?实现深拷贝的方法有哪些?

时间:2023-04-04 23:28:52 HTML5

Object.assign()方法用于将所有可枚举属性的值从一个或多个源对象复制到一个目标对象。它将返回目标对象。如果目标对象中的属性具有相同的键,则该属性将被源对象中的属性覆盖。较晚的源对象的属性将类似地覆盖较早的源对象的属性。Object.assign方法只是将源对象本身的可枚举属性复制到目标对象。该方法使用了源对象的[[Get]]和目标对象的[[Set]],所以调用了相关的getter和setter。因此,它分配属性,而不仅仅是复制或定义新属性。如果合并的源包含getter,这可能使其不适合将新属性合并到原型中。为了将属性定义(包括它们的可枚举性)复制到原型,应该使用Object.getOwnPropertyDescriptor()和Object.defineProperty()。String和Symbol类型的属性将被复制。如果出现错误,例如如果属性不可写,则引发TypeError,如果在引发错误之前添加了任何属性,则可以更改目标对象。当那些源对象值为空或未定义时,Object.assign不会抛出错误。对于深度复制,需要使用其他方法,因为Object.assign()复制属性值。如果源对象的属性值是对某个对象的引用,则它只指向该引用。也就是说,如果对象的属性值是简单类型(如字符串,数字),通过Object.assign({},srcObj);得到的新对象;是深拷贝;如果属性值是一个对象或者其他引用类型,那么对于Thisobject实际上是一个浅拷贝。深拷贝JSON.stringify和JSON.parse的几种实现方式是使用JSON.stringify将对象转为字符串,再使用JSON.parse将字符串转为新的对象。只有可以转换为JSON格式的对象才能使用该方法。如果对象包含函数或RegExp,则不能使用此方法。//利用js内置对象json对数组对象进行深拷贝functiondeepClone(obj){let_obj=JSON.stringify(obj);让objClone=JSON.parse(_obj);returnobjClone;}Object.assign()Copy当对象中只有一级属性,没有二级属性时,该方法为深拷贝,当对象中有对象时,该方法为浅拷贝二级属性之后。通过jQuery的extend方法实现深拷贝let$=require('jquery');letobj1={a:1,b:{f:{g:1}},c:[1,2,3]};letobj2=$.extend(真,{},obj1);lodash.cloneDeep()实现深拷贝let_=require('lodash');让obj1={a:1,b:{f:{g:1}},c:[1,2,3]};让obj2=_.cloneDeep(obj1);使用递归方式实现深拷贝函数_deepClone(source){lettarget;if(typeofsource==='object'){target=Array.isArray(source)?[]:{}for(letkeyinsource){if(source.hasOwnProperty(key)){if(typeofsource[key]!=='object'){target[key]=source[key]}else{target[key]=_deepClone(source[key])}}}}else{target=source}returntarget}更多经典前端面试题,请到github查看或参与讨论https://github。com/daily-interview/fe-interview