0 added
0 removed
Original
2026-01-01
Modified
2026-02-26
1
<p>Есть такой код, который я называю "код, который заставляет себя переписывать". Этот код не выглядит плохо и про него нельзя сказать сразу, что он делает что-то плохое. Проблемы проявляются позже - в тот момент, когда нужно внести изменения либо отладить его.</p>
1
<p>Есть такой код, который я называю "код, который заставляет себя переписывать". Этот код не выглядит плохо и про него нельзя сказать сразу, что он делает что-то плохое. Проблемы проявляются позже - в тот момент, когда нужно внести изменения либо отладить его.</p>
2
<p>Рассмотрим пример. В<a>проектах</a>Хекслета студенты часто пишут подобный код:</p>
2
<p>Рассмотрим пример. В<a>проектах</a>Хекслета студенты часто пишут подобный код:</p>
3
<p>На первый взгляд ничего криминального. Здесь извлекается DOM элемент с идентификатором<em>spinner</em>и затем к нему добавляется новый класс<em>d-none</em>.</p>
3
<p>На первый взгляд ничего криминального. Здесь извлекается DOM элемент с идентификатором<em>spinner</em>и затем к нему добавляется новый класс<em>d-none</em>.</p>
4
<p>Теперь представьте, что кроме добавления нового класса, нужно удалить старый. В таком случае код выше часто переписывают следующим образом:</p>
4
<p>Теперь представьте, что кроме добавления нового класса, нужно удалить старый. В таком случае код выше часто переписывают следующим образом:</p>
5
<p><em>Да, не все его так напишут. Но, всё же, как показывает практика, многие просто скопируют строчку и поменяют только последнюю часть.</em></p>
5
<p><em>Да, не все его так напишут. Но, всё же, как показывает практика, многие просто скопируют строчку и поменяют только последнюю часть.</em></p>
6
<p>Сразу бросается в глаза, что произошло дублирование. Причём работа с DOM - недешёвая операция. Такое дублирование приводит к замедлению кода, иногда значительному.</p>
6
<p>Сразу бросается в глаза, что произошло дублирование. Причём работа с DOM - недешёвая операция. Такое дублирование приводит к замедлению кода, иногда значительному.</p>
7
<blockquote><p>Подписывайтесь на<a>канал Кирилла Мокевнина в Telegram</a>- чтобы узнать больше о программировании и профессиональном пути разработчика</p>
7
<blockquote><p>Подписывайтесь на<a>канал Кирилла Мокевнина в Telegram</a>- чтобы узнать больше о программировании и профессиональном пути разработчика</p>
8
</blockquote><p>Посмотрев на этот код, можно подумать, что это косяк того программиста, что выполнил дублирование. Отчасти это так, но проблема глубже. Исходная строчка была написана так, что она "заставляет" переписывать код при любом повторном обращении. В этом коде выполняется сразу две операции:</p>
8
</blockquote><p>Посмотрев на этот код, можно подумать, что это косяк того программиста, что выполнил дублирование. Отчасти это так, но проблема глубже. Исходная строчка была написана так, что она "заставляет" переписывать код при любом повторном обращении. В этом коде выполняется сразу две операции:</p>
9
<ul><li>Извлечение данных</li>
9
<ul><li>Извлечение данных</li>
10
<li>Манипуляция данными</li>
10
<li>Манипуляция данными</li>
11
</ul><p>Как правило, первая операция делается ровно один раз, а вот манипуляций может быть много. Причём обычно они появляются не сразу, а накапливаются в процессе жизни кода. Это значит, что код в любом случае придётся переписать.</p>
11
</ul><p>Как правило, первая операция делается ровно один раз, а вот манипуляций может быть много. Причём обычно они появляются не сразу, а накапливаются в процессе жизни кода. Это значит, что код в любом случае придётся переписать.</p>
12
<p>Поэтому всегда стоит сразу разделять получение данных и их использование:</p>
12
<p>Поэтому всегда стоит сразу разделять получение данных и их использование:</p>
13
<p>Не стоит беспокоиться, что кода станет на одну строчку больше. Это тот самый случай, когда "больше - лучше". Во-первых, у выбранных данных появляется имя (переменная). Благодаря именованию сразу понятно, что это такое, с какой сущностью имеем дело. Во-вторых, в этом коде не появилось дополнительной логики. И он легче читается. Ещё один плюс - проще отладка.</p>
13
<p>Не стоит беспокоиться, что кода станет на одну строчку больше. Это тот самый случай, когда "больше - лучше". Во-первых, у выбранных данных появляется имя (переменная). Благодаря именованию сразу понятно, что это такое, с какой сущностью имеем дело. Во-вторых, в этом коде не появилось дополнительной логики. И он легче читается. Ещё один плюс - проще отладка.</p>
14
<p>Ниже ещё примеры, которые я извлёк из реальных проектов специально для данной статьи.</p>
14
<p>Ниже ещё примеры, которые я извлёк из реальных проектов специально для данной статьи.</p>
15
<h3>Дополнительные материалы:</h3>
15
<h3>Дополнительные материалы:</h3>
16
<ul><li><a>Нисходящее и восходящее проектирование</a></li>
16
<ul><li><a>Нисходящее и восходящее проектирование</a></li>
17
<li><a>Нормализация данных</a></li>
17
<li><a>Нормализация данных</a></li>
18
</ul>
18
</ul>