0 added
0 removed
Original
2026-01-01
Modified
2026-02-26
1
<p>Клонирование объектов - еще одна часто встречающаяся операция в разработке, особенно во фронтенде. При клонировании создается копия исходного объекта - то есть новый объект, наполненный теми же данными.</p>
1
<p>Клонирование объектов - еще одна часто встречающаяся операция в разработке, особенно во фронтенде. При клонировании создается копия исходного объекта - то есть новый объект, наполненный теми же данными.</p>
2
<p>В JavaScript клонирование можно эмулировать с помощью Object.assign(). Для этого нужно первым параметром передать пустой объект, а вторым - тот, который нужно клонировать:</p>
2
<p>В JavaScript клонирование можно эмулировать с помощью Object.assign(). Для этого нужно первым параметром передать пустой объект, а вторым - тот, который нужно клонировать:</p>
3
<p>В результате получаются два разных объекта с одним и тем же содержимым. Объекты разные, поэтому изменения в одном не меняют данные в другом.</p>
3
<p>В результате получаются два разных объекта с одним и тем же содержимым. Объекты разные, поэтому изменения в одном не меняют данные в другом.</p>
4
<p>Клонирование также выполняют с помощью функции<a>clone()</a>библиотеки<em>lodash</em>. Результат выполнения этой функции идентичен примерам выше, но благодаря своему имени, она лучше выражает смысл операции:</p>
4
<p>Клонирование также выполняют с помощью функции<a>clone()</a>библиотеки<em>lodash</em>. Результат выполнения этой функции идентичен примерам выше, но благодаря своему имени, она лучше выражает смысл операции:</p>
5
<p>Клонирование способами выше не затрагивает вложенные объекты. Они оказываются в новом объекте по ссылке из старого:</p>
5
<p>Клонирование способами выше не затрагивает вложенные объекты. Они оказываются в новом объекте по ссылке из старого:</p>
6
<p>Такое клонирование называется<strong>поверхностным</strong>(<em>shallow copying</em>). Очень важно запомнить, что именно это имеют в виду в JavaScript, когда употребляют термин "клонирование". Поверхностное клонирование подходит для многих ситуаций, но иногда его недостаточно. В таких случаях нужно использовать<strong>полное</strong>или<strong>глубокое клонирование</strong>(<em>deep copying</em>).</p>
6
<p>Такое клонирование называется<strong>поверхностным</strong>(<em>shallow copying</em>). Очень важно запомнить, что именно это имеют в виду в JavaScript, когда употребляют термин "клонирование". Поверхностное клонирование подходит для многих ситуаций, но иногда его недостаточно. В таких случаях нужно использовать<strong>полное</strong>или<strong>глубокое клонирование</strong>(<em>deep copying</em>).</p>
7
<p>В JavaScript есть встроенный метод structuredClone(), c помощью которого можно выполнить глубокое копирование объектов:</p>
7
<p>В JavaScript есть встроенный метод structuredClone(), c помощью которого можно выполнить глубокое копирование объектов:</p>
8
<p>Библиотека<em>lodash</em>также предоставляет готовую функцию<a>cloneDeep()</a>. Она была распространенным решением проблемы глубокого копирования, пока не появился метод structuredClone().</p>
8
<p>Библиотека<em>lodash</em>также предоставляет готовую функцию<a>cloneDeep()</a>. Она была распространенным решением проблемы глубокого копирования, пока не появился метод structuredClone().</p>
9
<p>У полного клонирования есть один серьезный недостаток. Если мы работаем с большим объектом со сложной структурой, то полное клонирование может сильно влиять на производительность. Это одна из причин, почему такое клонирование не выполняется по умолчанию.</p>
9
<p>У полного клонирования есть один серьезный недостаток. Если мы работаем с большим объектом со сложной структурой, то полное клонирование может сильно влиять на производительность. Это одна из причин, почему такое клонирование не выполняется по умолчанию.</p>