Удаление ключа объекта также удаляет ключ другого объекта - Javascript

Question

У меня возникла особенная проблема с Javascript. Я пытаюсь сохранить форму объекта состояния / словарь (dict1) и конечный объект / словарь (dict2) , который я должен опубликовать.

I назначить объект dict1 моему объекту dict2 при нажатии на некоторые кнопки. Я хочу удалить ключ в dict2, но поведение своеобразное, поскольку он также удаляет ключ из dict1 . Ниже мой код:

dict1 = {
    123:{
    456:2
  }
}

dict2 = {}

dict2[123] = dict1[123]


delete dict2[123][456]


console.log(dict1)

// It logs {123 : {} } whereas the dict1 shouldn't change

Кажется, что объекты каким-то образом неглубоко копируются.

Answer 1

Используйте оператор распространения (...), чтобы создать «дубликат» объекта, чтобы не изменять оригинал.

Первоначально вы копировали ссылку, хранящуюся в dict1[123], в dict2[123]. Это означает, что оба свойства dict указывают на один и тот же объект, и изменения, сделанные из одного dict, можно увидеть из другого. Используя оператор распространения, вы добавляете все содержимое объекта в новый. Это означает, что dict1[123] и dict2[123] будут хранить 2 разные ссылки, содержащие одинаковые данные, и вы можете изменять их независимо.

Подробнее об операторе распространения здесь .

dict1 = {
  123:{
    456:2
  }
}

dict2 = {}

dict2[123] = {...dict1[123]}

delete dict2[123][456]

console.log(dict1)
console.log(dict2)