Kể từ năm 2015, JavaScript đã được cập nhật ngôn ngữ hàng năm. Năm 2021 không có gì khác biệt: năm nay, một số tính năng mới đã đạt đến Giai đoạn 4 của Quy trình TC39 và đã có sẵn trong Node.js và hầu hết các trình duyệt hiện đại chính.
Trong bài viết này, chúng ta sẽ xem xét bốn trong số các tính năng mới quan trọng nhất. Chúng tôi sẽ đề cập đến một phương pháp chuỗi mới, một phương pháp Promise mới, các cải tiến về khả năng đọc số và cách viết tắt mới cho các bài tập.
replaceAll()
Đầu tiên, chúng ta có một phương thức nguyên mẫu chuỗi mới, replaceAll, thay thế mọi trường hợp của một chuỗi con.
Trong khi chúng tôi có thể làm điều này với phương thức thay thế hiện có, chúng tôi phải chuyển sang biểu thức chính quy, chẳng hạn như sau:
"1990-01-01".replace(/-/g, "/");
replaceAll được cho là dễ đọc hơn:
"1990-01-01".replaceAll("-", "/");
Với ReplaceAll, không cần regex. Tuy nhiên, nó vẫn có thể được sử dụng, miễn là cờ g được cung cấp.
"1990-01-01".replaceAll(/-/g, "/");
Support
Chrome: 85+
Firefox: 77+
Safari: 13.1+
Node: 15.0.0+
Promise.any
Năm nay đã chứng kiến những cải tiến hơn nữa đối với việc xử lý mã không đồng bộ với Promise.any, lấy một mảng các Promise và trả về kết quả đầu tiên. Nếu mọi Promise bị từ chối, một lỗi sẽ xảy ra.
Hãy thực hiện bốn Promises và xem điều gì sẽ xảy ra:
const p1 = new Promise((resolve, reject) => setTimeout(reject, 1000, "p1"));
const p2 = new Promise((resolve, reject) => setTimeout(resolve, 2000, "p2"));
const p3 = new Promise((resolve, reject) => setTimeout(reject, 3000, "p3"));
const p4 = new Promise((resolve, reject) => setTimeout(resolve, 4000, "p4"));
Promise.any sẽ trả lại tùy theo điều kiện nào được giải quyết trước. Trong trường hợp này, p2. Chúng tôi có thể kiểm tra điều này bằng cách sử dụng mã bên dưới:
async function getFirstResolvedPromise() {
const result = await Promise.any([p1, p2, p3, p4]);
console.log(result);
};
getFirstResolvedPromise(); // "p2"
Bây giờ có bốn phương pháp chúng ta có thể sử dụng để làm việc với một mảng Promises:
- Promise.all - trả về một mảng các Promise đã được giải quyết, sau khi tất cả các Promise đã được giải quyết
- Promise.allSettled (mới vào năm 2020) - trả về một loạt các Promise, cho dù chúng được giải quyết hay bị từ chối, sau khi tất cả các Promise được giải quyết hoặc bị từ chối
- Promise.race - trả về Promise đầu tiên được giải quyết hoặc bị từ chối
- Promise.any - trả về Promise đầu tiên được giải quyết
Support
Chrome: 85+
Firefox: 79+
Safari: 14+
Node: 15.0.0+
Toán tử gán logic
Kể từ khi giới thiệu toán tử liên kết nullish ?? vào năm 2020, chúng tôi hiện có ba toán tử logic:
- && — logical AND
- ||— logical OR
- ??— nullish coalescing operator
Các phím tắt này cho phép chúng tôi giải quyết ngắn gọn các biểu thức dựa trên việc một giá trị là thực hay sai - hoặc trong trường hợp của ?? - cho dù một giá trị là nullish (null hoặc undefined).
Bây giờ, chúng ta có một cách viết tắt ngắn gọn hơn để gán các giá trị bằng cách sử dụng các toán tử sau:
- && = - gán một biến, nếu biến là true
- ||= — gán một biến, nếu biến đó là false
- ??= — gán một biến, nếu biến là rỗng
Trong đoạn mã dưới đây, mỗi nhóm gồm ba câu lệnh tương đương nhau:
// Logical AND assignment
a &&= b;
a = a && b;
a = a ? b : a;
// Logical OR assignment
a ||= b;
a = a || b;
a = a ? a : b;
// Logical nullish assignment
a ??= b;
a = a ?? b;
a = a === null || a === undefined ? b : a;
Trong ví dụ dưới đây, biến a sẽ được gán lại một giá trị mới khi mọi biểu thức chạy. Đây là code:
let a = true;
const b = false, c = null, d = 10;
a &&= b;
console.log(a); // false
a ||= c;
console.log(a); // null
a ??= d;
console.log(a); // 10
Các toán tử gán mới này tham gia vào các toán tử gán toán học += , -= , = , /= , = and %= , cũng như các phép gán toán tử bitwise.
Support
Chrome: 85+
Firefox: 79+
Safari: 14+
Node: 15.0.0+
Ký tự phân cách đơn vị nghìn
Cuối cùng, năm nay đã chứng kiến việc áp dụng rộng rãi của một tính năng mang lại sự gia tăng đáng kể về khả năng đọc cho những người làm việc với số lượng lớn hoặc nhiều chữ số thập phân!
Bây giờ, chúng ta có thể sử dụng dấu gạch dưới để phân tách các chữ số.
const a = 100000000;
const b = 100_000_000;
console.log(a === b); // true
Mặc dù a và b giống hệt nhau, nhưng b dễ được xác định là 100 triệu.
Trong thực tế, dấu phân tách số chủ yếu hữu ích như một dấu phân cách nghìn, mặc dù cách sử dụng này không được thực thi. Dấu phân tách số có thể sử dụng được với giá trị float và BigInt (được giới thiệu vào năm 2020). Dưới đây là một số mã để hiển thị cách chúng hoạt động:
const float = 3.141_592_653_59;
const bigInt = 9_007_199_254_740_992n;
Lưu ý rằng _ không thể được sử dụng ở đầu hoặc cuối của một số (hoặc sau số 0 đầu tiên). Ngoài ra, nó không được liền kề với dấu thập phân và không thể sử dụng nhiều dấu gạch dưới trong một hàng.
Support
Chrome: 75+
Firefox: 70+
Safari: 13+
Node: 12.5.0+
Nguồn bài viết tại đây.
> Tham khảo khóa học Online về Javascript - [tại đây](https://techmaster.vn/khoa-hoc/ev5/javascript-can-ban-tong-hop-12-game-huyen-thoai)
>
> Khóa học Web Frontend + React - [tại đây](> Khóa học Web Frontend + React - https://techmaster.vn/lo-trinh/front-end)
Bình luận