JavaScript

Про любимую JS-очку

подборка · 17 материалов

6 месяцев назад

Как избавиться от магических чисел в коде — простой рефакторинг за 15 минут

В каждом проекте есть код с временными интервалами. Вот типичные примеры: const COOKIE_TTL = 2592000; // 30 дней в секундах? const CACHE_EXPIRE = 1800000; // 30 минут в миллисекундах? const API_TIMEOUT = 5000; // 5 секунд? Проблемы этого кода: Разные API и системы ожидают время в разных форматах, например - Куки → секунды, setTimeout → миллисекунды. Без явного указания единиц легко ошибиться Даже зная, что: 3600 = 1 час в секундах 86400 = 1 день в секундах Приходится мысленно преобразовывать...

Tominoff

6 месяцев назад

🤯 JavaScript: Spread-оператор и его причуды с undefined

Spread-оператор (...) — мощный инструмент, но его поведение с undefined и null может сломать мозг. Посмотрите на эти примеры: console.log('fun', ((...undefined) => {})()); // ✅ fun [] console.log('obj', { ...undefined, ...null }); // ✅ obj {} console.log('arr', [ ...undefined ]); // ❌ TypeError! Что здесь происходит? – Здесь ...undefined — это корректный синтаксис для пустого списка аргументов. – Результат — пустой массив [], потому что ничего не передано. – Spread игнорирует undefined и null, как будто их нет...

Tominoff

7 месяцев назад

А вы знали, что в JS есть два нуля? 🤯

Да-да, есть 0 и -0. И да, они равны друг другу (-0 === 0), но всё же не идентичны Object.is(0, -0) === false. Главный парадокс: -0 === 0 // true 1/-0 === -Infinity // а 1/0 === Infinity Где JS различает нули: Математические операции: assert.strict. equal(-0, 0) // Будет выброшена ошибка в тесте Math.sign(-0) // -0 (да, не -1!) Math.pow(-0, 3) // -0 Math.pow(-0, 2) // 0 Тригонометрия (сохраняет знак): Math.atan2(-0, 1) // -0 Math.sin(-0) // -0 Специальные проверки: Object.is(0, -0) // false Во всех прочих случаях, JS плевать на знак нуля: `${-0}` // -> "0" JSON...

Tominoff

1 год назад

Довелось почитать немного исходники популярных логеров... const info = msg && msg.message && msg || { message: msg }; Это работает потому что в JS при выполнении булевых операторов возвращается не булевое значение true/false, а последнее truthy значение. Я такое не одобряю. Лучше написать больше, но понятнее. Следующая строка тоже радует. info.level = info[LEVEL] = level; В Pino логере тоже они забавно делают - непривычно на самом деле видеть что-то такое: function transport(fullOptions) { // ... return buildStream(fixTarget(target), options, worker, sync) function fixTarget (origin) { // ... } } Ребята в курсах про hoisting - это здорово, но вот нафиг оно, блин, надо было? Как по мне - за такие хакерства в приличном обществе должны проходиться канделябрами по лицу, а не звёзды тысячами ставить на gh:)

Tominoff

1 год назад

Удивительно что при стремительном развитии js никто не догадался добавить операторы not/and/or/xor. И если с последними ещё не так уж всё и страшно, то вот not иногда может неплохо прокачать читаемость кода. Конечно, можно и методы переназвать или даже функцию-шорткат сделать, но это костылище. И если во времена ископаемого железа все эти символы можно было оправдать экономией места на диске, то сейчас их существование это прям бредище

Tominoff

2 года назад

Недавно писал про AlpineJS - вещь оказалась реально годная.🔥 Это прям лучший кандидат на постепенную и бюджетную модернизацию старых проектов с jQuery лапшой. Лучшее его качество - реально хорошо работает как сторонняя библиотека не нарушающая имеющуюся структуру (давненько я уже не видел unobstructive javascript подходов в современном фронтенде) - тебе не обязательно выбрасывать всё и переделывать проект на каком нибудь jsx, тебе не нужно сильно упарываться с менеджментом состояния и тебе не надо запариваться с mvvm как в backbone - всё предельно просто. Главное при этом понимать для чего альпин хорош, а для чего он не очень подходит - большие и средние проекты я б не отважился на нём делать. Сейчас у меня альпин используется для рендеринга бесконечной ленты - для этого просто описан шаблон для реактивного вывода данных из store, который заполняется в отдельном скрипте с помощью IntersectionObserver и отслеживания скролла. Вердикт: для бюджетной прокачки легаси проектов, для проектов где нужна частичная интерактивность без лишних заморочек - alpinejs идеальный кандидат.👍