und*_*ned 6 javascript shallow-copy javascript-objects shallow-clone
我了解到,当使用Object.assign()时,它只扩展顶级对象.我怎样才能深度扩展对象?例如,假设我有以下源对象:
const source = {
id: 1,
otherKey: {},
params: {
page: {
a: 1,
b: {}
},
data: {
b: 1
}
}
}
Run Code Online (Sandbox Code Playgroud)
我这样使用Object.assign():
Object.assign({}, source, {
params: {
page: {
a: 2
}
}
}
Run Code Online (Sandbox Code Playgroud)
结果将是:
{
id: 1,
otherKey: {},
params: {
page: {
a: 2
}
}
}
Run Code Online (Sandbox Code Playgroud)
如何以浅克隆方式保留params.data键和params.page.b键.
oldObject.params.data === newObject.params.data // true
oldObject.params.page === newObject.params.page // false
oldObject.params.page.b === newObject.params.page.b // true
Run Code Online (Sandbox Code Playgroud)
注意:此问题与如何深度合并而不是浅合并不同.那里的答案没有给出预期的结果.
检查此bin从上面的链接中获取答案.
因此,在您发布的代码中,如果源和目标都包含相同的密钥,则不会发生任何事情。该对象被递归到子对象。但是,如果您只是将内部块更改为:
if (!target[key]) {
Object.assign(target, { [key]: {} });
}else{
target[key] = Object.assign({}, target[key])
}
mergeDeep(target[key], source[key]);
Run Code Online (Sandbox Code Playgroud)
这将为源和目标中找到的任何键创建一个新的分配对象。但有趣的是,如果您这样做,您的预期falseys将不会显示在控制台中。这是因为目标将始终与结果匹配,因为它是最终的变异对象。因此,为了获得预期的false结果,您需要执行以下操作:
var tester = source.params
const result = mergeDeep(source, b)
console.log(tester === result.params) // this will be false after the above addition
Run Code Online (Sandbox Code Playgroud)
您可以在这里看到您想要的结果:http://jsbin.com/vicemiqiqu/1/edit ?js,console