Question

我尝试使用.map，.filter来处理基于深层嵌套属性的大型嵌套JSON对象。使用以下代码，原始的data和filtered数据最终都会被修改，但我试图让原始data保持原样。我希望做的是在给定id的最终concerns对象中清空深度嵌套的filtered数组，将原始data保留为原始完整数据集。

var data {...};

var dataFilter = function dataBuild(data) {
  var newData = data;

  newData.service_requests = newData.service_requests.map((request) => {
    request.concerns = request.concerns.filter((concern) => {
      return concern.building_id == 2
    });
    return request;
  });

    return newData;
};

var filtered = dataFilter(data);

这里是我试图用那里的完整对象做的事情的小提琴。 http://jsbin.com/doyoqinoxo/edit?js,console

Answer 1

当你这样做时：

var newData = data;

你只是对同一个对象进行第二次引用，所以：

newData.service_requests = ...

覆盖 data.service_requests 中的值。

您似乎希望 newData 是数据的副本，而不是对同一对象的引用。这里有很多关于如何复制嵌套对象（所谓的深拷贝）的帖子，例如What is the most efficient way to clone an object?，但请忽略已接受的答案，除非您使用的是jQuery。使用其中一个答案，例如this one。

Answer 2

JSIterator .map（）创建具有相同数量元素的新数组，或者不更改原始数组。如果数组内部复制了相同的引用，则引用可能存在问题，因此，当您对对象的属性进行任何更改时，它将更改具有相同引用的元素的原始值。

解决方案是复制对象，在这种情况下，array.Splice()和[...array]（扩展运算符）无济于事，您可以使用Loadash之类的JavaScript Utility库，也可以只使用使用以下提及代码：

const newList = JSON.parse(JSON.stringify(orinalArr))

使用forEach，map或filter克隆和操作嵌套对象，而无需修改原始对象

2 个答案: