Javascript 为什么map（）会在嵌套数组中改变原始对象？

我正试图使用map（）创建一个新的对象数组（usersData），以便添加一个新属性，该属性由一个辅助数组（countries）中的值赋值。 在我的测试中，我注意到我原来的对象数组（用户）已经被修改，新属性（countryName）也被添加到其中。当我使用map为我的数组国家创建一个新的对象数组时，没有发生同样的情况。 有人能告诉我是什么导致了这种情况，并帮助我了解如何避免这种行为吗

const countries = [
  { id: 3, countryName : "UK" },
  { id: 4, countryName : "Spain" },
  { id: 6, countryName : "Germany"}
];

const users = [
  { id : 1,
    name: "Douglas Camp",
    dateOfBirth: "23-06-1984",
    contactDetails:
      {
        country: 3,
        phone: "7373724997"
      }
  },
  {
    id : 2,
    name: "Martin Stein",
    dateOfBirth: "19-08-1992",
    contactDetails:
      {
        country: 6,
        phone: "3334343434"
      }
  },
];

const usersData = users.map(user=> {
  const newUser = {};
  newUser.name = user.name;
  newUser.contactDetails = user.contactDetails;
  newUser.contactDetails.countryName = "UK";
  return newUser;
});

const countriesData = countries.map(country =>
  {
    const newCountry = {};
    newCountry.name = country.countryName;
    newCountry.continent = "Europe";
    return newCountry;
});
console.log(countries);  
console.log(countriesData); 
console.log(users);
console.log(usersData);

---

我希望阵列用户中的元素保持其原始结构，但现在它的属性contactDetails.countryName设置为“UK”

您正在构建一个新阵列。这并不意味着您也要在阵列中构建新的一切

这：

正在重用原始数组元素中的

user.contactDetails

对象，因此：

newUser.contactDetails.countryName = "UK";

---

正在修改新数组和旧数组之间共享的对象。

在

用户.map（）的每次迭代中，
用户.contactDetails
保存对存储在新
新用户.contactDetails
中的
对象的引用。因此，两者都将引用内存中的同一对象。在您的特定情况下，您可以解决将
user.contactDetails
传播到新对象中的问题（就像克隆它的一种方式）。但请注意，这只适用于
1级
deep对象。如果您的结构更复杂，您应该搜索
深度克隆


const countries=[{id:3，countryName:“英国”}，{id:4，countryName:“西班牙”}，{id:6，countryName:“德国”}]；
const users=[{id:1，姓名：“道格拉斯阵营”，出生日期：“23-06-1984”，联系方式：{国家：3，电话：“7373724997”}，{id:2，姓名：“马丁·斯坦”，出生日期：“19-08-1992”，联系方式：{国家：6，电话：“333434”}，]；
const usersData=users.map（user=>
{
const newUser={}；
newUser.name=user.name；
newUser.contactDetails={…user.contactDetails}；
newUser.contactDetails.countryName=“英国”；
返回新用户；
});
const countriesData=countries.map（country=>
{
const newCountry={}；
newCountry.name=country.countryName；
newCountry.continent=“欧洲”；
返回新国家；
});
console.log（“国家：”，国家）；
console.log（“countriesData:”，countriesData）；
日志（“用户：”，用户）；
log（“usersData:”，usersData）
.as控制台{背景色：黑色！重要；颜色：石灰；}
.作为控制台包装{最大高度：100%！重要；顶部：0；}
Good catch；我建议添加解决方案来解决问题（例如，使用
Object.assign
克隆对象）。您可以更改原始数据。非常感谢您的回复。我假设这只发生在嵌套对象数组中，因为使用map（）迭代国家时没有相同的结果。我说的对吗？当您将引用复制到另一个变量中的非基元类型时，就会发生这种情况。您可以阅读下一个链接以了解更多信息：
newUser.contactDetails.countryName = "UK";