JavaScript · ES2023

ES14 Interactive Hub — ECMAScript 2023

Tìm element từ cuối (Array.findLast), immutable array methods (toSorted, toReversed, with), Symbols as WeakMap keys, hashbang grammar (#!) cho CLI script — functional patterns được support tốt hơn.

Kinh Nghiệm

0 XP

Hoàn thành khóa học0%

Array.findLast() & findLastIndex()

Chuyên đề cốt lõi

Dễ4 phút

💡 Khái niệm tóm tắt

Tìm phần tử/index thoả mãn điều kiện duyệt TỪ CUỐI mảng. Bổ sung cho find()/findIndex() vốn tìm từ đầu.

🤔 Tại sao cần tính năng này?

find()/findIndex() chỉ duyệt từ đầu. Khi muốn lấy phần tử cuối cùng thỏa điều kiện (vd: log entry mới nhất, transaction gần nhất), phải reverse() mảng (mutate) hoặc tự lặp ngược. ES14 thêm API rõ ràng cho việc này.

Trước (cách viết cũ)Verbose / Cồng kềnh

// Trước ES14 — phải reverse hoặc tự lặp ngược
var nums = [1, 3, 5, 4, 2];

// Cách 1: clone + reverse (kém hiệu năng)
var lastEven = [...nums].reverse().find(n => n % 2 === 0);
console.log(lastEven); // 4

// Cách 2: lặp ngược thủ công
function findLastManual(arr, fn) {
    for (let i = arr.length - 1; i >= 0; i--) {
        if (fn(arr[i])) return arr[i];
    }
}
console.log(findLastManual(nums, n => n > 2)); // 4

ES14 (Hiện đại)Tối ưu & Khuyên dùng

// ES14 — findLast & findLastIndex
const nums = [1, 3, 5, 4, 2];

console.log(nums.findLast(n => n % 2 === 0));   // 4
console.log(nums.findLast(n => n > 2));         // 4 (gần cuối)
console.log(nums.findLastIndex(n => n > 2));    // 3

// Không tìm thấy
console.log(nums.findLast(n => n > 100));       // undefined
console.log(nums.findLastIndex(n => n > 100));  // -1

// So sánh với find từ đầu
console.log(nums.find(n => n > 2));     // 3
console.log(nums.findLast(n => n > 2)); // 4

Bạn đã nắm chắc? Thử chạy code thật hoặc làm trắc nghiệm!

Bảng Tra Cứu Nhanh ES14

Xem nhanh cấu trúc + copy snippet

Array.findLast() & findLastIndex()

Tìm phần tử/index thoả mãn điều kiện duyệt TỪ CUỐI mảng. Bổ sung cho find()/findIndex() vốn tìm từ đầu.

const nums = [1, 3, 5, 4, 2];
console.log(nums.findLast(n => n % 2 === 0));   // 4
console.log(nums.findLast(n => n > 2));         // 4 (gần cuối)
...

Immutable Arrays (toSorted, toReversed, with)

Các phương thức trả về COPY mới thay vì mutate mảng gốc — phù hợp với immutable patterns (React state, Redux).

const arr = [3, 1, 2];
const sorted = arr.toSorted();         // [1, 2, 3]
console.log(arr);                       // [3, 1, 2] (giữ nguyên!)
...

Symbols as WeakMap keys

WeakMap nay chấp nhận Symbol làm key (trước chỉ cho phép object) — hữu ích cho pattern metadata gắn lên entity.

const meta = new WeakMap();
const userKey = Symbol('user');
meta.set(userKey, { lastLogin: Date.now() });
...

Hashbang Grammar (#!)

ES14 chính thức cho phép viết "#!/usr/bin/env node" ở DÒNG ĐẦU file .js/.mjs — biến file JS thành script CLI Unix chạy được trực tiếp.

#!/usr/bin/env node
console.log("Đây là CLI tool viết bằng JS!");
const [, , ...args] = process.argv;
...