fbpx

Đến AI cũng BÓ TAY! 10 Tính năng JavaScript mới CỰC ĐỈNH 2026

10 tính năng JavaScript mới cực đỉnh năm 2026 giúp lập trình viên tối ưu code

Nếu bạn đang mải mê copy-paste từ AI và tưởng rằng code của nó luôn tốt nhất?

Thì bạn nhầm to rồi!

Bạn có biết là JavaScript vừa tung ra những tính năng mới đến mức dữ liệu của AI còn chưa kịp update không?

Mà thật ra nếu nó có update rồi, thì tỷ lệ cao AI vẫn trả về những cú pháp lỗi thời do chúng đã quá phổ biến, trừ khi bạn ra lệnh cụ thể bắt nó dùng cú pháp mới.

Đừng để bản thân bị tụt hậu lại phía sau. Ngay sau đây, chúng ta hãy cùng nhau khám phá 10 tính năng JavaScript mới CỰC ĐỈNH của năm 2026 nhé!

1. Các phương thức mới của Set

Trước đây, bạn phải tự viết logic thủ công rất mất thời gian để xử lý tập hợp trên Set. Giờ đây, JavaScript đã tích hợp sẵn hàng loạt phương thức cực tiện lợi:

  • union(): Gộp hai tập hợp, tự động lọc trùng.
  • intersection(): Lấy các phần tử trùng nhau giữa hai tập hợp.
  • difference(): Loại bỏ các phần tử trùng với tập hợp kia.
  • symmetricDifference(): Lấy các phần tử chỉ xuất hiện ở một bên.
  • isSubsetOf(): Kiểm tra quan hệ tập con.
const setA = new Set([1, 2, 3, 4, 5]);
const setB = new Set([3, 4, 5, 6, 7]);

// Hợp 2 tập hợp (lấy tất cả giá trị không trùng lặp)
console.log(setA.union(setB)); // Set {1, 2, 3, 4, 5, 6, 7}

// Giao 2 tập hợp (chỉ lấy phần tử chung)
console.log(setA.intersection(setB)); // Set {3, 4, 5}

// Hiệu (những phần tử có trong setA nhưng không có trong setB)
console.log(setA.difference(setB)); // Set {1, 2}

// Hiệu đối xứng (loại bỏ các phần tử chung của cả 2)
console.log(setA.symmetricDifference(setB)); // Set {1, 2, 6, 7}

// Kiểm tra tập con
const setC = new Set([1, 2]);
console.log(setC.isSubsetOf(setA)); // true

2. Iterator Helpers

Làm việc với Generators và Iterators trước đây rất cồng kềnh. Giờ đây, bạn có thể gọi trực tiếp các hàm quen thuộc của Array như .map(), .filter(), và .take() ngay trên Iterator mà không cần ép kiểu về mảng.

Tính năng này cực kỳ đáng giá khi xử lý các vòng lặp vô hạn vì nó giúp code vừa sạch, vừa tối ưu bộ nhớ đáng kể.

// Tạo một vòng lặp số vô hạn
function* numberGenerator(){
  let i = 0;
  while (true) yield i++;
}

const numbers = numberGenerator();

// Lấy 5 số đầu tiên, nhân 2 và chuyển thành mảng
const result = numbers
  .map(n => n * 2)
  .take(5) // Lấy 5 phần tử để tránh lặp vô hạn
  .toArray();

console.log(result); // [0, 2, 4, 6, 8]

3. Promise.try

Khi bạn có một hàm có thể ném ra lỗi đồng bộ (synchronous) hoặc trả về một Promise (asynchronous), việc xử lý lỗi bằng try/catch truyền thống có thể khiến code trở nên lộn xộn:

try {
  // 1. Lỗi đồng bộ: Phát hiện lỗi logic và ném ra ngay lập tức
  if (!id) throw new Error("ID không hợp lệ!"); 

  // 2. Lỗi bất đồng bộ: Đợi kết nối và tải dữ liệu từ server
  fetch(`https://jsonplaceholder.typicode.com/users/${id}`)
    .then(res => res.json())
    .catch(err => console.log("Mức 1 - Chỉ bắt được lỗi server:", err)); 

} catch (err) {
  // 3. Khối catch này BẮT BUỘC phải có để hứng lỗi logic ở bước 1
  console.log("Mức 2 - Chỉ bắt được lỗi logic:", err); 
}

Promise.try giúp bạn gom tất cả các loại lỗi về cùng một chỗ để xử lý chung bằng .catch():

Promise.try(() => {
  // Gom cả 2 hành vi vào chung một khối xử lý
  if (!id) throw new Error("ID không hợp lệ!"); // Nếu lỗi logic -> nhảy thẳng xuống .catch()
  
  return fetch(`https://jsonplaceholder.typicode.com/users/${id}`)
         .then(res => res.json()); // Nếu lỗi server -> cũng nhảy xuống .catch()
})
.then(user => console.log("Xử lý dữ liệu thành công:", user))
.catch(err => {
  // ĐÚNG MỘT NƠI DUY NHẤT: Gom trọn gói cả lỗi logic lẫn lỗi server!
  console.log("Bắt hết mọi loại lỗi tại đây:", err.message);
});

4. Import Attributes (Import file JSON)

Bạn đã bao giờ muốn nạp một file JSON trực tiếp vào file JavaScript mà không cần thông qua bundler (như Webpack/Vite) chưa?

Bây giờ bạn có thể làm điều đó trực tiếp ở trình duyệt bằng cú pháp with { type: 'json' }.

// import trực tiếp file dữ liệu JSON
import userData from './user.json' with { type: 'json' };

console.log(userData.name);

5. RegExp.escape

Làm việc với Regular Expression (RegEx) thường gặp rủi ro khi chuỗi đầu vào của người dùng chứa các ký tự đặc biệt (như ., *, ?).

Tính năng RegExp.escape tự động xử lý và vô hiệu hóa các ký tự đặc biệt này, giúp bạn tìm kiếm chuỗi chính xác.

const userInput = ".com";

// Thay vì tìm mọi ký tự theo sau chữ "com" (do đặc tính của dấu chấm),
// nó sẽ hiểu chính xác là chuỗi ".com"
const escapedInput = RegExp.escape(userInput);
const regex = new RegExp(`${escapedInput}$`);

console.log(regex.test("google.com")); // true
console.log(regex.test("google.org")); // false

6. Array.fromAsync

Array.fromAsync() hoạt động giống như Array.from nhưng dành cho dữ liệu bất đồng bộ (Async Iterables), giúp tự động đợi và gom tất cả các kết quả trả về từ API thành một mảng dữ liệu duy nhất.

Cách cũ: Phải kết hợp qua 2 bước (Array.from + Promise.all):

// Danh sách các ID cần fetch dữ liệu
const userIds = [101, 102, 103];

// 1. Dùng Array.from để tạo ra một mảng chứa các Promise (chưa có dữ liệu thực)
const promises = Array.from(userIds, async (id) => {
  return fetch(`https://jsonplaceholder.typicode.com/users/${id}`).then(res => res.json());
});

// 2. Bắt buộc phải bọc thêm Promise.all để đợi tất cả các Promise này chạy xong
const allUsersOld = await Promise.all(promises);

console.log(allUsersOld); // Trả về mảng dữ liệu mong muốn

Cách mới: Xử lý gọn với Array.fromAsync:

const userIds = [101, 102, 103];

// Chỉ cần duy nhất 1 bước: Array.fromAsync sẽ tự động đợi (await) 
// từng Promise chạy xong rồi mới gom kết quả vào mảng
const allUsersNew = await Array.fromAsync(userIds, async (id) => {
  return fetch(`https://jsonplaceholder.typicode.com/users/${id}`).then(res => res.json());
});

console.log(allUsersNew);

7. Error.isError()

Trước đây, việc kiểm tra một biến có phải là lỗi hay không bằng cú pháp instanceof Error rất dễ bị sai sót (bug) khi chạy trên các môi trường như iFrames hay Worker:

try {
  throw new Error("Lỗi hệ thống!");
} catch (e) {
  if (error instanceof Error) { 
	  // -> Có thể trả về FALSE vì khác ngữ cảnh bộ nhớ (execution context)
	  console.log(error.message); 
	}
}

Error.isError() ra đời để chấm dứt sự bất tiện này. Nó giúp bạn kiểm tra chính xác 100% một đối tượng có phải là Error hay không, bất kể nó đến từ môi trường nào:

try {
  throw new Error("Lỗi hệ thống!");
} catch (e) {
  // Thay thế cho: e instanceof Error
  if (Error.isError(e)) {
    console.log("Đây là một Error chuẩn:", e.message);
  }
}

8. Map: Thêm nhanh phần tử không lo trùng lặp

Cấu trúc dữ liệu Map giờ đây thông minh hơn với khả năng Upsert (Cập nhật hoặc Thêm mới) chỉ trong một dòng code, chính thức khai tử các câu lệnh if...else check key tồn tại rườm rà:

const cache = new Map();

// 1. getOrInsert: Lấy ra dùng ngay, nếu KEY chưa có thì tự động chèn GIÁ TRỊ TĨNH
const user = cache.getOrInsert("user_1", "Khách khách");
console.log(user); // "Khách"

// 2. getOrInsertComputed: Giống hàm trên, nhưng tối ưu hơn cho các tác vụ NẶNG 
const expensiveData = cache.getOrInsertComputed("fibonacci_100", () => {
  // Hàm callback này CHỈ CHẠY khi key chưa tồn tại, giúp tiết kiệm tài nguyên hệ thống
  return calculateFibonacci(100);
});

9. Math.sumPrecise

Lỗi cộng số thập phân (0.1 + 0.2 = 0.30000000000000004) luôn là “cơn ác mộng” kinh điển trong JavaScript do giới hạn lưu trữ của máy tính:

const numbers = [0.1, 0.2];
const totalOld = numbers.reduce((sum, num) => sum + num, 0);

console.log(totalOld); // 0.30000000000000004

Để giải quyết triệt để việc này, JavaScript đang phát triển hàm Math.sumPrecise(). Hàm này tự động tính tổng chính xác tuyệt đối từ một mảng số nhờ thuật toán xử lý sai số ngầm bên dưới, giúp bạn loại bỏ hoàn toàn các hàm làm tròn thủ công rườm rà:

const numbers = [0.1, 0.2];
const totalNew = Math.sumPrecise(numbers);

console.log(totalNew); // 0.3

Lưu ý: Tính năng này đang ở giai đoạn đề xuất nâng cấp, bạn cần dùng thư viện polyfill như core-js nếu muốn chạy thử ngay lúc này.

10. Temporal API

Ngày tàn của các thư viện như moment.js hay date-fns đã đến!

Temporal API là chuẩn mực mới thay thế hoàn toàn object Date cũ kỹ của JavaScript. Nó cung cấp mọi thứ bạn cần từ thao tác cộng/trừ ngày, so sánh, cho đến xử lý timezones một cách tự nhiên.

Cách cũ:

const nowOld = new Date();

// Để cộng thêm 1 tháng và 10 ngày, bạn phải tự "set" thủ công rất rườm rà
// Nguy hiểm hơn: Hàm này làm thay đổi trực tiếp giá trị của biến nowOld gốc (Mutable)
nowOld.setMonth(nowOld.getMonth() + 1);
nowOld.setDate(nowOld.getDate() + 10);

console.log("Cách cũ:", nowOld.toISOString())

Cách mới:

// Lấy thời gian hiện tại
const now = Temporal.Now.plainDateTimeISO();
console.log("Hiện tại:", now.toString());

// Cộng thêm 1 tháng và 10 ngày cực kì dễ hiểu
const futureDate = now.add({ months: 1, days: 10 });
console.log("Tương lai:", futureDate.toString());

Kết luận

JavaScript ngày càng phát triển, và đang “khai tử” hàng loạt thư viện rườm rà để mang lại những tính năng tích hợp sẵn vô cùng mạnh mẽ.

Cập nhật những tính năng này không chỉ giúp dự án của bạn tối ưu hơn, mà còn là cách để bạn nâng cấp tư duy lập trình của chính mình mỗi ngày.

Nếu bạn muốn đảm bảo việc học của mình, học đến đâu chắc đến đó từ con số 0. Hãy tham khảo ngay các khóa học lập trình 1 Kèm 1 của LetDiv nhé!

Tùng ViO

Tùng ViO

Mình là Tùng ViO, hiện tại đang là Founder và cũng là giảng viên tại LetDiv. Rất hân hạnh được làm quen với bạn!

Có thể bạn quan tâm