ECMAScript 2022
Số phiên bản JavaScript
Phiên bản ECMAScript cũ được đặt tên theo số: ES5 và ES6.
Từ năm 2016, phiên bản được đặt tên theo năm: ES2016, 2018, 2020, 2022.
Tính năng mới của ES2022
- Array at()
- String at()
- RegExp /d
- Object.hasOwn()
- error.cause
- await import
- Định nghĩa trường lớp
- Phương thức và trường riêng
Cảnh báo:
Những tính năng này tương đối mới.
Trình duyệt cũ có thể cần mã thay thế (Polyfill).
JavaScript Array at()
ES2022 đã giới thiệu phương thức mảng at()
:
Ví dụ 1
Lấy phần tử thứ ba của mảng fruits:
const fruits = ["Banana", "Orange", "Apple", "Mango"]; let fruit = fruits.at(2);
Ví dụ 2
Lấy phần tử thứ ba của mảng fruits:
const fruits = ["Banana", "Orange", "Apple", "Mango"]; let fruit = fruits[2];
at()
Phương thức trả về phần tử tại chỉ số xác định từ mảng.
at()
Phương pháp với []
Kết quả trả về là giống nhau.
Từ tháng 3 năm 2022, tất cả các trình duyệt hiện đại đều hỗ trợ at()
Phương pháp:
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome 92 | Edge 92 | Firefox 90 | Safari 15.4 | Opera 78 |
Tháng 4 năm 2021 | tháng 7 năm 2021 | tháng 7 năm 2021 | tháng 3 năm 2022 | tháng 8 năm 2021 |
Lưu ý:
Nhiều ngôn ngữ cho phép sử dụng chỉ số âm (ví dụ như [-1]
) Truy cập vào phần tử cuối cùng của đối tượng/mảng/chuỗi.
Điều này không thể thực hiện được trong JavaScript vì []
Để truy cập vào mảng và đối tượng. obj[-1] chỉ là giá trị của khóa -1, không phải là thuộc tính cuối cùng của đối tượng.
at()
Phương thức được giới thiệu trong ES2022 để giải quyết vấn đề này.
JavaScript String at()
ES2022 đã giới thiệu phương thức chuỗi at()
:
Ví dụ 1
Lấy chữ cái thứ ba của chuỗi name:
const name = "W3Schools"; let letter = name.at(2);
Ví dụ 2
Lấy chữ cái thứ ba của chuỗi name:
const name = "W3Schools"; let letter = name[2];
at()
Phương pháp từ chuỗi trả về ký tự tại chỉ số cụ thể.
at()
Phương pháp với []
Kết quả trả về là giống nhau.
Từ tháng 3 năm 2022, tất cả các trình duyệt hiện đại đều hỗ trợ at()
Phương pháp:
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome 92 | Edge 92 | Firefox 90 | Safari 15.4 | Opera 78 |
Tháng 4 năm 2021 | tháng 7 năm 2021 | tháng 7 năm 2021 | tháng 3 năm 2022 | tháng 8 năm 2021 |
Điều chỉnh d của RegExp
ES2022 đã thêm /d
Điều chỉnh, được sử dụng để biểu thị bắt đầu và kết thúc của khớp.
Mẫu
let text = "aaaabb"; let result = text.match(/(aa)(bb)/d);
Điều chỉnh RegExp được sử dụng để chỉ định không phân biệt chữ hoa-chữ thường, và các tìm kiếm toàn cục khác:
Điều chỉnh | Mô tả | Thử ngay |
---|---|---|
g | Thực hiện khớp toàn cục (tìm tất cả). | Thử ngay |
i | Thực hiện khớp không phân biệt chữ hoa-chữ thường. | Thử ngay |
d | Thực hiện khớp chuỗi con (thêm vào ES2022). | Thử ngay |
m | Thực hiện khớp đa dòng. | Thử ngay |
Object.hasOwn()
ES2022 cung cấp một phương pháp an toàn để kiểm tra thuộc tính có phải thuộc tính tự có của đối tượng hay không.
Object.hasOwn()
Tương tự như Object.prototype.hasOwnProperty
Nhưng hỗ trợ tất cả các loại đối tượng.
Mẫu
Object.hasOwn(myObject, age)
Nguyên nhân lỗi
ES2022 cho phép chỉ định nguyên nhân cơ bản của lỗi thông qua error.cause.
Mẫu
try { connectData(); } throw new Error("Connecting failed.", { cause: err }); }
JavaScript await import
JavaScript module bây giờ có thể chờ các tài nguyên cần导入 trước khi chạy:
import {myData} from './myData.js'; const data = await myData();
Khai báo trường lớp JavaScript
class Hello { counter = 0; // trường lớp } const myClass = new Hello(); let x = myClass.counter;
Từ tháng 4 năm 2021, tất cả các trình duyệt hiện đại đều hỗ trợ khai báo trường lớp:
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome 72 | Edge 79 | Firefox 69 | Safari 14.1 | Opera 60 |
2019 tháng 1 | Tháng 1 năm 2020 | 2019 năm 9 tháng | Tháng 4 năm 2021 | Tháng 1 năm 2020 |
Cách sử dụng phương pháp và trường riêng tư trong JavaScript
class Hello { #counter = 0; // Trường riêng tư #myMethod() {} // Phương pháp riêng tư } const myClass = new Hello(); let x = myClass.#counter; // Lỗi myClass.#myMethod(); // Lỗi
Từ tháng 6 năm 2021, tất cả các trình duyệt hiện đại đều hỗ trợ các phương pháp và trường riêng tư:
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome 74 | Edge 79 | Firefox 90 | Safari 14.1 | Opera 62 |
Tháng 4 năm 2019 | Tháng 1 năm 2020 | Tháng 6 năm 2021 | Tháng 4 năm 2021 | Tháng 6 năm 2019 |