31 điểm bởi GN⁺ 2025-04-16 | 4 bình luận | Chia sẻ qua WhatsApp
  • JavaScript vẫn tiếp tục phát triển trong năm 2025, và có những tính năng tuy chưa quá nổi tiếng nhưng lại rất hữu ích
  • Các phương thức trợ giúp Iterator mới hoạt động hiệu quả bộ nhớ hơn nhiều khi biến đổi dữ liệu quy mô lớn
  • at() để truy cập từ cuối mảng, cách dùng Promise.withResolvers() đơn giản hơn, cùng structuredClone() để sao chép sâu
  • Các phép toán tập hợp cho Set, hàm gắn thẻ cho template stringcách dùng WeakMap/WeakSet vẫn là những phần bị nhiều lập trình viên bỏ qua

Phương thức Iterator Helper

  • Nếu chain như arr.filter().map() trước đây thì mỗi bước đều tạo ra một mảng mới nên kém hiệu quả
  • Có thể cải thiện bằng chain dựa trên iterator như arr.values().drop(10).take(10).map(...).toArray()
  • Các phương thức chính:
    • drop(): bỏ qua n phần tử đầu tiên
    • take(): chỉ lấy n phần tử đầu tiên
    • filter(), map(), flatMap(): hoạt động tương tự các phương thức của mảng
    • reduce(), some(), every(), find(): hỗ trợ kiểm tra điều kiện và tính toán tích lũy
    • toArray(): chuyển thành mảng ở bước cuối
  • Safari bắt đầu hỗ trợ từ ngày 31/03/2025, nhưng hiện vẫn chưa được mọi trình duyệt hỗ trợ

Array at()

  • arr.at(n) tương tự arr[n], nhưng có thể dùng chỉ số âm để truy cập từ cuối
  • Ví dụ: [10, 20, 30].at(-1)30
  • Có thể truy cập phần tử cuối mà không cần cách bất tiện như arr[arr.length - 1]

Promise.withResolvers()

  • Cách cũ: lưu resolve/reject bên ngoài trong new Promise((resolve, reject) => { ... })
  • Giờ có thể dùng: const { promise, resolve, reject } = Promise.withResolvers() để viết ngắn gọn và trực quan hơn

Tận dụng callback của String.replace()

  • Đối số thứ hai của replace()replaceAll() không chỉ nhận chuỗi mà còn nhận hàm callback
  • Ví dụ: "X, X, X".replaceAll("X", (match, i) => match + i)"X0, X3, X6"
  • Có thể thực hiện nhiều kiểu thay thế trong một lần → hiệu quả hơn về hiệu năng và bộ nhớ

Hoán đổi biến (Swap)

  • Cách cũ: dùng biến temp
  • Cách ngắn gọn: dùng [a, b] = [b, a] để hoán đổi bằng array destructuring

structuredClone()

  • Thay vì JSON.stringify() + JSON.parse(), hàm này hỗ trợ sao chép sâu chính xác và hiệu quả hơn
  • Ưu điểm:
    • Hỗ trợ cả NaN, undefined, bigint, v.v.
    • Có thể sao chép an toàn cả tham chiếu vòng
    • Hiệu quả hơn về bộ nhớ và tốc độ với các đối tượng lớn

Tagged Template Literals

  • Có thể parse template string bằng một hàm cụ thể
  • Hữu ích cho hậu xử lý chuỗi động như escape HTML
  • Ví dụ:
    hàm gắn thẻ escapeHtml với <br> ${'<br>'}<br> <br>

WeakMap / WeakSet

  • Tương tự Map, Set thông thường, nhưng:
    • Chỉ cho phép object làm key (không chấp nhận giá trị nguyên thủy)
    • Tự động bị loại bỏ khi trở thành đối tượng của GC
  • Phù hợp khi có khả năng xảy ra tham chiếu vòng hoặc khi cần lưu metadata cho object mà không tạo tác dụng phụ

Hỗ trợ các phép toán tập hợp cho Set

Trong JavaScript, nhiều phép toán logic mới đã được bổ sung cho đối tượng Set:

  • difference(): hiệu tập hợp (A - B)
  • intersection(): giao tập hợp (A ∩ B)
  • union(): hợp tập hợp (A ∪ B)
  • symmetricDifference(): hiệu đối xứng (A △ B)
  • isDisjointFrom(): có hay không phần tử giao nhau
  • isSubsetOf(): có phải là tập con hay không
  • isSupersetOf(): có phải là tập cha hay không

4 bình luận

 
wfedev 2025-04-23

Có vẻ như vấn đề khi phân tích literal khiến cả biến cũng bị xuất ra dưới dạng chuỗi đã được giải quyết rồi. Cảm ơn bạn đã chia sẻ.

 
pompapa 2025-04-17

Ví dụ: "X, X, X".replaceAll("X", (match, i) => match + i) → "X0, X1, X2"

Ví dụ này bị sai. i chứa vị trí khớp.
Vì vậy, giá trị kết quả là "X0, X3, X6".

 
xguru 2025-04-17

À đúng thật. AI đã tạo ví dụ sai. Tôi đã sửa lại rồi. Cảm ơn bạn đã chỉ ra rất tinh ý!

 
click 2025-04-16

values cho cảm giác giống Java Stream API, nên khi so sánh thử thì thấy nếu kích thước mảng nhỏ, lọc trực tiếp không dùng values sẽ nhanh hơn. Vì nó dựa trên iterator, nên có vẻ chuỗi gọi càng dài thì cách đi qua values một lần lại càng có lợi về tốc độ. Có thể tham khảo benchmark tại https://jsperf.app/dixutu.