Javascript通过对象合并覆盖嵌套对象的一部分答案

【问题标题】：Javascript overwrite part of a nested object with object mergingJavascript通过对象合并覆盖嵌套对象的一部分
【发布时间】：2021-12-30 08:13:01
【问题描述】：

我正在开发一个 JS 项目，我需要在其中覆盖包含嵌套对象的对象中的一些值。

我通常会使用以下内容：

const merged = { ...application, ...customer }

这样customer 内的任何数据都可以覆盖application。

但是，在我的示例中，customer 覆盖了整个 applicant 嵌套对象，我只需要覆盖该对象中的名称？

我整理了一个 JS fiddle，可以在 here 找到，我错过了什么？

const customer = {
  applicant: {
    first_name: 'john'
  }
}

const application = {
  applicant: {
    first_name: 'edward',
    age: 50
  },
  income: {
    salary: 500
  }
}

const merged = { ...application, ...customer }

console.log(merged)

在merged 中，我希望first_name 是“John”，而其他一切都保持不变。

【问题讨论】：

我错过了什么？ - 这不是递归操作。 ...application 获取application 的字段，所以applicant 和income，然后...customer 用自己的字段覆盖applicant。
这能回答你的问题吗？ How to deep merge instead of shallow merge?

标签： javascript object ecmascript-6

【解决方案1】：

您要通过扩展替换的属性必须位于对象的顶层。在这种情况下，您获取应用程序的顶级属性，即申请人和收入，然后将申请人的财产替换为来自客户的财产。如果您想替换名称，则需要类似

const merged = {
  ...application, 
  applicant: {...application.applicant, ...customer.applicant}
};

【讨论】：

这给出了Unexpected token的语法错误
我把花括号放错了位置，修复了。

【解决方案2】：

你可以用 lodash 轻松做到这一点

const merged = _.merge(customer, application)

https://lodash.com/docs/4.17.15#merge

【讨论】：

我知道 lodash 有很多有用的实用方法，但是 OP 既没有提到也没有要求 lodash 解决方案