20 Hàm tiện ích JavaScript bạn cần biết để tăng năng suất

Chào các bạn lập trình viên frontend, hôm nay mình sẽ chia sẻ một số hàm tiện ích giúp tránh việc lặp lại mã và tăng năng suất làm việc. Những đoạn mã nhỏ này thường được sử dụng trong nhiều dự án và giúp tiết kiệm rất nhiều thời gian khi phải làm đi làm lại cùng một việc ở nhiều tệp khác nhau.

1. Tạo số nguyên ngẫu nhiên trong khoảng min và max

Hữu ích khi bạn cần tạo một ID ngẫu nhiên cho đối tượng nào đó trong dữ liệu.

const randomInt = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min;
scrib.show(randomInt(100,100000))

2. Lấy thời gian đã trôi qua

Dùng để hiển thị thời gian ai đó online lần cuối trong ứng dụng chat hoặc thời gian cập nhật cuối cùng của tệp.

const timeAgo = date => {
  const diff = (new Date() - new Date(date)) / 1000;
  const units = [
    ['year', 31536000], ['month', 2592000],
    ['day', 86400], ['hour', 3600],
    ['minute', 60], ['second', 1]
  ];
  for (let [unit, sec] of units) {
    const val = Math.floor(diff / sec);
    if (val >= 1) return `${val} ${unit}${val > 1 ? 's' : ''} ago`;
  }
  return 'just now';
};
scrib.show(timeAgo("2025/05/12"))

3. Định dạng ngày theo YYYY-MM-DD

Hữu ích để chuẩn hóa ngày từ API về dạng hiển thị chuẩn cho giao diện.

const formatDate = date => new Date(date).toISOString().split('T')[0];
scrib.show(formatDate("2025/05/12"))

4. Loại bỏ phần tử trùng lặp trong mảng

Giúp làm sạch dữ liệu mảng.

const unique = arr => [...new Set(arr)];
scrib.show(unique([1,1,2,2,2,3,4,5,5,9]))

5. Làm phẳng mảng lồng nhau

Chuyển mảng nhiều tầng thành mảng 1 tầng để dễ xử lý.

const flatten = arr => arr.flat(Infinity);
scrib.show(flatten([1,1,[2,2,2],[3,4,[5]],5,9]))

6. Xáo trộn mảng

Hữu ích khi bạn muốn hiển thị danh sách theo thứ tự ngẫu nhiên.

const shuffle = arr => arr.sort(() => Math.random() - 0.5);
scrib.show(shuffle([1,1,2,2,2,3,4,5,5,9]))

7. Lấy phần giao nhau giữa hai mảng

Dùng để so sánh và tìm phần tử chung.

const intersect = (a, b) => a.filter(x => b.includes(x));
scrib.show(intersect([1,2,3,4],[1,3,4,5]))

8. Viết hoa chữ cái đầu tiên

Dùng để định dạng văn bản hiển thị trên giao diện.

const capitalize = str => str.charAt(0).toUpperCase() + str.slice(1);
scrib.show(capitalize("mysterio"));

9. Tạo slug (chuỗi URL có dấu gạch ngang)

Chuyển chuỗi thành dạng slug dễ đọc và thân thiện với URL.

const slugify = str => str.toLowerCase().trim().replace(/\s+/g, '-').replace(/[^\w\-]+/g, '');
scrib.show(slugify("products and services")); // products-and-services

10. Rút gọn chuỗi

Thêm dấu "..." sau một số ký tự giới hạn.

const truncate = (str, len) => str.length > len ? str.slice(0, len) + '...' : str;
scrib.show(truncate("Web development has many frameworks", 25));

11. Kiểm tra định dạng email

Xác thực email hợp lệ hay không.

const isEmail = str => /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(str);
scrib.show(isEmail("mysterio09@gmail.com"));

12. Kiểm tra object rỗng

Dùng để kiểm tra trước khi xử lý object.

const isEmptyObject = obj => Object.keys(obj).length === 0;
scrib.show(isEmptyObject({})); // true
scrib.show(isEmptyObject({ name: "Mysterio" })); // false

13. Lấy tham số từ URL

Chuyển query string thành object.

const getQueryParams = url => Object.fromEntries(new URL(url).searchParams.entries());
const url = "https://example.com/user?name=mysterio&age=24&country=India";
scrib.show(getQueryParams(url));

14. Chuyển object thành query string

Làm ngược lại hàm số 13.

const toQueryString = obj => new URLSearchParams(obj).toString();
const person = { "name": "mysterio", "age": "24", "country": "India" };
scrib.show(`https://example.com/user?${toQueryString(person)}`);

15. Kiểm tra năm nhuận

Hữu ích khi áp dụng logic phụ thuộc vào số ngày.

const isLeapYear = year => new Date(year, 1, 29).getDate() === 29;
scrib.show(isLeapYear("2025-05-15"));

16. Loại bỏ giá trị "falsy"

Xóa các giá trị như false, undefined, null, 0, "",...

const compact = arr => arr.filter(Boolean);
scrib.show(compact([false, undefined, null, 0, 1, 2, 3]));

17. Đếm số lần xuất hiện trong mảng

Phân loại tần suất phần tử.

const countOccurrences = (arr, val) => arr.reduce((a, v) => (v === val ? a + 1 : a), 0);
scrib.show(countOccurrences([1,1,2,2,2,3,4,5,5,9], 2));

18. Tìm phần tử trùng lặp trong mảng

const findDuplicates = arr => {
  return [...new Set(arr.filter((item, index) => arr.indexOf(item) !== index))];
};
scrib.show(findDuplicates([1,1,2,2,2,3,4,5,5,9]));

19. Kiểm tra giá trị có phải số không

Hữu ích khi cần tính toán mà không gây lỗi.

const isNumeric = val => !isNaN(parseFloat(val)) && isFinite(val);
scrib.show(isNumeric(NaN)); // false
scrib.show(isNumeric("24s")); // false
scrib.show(isNumeric("24")); // true
scrib.show(isNumeric(24)); // true
scrib.show(isNumeric(24.45)); // true

20. Lấy các khóa cụ thể từ object

Chỉ lấy ra các thuộc tính bạn cần.

const pick = (obj, keys) =>
  keys.reduce((acc, key) => {
    if (key in obj) acc[key] = obj[key];
    return acc;
  }, {});
const person = { "name": "mysterio", "age": "24", "country": "India" };
scrib.show(pick(person, ["name", "age"]));

Vậy là xong! Hãy cho mình biết nếu bạn muốn mình cải thiện điều gì trong bài viết này nhé.