Эти лаконичные и мощные JavaScript-функции пригодятся тебе снова и снова. Форматирование даты, debounce, очистка объекта, копирование в буфер — всё, что нужно для продуктивной разработки.
Каждый разработчик имеет свой «рюкзак» с утилитами, которые помогают решать повседневные задачи быстрее. В этой статье — десять лаконичных, но крайне полезных JS-сниппетов, которые можно добавлять в каждый проект. Они не зависят от фреймворков и отлично работают в любом окружении: от Node.js до браузера.
1. 📅 Форматирование даты
const formatDate = (date) =>
new Intl.DateTimeFormat('ru-RU', {
dateStyle: 'medium',
timeStyle: 'short',
}).format(date);
❓Зачем: красиво и локализовано выводим дату и время.
Пример: formatDate(new Date()) // "29 июня 2025 г., 12:00"
2. 🧪 Проверка: промис это или нет
const isPromise = (val) =>
Boolean(val && typeof val.then === 'function');
❓Зачем: определяем, что перед нами — промис.
3. 📜 Копирование в буфер обмена
const copyToClipboard = async (text) =>
await navigator.clipboard.writeText(text);
❓Зачем: часто нужно реализовать "Скопировать" по клику.
4. 🔁 Глубокое копирование объекта
const deepClone = (obj) =>
JSON.parse(JSON.stringify(obj));
❓Зачем: чтобы не мутировать оригинальный объект.
5. ⏳ Простой debounce
const debounce = (fn, delay = 300) => {
let timeout;
return (...args) => {
clearTimeout(timeout);
timeout = setTimeout(() => fn(...args), delay);
};
};
❓Зачем: для оптимизации частых событий, например ввода.
6. 🚫 Удаление дубликатов из массива
const unique = (arr) => [...new Set(arr)];
❓Зачем: очищаем массив от повторов элегантно.
7. 🆔 Генерация простого ID
const randomId = () =>
Math.random().toString(36).slice(2, 10);
❓Зачем: быстрое уникальное значение для UI или ключей.
8. ⏱ Задержка в async/await стиле
const sleep = (ms) =>
new Promise((resolve) => setTimeout(resolve, ms));
❓Зачем: имитация задержки, паузы в анимации, тесты и т.д.
9. 💬 Получение параметров из URL
const getQueryParam = (key) =>
new URLSearchParams(window.location.search).get(key);
❓ Зачем: нужно часто — при фильтрации, пагинации и т.д.
10. 🧼 Очистка объекта от пустых значений
const cleanObject = (obj) =>
Object.fromEntries(
Object.entries(obj).filter(([_, v]) => v != null)
);
❓ Зачем: удаляем null и undefined перед отправкой данных.
🤔 Зачем запоминать эти сниппеты?
- 📌 Они решают типовые задачи, встречающиеся в любом проекте.
- 📌 Ускоряют разработку и делают код чище.
- 📌 Понятны новичкам, полезны опытным.
Если ты учишься программировать и хочешь прокачиваться ежедневно — загляни в наше приложение Кодик. Это увлекательное обучение программированию через практику и челленджи!
Веб версия Кодик - https://itcodik.com/
📦 Совет
Создай файл utils.js и храни там свою коллекцию любимых утилит — как личный JS-швейцарский нож 🛠