В этом примере вы научитесь писать программу, которая клонирует объект.
Чтобы понять этот пример, вы должны знать следующие темы программирования JavaScript:
- Объекты JavaScript
- JavaScript Object.assign ()
Объект JavaScript - это сложный тип данных, который может содержать различные типы данных. Например,
const person = ( name: 'John', age: 21, )
Вот personобъект. Теперь вы не можете клонировать объект, делая что-то подобное.
const copy = person; console.log(copy); // (name: "John", age: 21)
В приведенной выше программе copyпеременная имеет то же значение, что и personобъект. Однако, если вы измените значение copyобъекта, значение в personобъекте также изменится. Например,
copy.name = 'Peter'; console.log(copy.name); // Peter console.log(person.name); // Peter
Изменение наблюдается в обоих объектах, поскольку объекты относятся к ссылочным типам . И оба copyи personуказывают на один и тот же объект.
Пример 1. Клонируйте объект с помощью Object.assign ()
// program to clone the object // declaring object const person = ( name: 'John', age: 21, ) // cloning the object const clonePerson = Object.assign((), person); console.log(clonePerson); // changing the value of clonePerson clonePerson.name = 'Peter'; console.log(clonePerson.name); console.log(person.name);
Вывод
(имя: "Джон", возраст: 21) Питер Джон
Object.assign()Метод является частью ES6 стандарта. В Object.assign()методе выполняет глубокое копирование и копирует все свойства из одного или нескольких объектов.
Примечание . Значение empty ()в качестве первого аргумента гарантирует, что вы не измените исходный объект.
Пример 2: Клонирование объекта с использованием синтаксиса распространения
// program to clone the object // declaring object const person = ( name: 'John', age: 21, ) // cloning the object const clonePerson = (… person) console.log(clonePerson); // changing the value of clonePerson clonePerson.name = 'Peter'; console.log(clonePerson.name); console.log(person.name);
Вывод
(имя: "Джон", возраст: 21) Питер Джон
Синтаксис распространения … был введен в более поздней версии (ES6).
Синтаксис распространения можно использовать для создания неглубокой копии объекта. Это означает, что он скопирует объект. Однако упоминаются более глубокие объекты. Например,
const person = ( name: 'John', age: 21, // the inner objects will change in the shallow copy marks: ( math: 66, english: 73) ) // cloning the object const clonePerson = (… person) console.log(clonePerson); // (name: "John", age: 21, marks: (… )) // changing the value of clonePerson clonePerson.marks.math = 100; console.log(clonePerson.marks.math); // 100 console.log(person.marks.math); // 100
Здесь, когда значение внутреннего объекта mathизменяются на 100 из clonePersonобъекта, значение mathключа personобъекта также изменяется.
Пример 3: клонировать объект с помощью JSON.parse ()
// program to clone the object // declaring object const person = ( name: 'John', age: 21, ) // cloning the object const clonePerson = JSON.parse(JSON.stringify(person)); console.log(clonePerson); // changing the value of clonePerson clonePerson.name = 'Peter'; console.log(clonePerson.name); console.log(person.name);
Вывод
(имя: "Джон", возраст: 21) Питер Джон
В приведенной выше программе этот JSON.parse()метод используется для клонирования объекта.
Примечание : JSON.parse()работает только с литералом объекта Numberи String. Он не работает с литералом объекта со свойствами functionили symbol.
