ECMAScript 2022
Số phiên bản JavaScript
Các phiên bản ECMAScript cũ được đặt tên theo số: ES5 và ES6.
Từ năm 2016, các phiên bản được đặt tên theo năm: ES2016, 2018, 2020, 2022.
Các tính năng mới trong ES2022
- Mảng tại()
- Chuỗi tại()
- RegExp /d
- Object.hasOwn()
- lỗi.nguyên nhân
- chờ nhập khẩu
- Khai báo trường lớp
- Các phương thức và trường riêng tư
Cảnh báo
Những tính năng này là tương đối mới.
Các trình duyệt cũ hơn có thể cần mã thay thế (Polyfill)
Mảng JavaScript tại()
ES2022 giới thiệu phương thức mảng at() :
Ví dụ
Lấy phần tử thứ ba của trái cây:
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits.at(2);
Hãy tự mình thử »Lấy phần tử thứ ba của trái cây:
const fruits = ["Banana", "Orange", "Apple", "Mango"];
let fruit = fruits[2];
Hãy tự mình thử » Phương thức at() trả về một phần tử được lập chỉ mục từ một mảng.
Phương thức at() trả về giống như [] .
Phương thức at() được hỗ trợ trong tất cả các trình duyệt hiện đại kể từ tháng 3 năm 2022:
| Chrome 92 | Edge 92 | Firefox 90 | Safari 15.4 | Opera 78 |
| Apr 2021 | Jul 2021 | Jul 2021 | Mar 2022 | Aug 2021 |
Ghi chú
Nhiều ngôn ngữ cho phép negative bracket indexing như [-1] để truy cập các phần tử từ cuối đối tượng/mảng/chuỗi.
Điều này là không thể trong JavaScript, vì [] được sử dụng để truy cập cả mảng và đối tượng. obj[-1] đề cập đến giá trị của khóa -1, không phải thuộc tính cuối cùng của đối tượng.
Phương thức at() được giới thiệu trong ES2022 để giải quyết vấn đề này.
Chuỗi JavaScript tại()
ES2022 đưa ra phương thức chuỗi at() :
Ví dụ
Lấy chữ cái thứ ba của tên:
const name = "W3Schools";
let letter = name.at(2);
Hãy tự mình thử »Lấy chữ cái thứ ba của tên:
const name = "W3Schools";
let letter = name[2];
Hãy tự mình thử » Phương thức at() trả về một phần tử được lập chỉ mục từ một chuỗi.
Phương thức at() trả về giống như [] .
Phương thức at() được hỗ trợ trong tất cả các trình duyệt hiện đại kể từ tháng 3 năm 2022:
| Chrome 92 | Edge 92 | Firefox 90 | Safari 15.4 | Opera 78 |
| Apr 2021 | Jul 2021 | Jul 2021 | Mar 2022 | Aug 2021 |
Công cụ sửa đổi RegExp d
ES2022 đã thêm từ bổ nghĩa /d để thể hiện sự bắt đầu và kết thúc trận đấu.
Công cụ sửa đổi RegExp được sử dụng để xác định các tìm kiếm không phân biệt chữ hoa chữ thường và các tìm kiếm chung khác:
| Modifier | Description | Try it |
|---|---|---|
| i | Perform case-insensitive matching | Try it » |
| g | Perform a global match (find all) | Try it » |
| m | Perform multiline matching | Try it » |
| d | Perform substring matches (New in ES2022) | Try it » |
Đối tượng có riêng
ES2022 cung cấp một cách an toàn để kiểm tra xem một thuộc tính có phải là thuộc tính riêng của một đố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.
Nguyên nhân lỗi
ES2022 cho phép bạn chỉ định lý do xảy ra lỗi với error.cause .
Ví dụ
try {
connectData();
} catch (err) {
throw new Error("Connecting failed.", { cause: err });
}
Hãy tự mình thử » JavaScript đang chờ nhập
Các mô-đun JavasSript hiện có thể đợi các tài nguyên yêu cầu nhập 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; // Class field
}
const myClass = new Hello();
let x = myClass.counter;
Khai báo trường lớp được hỗ trợ trong tất cả các trình duyệt hiện đại kể từ tháng 4 năm 2021:
| Chrome 72 | Edge 79 | Firefox 69 | Safari 14.1 | Opera 60 |
| Jan 2019 | Jan 2020 | Sep 2019 | Apr 2021 | Jan 2020 |
Các trường và phương thức riêng tư của JavaScript
class Hello {
#counter = 0; // Private field
#myMethod() {} // Private method
}
const myClass = new Hello();
let x = myClass.#counter; // Error
myClass.#myMethod(); // Error
Phương thức và trường riêng tư được hỗ trợ trong tất cả các trình duyệt hiện đại kể từ tháng 6 năm 2021:
| Chrome 74 | Edge 79 | Firefox 90 | Safari 14.1 | Opera 62 |
| Apr 2019 | Jan 2020 | Jun 2021 | Apr 2021 | Jun 2019 |
