Почему изменение одного свойства (объекта) также изменяется в другом и отдельно объявленном свойстве? - PullRequest
Новая
       17

Почему изменение одного свойства (объекта) также изменяется в другом и отдельно объявленном свойстве?

0 голосов
/ 26 апреля 2019

У меня есть 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 не влияли изменения, сделанные в FilterRequirements?

Ответы [ 2 ]

2 голосов
/ 26 апреля 2019

Попробуйте это: 

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}
}
1 голос
/ 26 апреля 2019

Хорошо, поэтому объявленный вами объект myData.property1.countryDocument не является примитивным / ссылочным значением. Так что это означает, что и this.defaultRequirements, и this.filteredRequirements указывают буквально на один и тот же фрагмент данных.

Если бы вы делали это с примитивным значением (например: a string), вы бы получили копию; так что this.defaultRequirements и this.filteredRequirements будут полностью отделены друг от друга, и ими можно будет манипулировать, не влияя друг на друга.

Дублировать / копировать объект так, как вы задумали, вполне возможно, и уже было много дискуссий по этому поводу, которые я не буду дублировать; Я бы посоветовал взглянуть на этот , который прекрасно его охватывает.

...