Top 10 JavaScript Helper Functions Bạn Nên Có Trong Mọi Dự Án
Không phải lúc nào cũng cần dùng thư viện to như Lodash, bạn hoàn toàn có thể viết một số helper nhỏ gọn để tăng tốc độ làm việc, giữ code sạch, và tránh lặp lại.
Dưới đây là 10 helper "must-have" trong mọi dự án JS – từ web đến Node.js.
1. debounce(fn, delay)
Giúp giới hạn số lần gọi hàm, thường dùng cho sự kiện scroll
, resize
, input
.
function debounce(fn, delay) {
let timeout;
return (...args) => {
clearTimeout(timeout);
timeout = setTimeout(() => fn(...args), delay);
};
}
2.throttle(fn, delay)
Giới hạn việc gọi hàm, nhưng đảm bảo gọi đều đặn (khác với debounce).
function throttle(fn, delay) {
let last = 0;
return (...args) => {
const now = Date.now();
if (now - last >= delay) {
last = now;
fn(...args);
}
};
}
3. deepClone(obj)
Clone object sâu – tránh bị ảnh hưởng khi thay đổi dữ liệu gốc.
function deepClone(obj) {
return JSON.parse(JSON.stringify(obj));
}
Lưu ý: Cách này không clone được hàm, Date
, Map
, Set
.
4. isEmpty(obj)
Kiểm tra object hoặc array có rỗng không.
function isEmpty(val) {
if (Array.isArray(val)) return val.length === 0;
if (typeof val === 'object' && val !== null)
return Object.keys(val).length === 0;
return !val;
}
5. capitalize(str)
Viết hoa chữ cái đầu tiên.
function randomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
6. randomInt(min, max)
Sinh số nguyên ngẫu nhiên trong khoảng[min, max]
.
function randomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
7. groupBy(arr, key)
Nhóm các phần tử theo key
.
function groupBy(arr, key) {
return arr.reduce((acc, obj) => {
const k = obj[key];
acc[k] = acc[k] || [];
acc[k].push(obj);
return acc;
}, {});
}
8. formatDate(date, locale = 'vi-VN')
Định dạng ngày tháng dễ đọc.
function formatDate(date, locale = 'vi-VN') {
return new Date(date).toLocaleDateString(locale);
}
9. delay(ms)
Tạo delay trong async/await.
function delay(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}
10. unique(arr)
Lọc các phần tử không trùng lặp trong array.
function unique(arr) {
return [...new Set(arr)];
}
Kết luận
Những helper trên tuy nhỏ, nhưng cực kỳ hữu dụng nếu bạn dùng thường xuyên. Thay vì code lại từ đầu, hãy chuẩn bị sẵn một file utils.js hoặc helpers.js và tái sử dụng cho mọi project.
All Rights Reserved