Способы копирования объектов в JavaScript[2]
🔍 Глубокое копирование - это создание дубликата исходного объекта, при этом копируются не только сам объект и его примитивные свойства, но и все вложенные объекты, массивы, функции, и другие ссылочные типы данных. Это означает, что каждый элемент исходного объекта, включая все уровни вложенности, будет скопирован в новый, независимый объект. Таким образом, изменения в копии не повлияют на исходный объект и наоборот.
Допустим, у нас есть объект машины:
Если мы попробуем просто скопировать этот объект, то получим новую машину, НО владельцем будет все тот же Ruslan с паспортом AB123456. То есть, если мы решим поменять имя владельца car2, то имя владельца car1 также изменится, потому что оба объекта ссылаются на один и тот же объект владельца.
Один из способов сделать глубокую копию:
Логика такая, что мы объект сначала превратили в строку, разумеется тут не может идти речи о сохранении ссылок. Далее мы эту строку преобразуем обратно в объект. На выходе получаем глубокую копию исходного объекта.
Это подход работает в большинстве случаев, НО стоит знать, что он имеет свои ограничения. Например, он не сможет корректно скопировать функции и объекты, содержащие циклические ссылки, поскольку JSON не поддерживает эти структуры данных. Так же если объект содержит свойства со значением undefined, то они будут пропущены в строковом представлении.
#JavaScript #обучающийПост #Objects #clone #copy #deepCopy
🔍 Глубокое копирование - это создание дубликата исходного объекта, при этом копируются не только сам объект и его примитивные свойства, но и все вложенные объекты, массивы, функции, и другие ссылочные типы данных. Это означает, что каждый элемент исходного объекта, включая все уровни вложенности, будет скопирован в новый, независимый объект. Таким образом, изменения в копии не повлияют на исходный объект и наоборот.
Допустим, у нас есть объект машины:
const car1 = {
brand: "Toyota",
model: "Camry",
owner: {
name: "Ruslan",
passport: "AB123456"
}
};Если мы попробуем просто скопировать этот объект, то получим новую машину, НО владельцем будет все тот же Ruslan с паспортом AB123456. То есть, если мы решим поменять имя владельца car2, то имя владельца car1 также изменится, потому что оба объекта ссылаются на один и тот же объект владельца.
Один из способов сделать глубокую копию:
const stringObj = JSON.stringify(car1);
const car3 = JSON.parse(stringObj);Логика такая, что мы объект сначала превратили в строку, разумеется тут не может идти речи о сохранении ссылок. Далее мы эту строку преобразуем обратно в объект. На выходе получаем глубокую копию исходного объекта.
Это подход работает в большинстве случаев, НО стоит знать, что он имеет свои ограничения. Например, он не сможет корректно скопировать функции и объекты, содержащие циклические ссылки, поскольку JSON не поддерживает эти структуры данных. Так же если объект содержит свойства со значением undefined, то они будут пропущены в строковом представлении.
#JavaScript #обучающийПост #Objects #clone #copy #deepCopy
👍7❤2🤝1
Функция для глубокого копирования объектов
1️⃣ Проверка наличия и типа объекта
Проверяем, существует ли
Если
Здесь мы гарантируем, что функция будет применена только к объектам или массивам.
2️⃣ Обработка массивов
Устанавливаем, является ли
Создаем новый пустой массив
Этот этап обеспечивает глубокое копирование каждого элемента массива, включая вложенные объекты и массивы.
3️⃣ Обработка объектов
Если
Создаем пустой объект
Так мы гарантируем, что все собственные свойства объекта, включая вложенные объекты, будут глубоко скопированы.
#JavaScript #code #Objects #deepCopy
1️⃣ Проверка наличия и типа объекта
Проверяем, существует ли
obj и является ли он объектом.Если
obj равен null или его тип данных не 'object', функция возвращает obj, не производя дополнительных действий.Здесь мы гарантируем, что функция будет применена только к объектам или массивам.
2️⃣ Обработка массивов
Устанавливаем, является ли
obj массивом.Создаем новый пустой массив
arrCopy и проходим по всем элементам obj. Примитивные значения копируются напрямую, а для объектов вызывается функция deepClone рекурсивно.Этот этап обеспечивает глубокое копирование каждого элемента массива, включая вложенные объекты и массивы.
3️⃣ Обработка объектов
Если
obj не массив, но объект, начинаем процесс копирования объекта.Создаем пустой объект
objCopy. Для каждого свойства obj, проверяем, является ли оно собственным с помощью метода hasOwnProperty. Собственные свойства копируются. Если значение свойства - объект, функция deepClone вызывается рекурсивно.Так мы гарантируем, что все собственные свойства объекта, включая вложенные объекты, будут глубоко скопированы.
#JavaScript #code #Objects #deepCopy
👍4