Правильное копирование объекта в JavaScript.

Вы когда-нибудь были в ситуации, когда вам приходилось присваивать новую переменную другой переменной, которая имеет ссылку на объект, чтобы сделать его копию, и пытались изменить какое-либо его свойство, но понимали, что это влияет и на исходный объект?

let person = {name: "Senmi"}
let copyOfPerson = person
copyOfPerson.name = "Senmikha"
console.log(person.name) // Senmikha

Вы знаете, почему это происходит в первую очередь? Ответ в самом вопросе. Посмотрите над словом ссылка. Не совсем понятно слово ссылка?
Хорошо, давайте посмотрим на изображение ниже.

Как показано на изображении выше, переменная person содержит не фактический объект, а адрес памяти (ссылку), где хранится объект.

Поэтому, когда вы назначаете person в другой переменной copyOfPerson, как указано выше, она также будет иметь ссылку на тот же объект или, другими словами, она также будет указывать на тот же объект. Давайте визуализируем это.

Из вышеизложенного мы теперь уверены, что изменение свойства объекта любой из переменных повлияет друг на друга.

Но что, если вам действительно нужно скопировать объект и сделать его дубликат, чтобы изменение свойства одной переменной не повлияло на другую? Ответ заключается в использовании либо метода Object.assign(), либо использования оператора распространения.

let person = {name: "Senmi"}
let copyOfPerson = Object.assign({},person)
                 or
let copyOfPerson = {...person}
copyOfPerson.name = "Senmikha"
console.log(person.name) // Senmi

В том, что все ? Ну нет! Потому что то, что вы видели выше, — всего лишь пример неглубокого копирования, и оно отлично работает для простого объекта. Но если объект имеет вложенную структуру, то он действительно не будет дублировать исходный объект на 100%. Причина? Такой же. Свойство address имеет ссылку на объект.

let person = {name: "Senmi", address: {location: "Kathmandu"}}
let copyOfPerson = Object.assign({},person)
copyOfPerson.address.location = "Dharan"
console.log(person.address.location) // Dharan

Создание 100% дубликата объекта называется глубокой копией. В Javascript нет встроенного метода для создания глубокой копии вложенного объекта. Либо вы можете использовать Object.assign(), повторяя каждое свойство объекта и делая то же самое с его вложенным объектом, либо вы можете использовать метод cloneDeep() Lodash, который рекурсивно клонирует значение.

Я предлагаю вам использовать последний.