Clean Code JavaScript - Как писать код, который не стыдно показать коллегам
Репозиторий давно не обновлялся
Последнее обновление было 2 года назад.
Знакомо ли вам чувство, когда открываешь старый код и не можешь понять, что же ты имел в виду? Или когда коллега просит помочь разобраться в его скрипте, а ты тратишь часы на расшифровку? Репозиторий Clean Code JavaScript — это коллекция практических правил, которые помогут сделать ваш код понятным, поддерживаемым и профессиональным.
Почему чистый код так важен?
За 15 лет работы с JavaScript я видел сотни проектов. И главная проблема большинства из них — не сложность алгоритмов, а нечитаемость кода. Мы тратим в 10 раз больше времени на чтение кода, чем на его написание. Clean Code JavaScript — это адаптация знаменитой книги Роберта Мартина "Чистый код" для мира JavaScript.
Как говорит автор репозитория Райан Макдермотт:
"Каждый кусок кода начинается как черновик, как мокрая глина, принимающая свою окончательную форму. Мы высекаем недочеты, когда проверяем его с коллегами."
5 ключевых принципов из репозитория
1. Осмысленные имена переменных
Первый шаг к чистому коду — правильные имена. Они должны быть:
- Произносимыми
- Поисковыми (чтобы можно было найти через Ctrl+F)
- Не требующими мысленного перевода
Плохо:
const yyyymmdstr = moment().format('YYYY/MM/DD');
Хорошо:
const currentDate = moment().format('YYYY/MM/DD');
2. Функции должны делать что-то одно
Эта ошибка встречается в 90% проектов. Функция — это не роман, а короткое стихотворение.
Плохо:
function emailClients(clients) {
clients.forEach(client => {
const record = database.lookup(client);
if (record.isActive()) email(client);
});
}
Хорошо:
function emailActiveClients(clients) {
clients.filter(isActiveClient).forEach(email);
}
function isActiveClient(client) {
const record = database.lookup(client);
return record.isActive();
}
3. Избегайте побочных эффектов
Функция не должна изменять что-то вне своей зоны ответственности. Особенно это касается работы с массивами и объектами.
Плохо:
const addItemToCart = (cart, item) => {
cart.push({ item, date: Date.now() });
};
Хорошо:
const addItemToCart = (cart, item) => {
return [...cart, { item, date: Date.now() }];
};
4. SOLID для JavaScript
Принципы SOLID работают не только в Java и C#. Вот как выглядит Dependency Inversion в JS:
Плохо:
class InventoryTracker {
constructor(items) {
this.items = items;
this.requester = new InventoryRequester();
}
}
Хорошо:
class InventoryTracker {
constructor(items, requester) {
this.items = items;
this.requester = requester;
}
}
5. Тестируемость
Чистый код — это тестируемый код. Каждая функция должна иметь одну ответственность и предсказуемый результат.
Плохо:
describe('MomentJS', () => {
it('handles all cases', () => {
// 20 строк теста разных сценариев
});
});
Хорошо:
describe('MomentJS', () => {
it('handles 30-day months', () => {
// один четкий сценарий
});
it('handles leap year', () => {
// другой сценарий
});
});
Кому будет полезен этот репозиторий?
- Джуниор-разработчикам: Поймете, чем отличается рабочий код от хорошего кода
- Тимлидам: Сможете использовать эти принципы для code review
- Преподавателям: Получите отличные примеры для курсов по JavaScript
- Фрилансерам: Клиенты ценят чистый и поддерживаемый код
Личный опыт внедрения
В моей практике был проект с 50 файлами по 500+ строк кода каждый. После внедрения принципов Clean Code:
- Время добавления новых функций сократилось на 40%
- Количество багов в production упало в 3 раза
- Новые разработчики входили в проект в 2 раза быстрее
Как начать использовать?
- Добавьте репозиторий в закладки
- Выберите 2-3 правила, которые нарушаете чаще всего
- Начните применять их в новом коде
- Постепенно рефакторите старые участки
Как говорит автор: "Эти правила не догма, а руководство. Наша профессия молода, и мы все еще учимся".
Ссылки:
