Глубокое клонирование объекта

Введение

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

Skills Graph

Инструкции по глубокому клонированию объекта

Для глубокого клонирования объекта следуйте шагам:

1. Создайте новую терминал/экземпляр SSH и введите node, чтобы начать практиковаться в написании кода.
2. Используйте рекурсию для клонирования примитивов, массивов и объектов, исключая экземпляры классов.
3. Проверьте, является ли переданный объект null, и если да, верните null.
4. Используйте Object.assign() и пустой объект ({}), чтобы создать поверхностную копию исходного объекта.
5. Используйте Object.keys() и Array.prototype.forEach(), чтобы определить, какие пары ключ-значение нужно глубоко скопировать.
6. Если объект является Array, задайте length клона равным длине исходного и используйте Array.from(), чтобы создать клон.
7. Используйте следующий код для реализации глубокого клонирования:

const deepClone = (obj) => {
  if (obj === null) return null;
  let clone = Object.assign({}, obj);
  Object.keys(clone).forEach(
    (key) =>
      (clone[key] =
        typeof obj[key] === "object" ? deepClone(obj[key]) : obj[key])
  );
  if (Array.isArray(obj)) {
    clone.length = obj.length;
    return Array.from(clone);
  }
  return clone;
};

Используйте следующий код для тестирования вашей функции глубокого клонирования:

const a = { foo: "bar", obj: { a: 1, b: 2 } };
const b = deepClone(a); // a!== b, a.obj!== b.obj

Резюме

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