Question

我有2个这样声明的属性：

ngOnInit() {
this.defaultRequirements = myData.property1.countryDocument; //should never change
this.filteredRequirements = myData.property1.countryDocument; 
}

当我运行此onFilter函数时，defaultRequirements属性也会发生突变。

onFilter(selectedSections) {
    let index = -1;

    this.defaultRequirements.forEach(country => {
      index++;
      const filteredSectionsList = [];

      country.section.forEach(section => {
        selectedSections.value.forEach(selectedSelection => {
          const selection = selectedSelection.split(/\s*[-]\s*/);  

          if (country.countryCode === selection[0]) {
            console.log('matched');
            filteredSectionsList.push(section);
          }
        });

        const countryObj = Object.assign({}, country, {
          section: [...filteredSectionsList]
        })

// Here is the issue, when filtering, this.defaultRequirements also gets changed!
        this.filteredRequirements[index] = countryObj;


      })
    })

}

问题

我不明白如何对this.filteredRequirements进行突变也对this.defaultRequirements进行突变（它们都等同于同一件事）！如何避免这种行为并使defaultRequirements不受filteredRequirements上所做更改的影响？

Answer 1

尝试一下：

ngOnInit() {
    this.defaultRequirements = JSON.parse(JSON.stringify(myData.property1.countryDocument));   
    this.filteredRequirements = JSON.parse(JSON.stringify(myData.property1.countryDocument));
}

或

ngOnInit() {
    this.defaultRequirements = {...myData.property1.countryDocument}
    this.filteredRequirements = {...myData.property1.countryDocument}
}

Answer 2

好的，所以您声明的对象myData.property1.countryDocument是非原始/引用值。因此，这意味着this.defaultRequirements和this.filteredRequirements都指向了实际上相同的数据。

如果要使用原始值（例如string）执行此操作，则会得到一个副本；因此this.defaultRequirements和this.filteredRequirements将完全分开，并且可以互不影响地进行操作。

以您想要的方式复制/复制对象是完全可能的，并且已经有很多关于该对象的讨论，我不会复制。我建议you take a look at this很好地介绍它。

为什么更改一个属性（对象）也会在另一个单独声明的属性中发生变化？

2 个答案: