9 Dòng Lệnh JavaScript Thay Thế 50 Dòng Code: Tối Ưu Hóa Việc Lập Trình

Giới Thiệu

Tất cả chúng ta đều đã từng đứng trước một khối lượng lớn code JavaScript, cảm thấy bối rối và tự hỏi có cách nào tốt hơn để tối ưu hóa nó. Trong bài viết này, chúng tôi sẽ giới thiệu cho bạn 9 dòng lệnh JavaScript ngắn gọn có thể thay thế hàng chục dòng code phức tạp, giúp bạn viết code sạch sẽ và dễ bảo trì hơn.

1. Làm Phẳng Mảng Lồng Nhau

Nếu bạn đã từng phải xử lý mảng lồng nhau, bạn biết rằng việc làm phẳng chúng thường đòi hỏi nhiều vòng lặp và code phức tạp. Giờ đây, bạn có thể sử dụng hàm flat() để thực hiện điều này chỉ trong một dòng:

const flattenArray = arr => arr.flat(Infinity);

Ví dụ:

const nestedArray = [1, [2, 3, [4, 5, [6, 7]]], 8, [9, 10]];
const cleanArray = flattenArray(nestedArray);
// Kết quả: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

2. Sao Chép Sâu Đối Tượng

Để sao chép sâu một đối tượng mà không cần thư viện bên ngoài, sử dụng dòng lệnh sau:

const deepClone = obj => JSON.parse(JSON.stringify(obj));

Điều này hữu ích khi bạn cần sao chép các đối tượng lồng nhau, mảng và ngày tháng.

3. Chuyển Đổi CSV Sang Mảng Đối Tượng

Bạn cần xử lý dữ liệu CSV? Sử dụng dòng lệnh này để chuyển đổi nó thành mảng đối tượng:

const csvToObjects = csv => csv.split('\n').map(row => Object.fromEntries(row.split(',').map((value, i, arr) => [arr[0].split(',')[i], value])));

Ví Dụ:

const csvData = `name,age,city\nPeboy,30,New York\nPeace,25,San Francisco\nLara,35,Chicago`;
const parsed = csvToObjects(csvData);
// Kết quả: [{ name: 'Peboy', age: '30', city: 'New York' }, ...]

4. Xóa Phần Tử Trùng Lặp

Để loại bỏ các phần tử trùng lặp và sắp xếp một mảng trong một dòng:

const uniqueSorted = arr => [...new Set(arr)].sort((a, b) => a - b);

5. Thao Tác DOM

Truy vấn và biến đổi nhiều phần tử DOM cùng một lúc chỉ với một lệnh:

const modifyElements = selector => Array.from(document.querySelectorAll(selector)).forEach(el => el.style);

6. Gọi API Song Song

Thực hiện các lệnh gọi API song song và xử lý lỗi một cách dễ dàng:

const parallelCalls = urls => Promise.allSettled(urls.map(url => fetch(url).then(r => r.json())));

7. Định Dạng Ngày Giờ

Biến đổi ngày tháng thành chuỗi dễ đọc mà không cần thư viện:

const formatDate = date => new Intl.DateTimeFormat('en-US', { dateStyle: 'full', timeStyle: 'short' }).format(date);

8. Xử Lý Sự Kiện: Debounce

Tạo phiên bản debounce cho bất kỳ hàm nào:

const debounce = (fn, ms) => { let timeout; return (...args) => { clearTimeout(timeout); timeout = setTimeout(() => fn(...args), ms); }; };

9. Lưu Trữ Cục Bộ Với Xác Thực

Lưu trữ đối tượng trong localStorage với xác thực và xử lý lỗi tích hợp:

const store = key => ({ get: () => JSON.parse(localStorage.getItem(key)), set: data => localStorage.setItem(key, JSON.stringify(data)), remove: () => localStorage.removeItem(key) });

Kết Luận

Những dòng lệnh này không chỉ giúp bạn viết ít code hơn mà còn giúp bạn viết mã thông minh hơn và dễ bảo trì hơn. Hãy nhớ rằng, trong lập trình, khả năng đọc code cũng quan trọng bằng khả năng viết code. Hãy cân nhắc sử dụng những dòng lệnh này trong dự án của bạn để nâng cao hiệu quả lập trình của bạn.
source: viblo