Có gì mới trong JavaScript ES2019

bởi Vali Shah

Nhiều người trong chúng ta biết rằng có một quy trình chuẩn cho các bản phát hành mới nhất của Javascript và một ủy ban đằng sau đó. Trong bài đăng này, tôi sẽ giải thích về người đưa ra quyết định cuối cùng về bất kỳ thông số kỹ thuật mới nào, quy trình cho nó là gì và có gì mới trong ES2019.

Đặc tả ngôn ngữ điều khiển JavaScript được gọi là ECMAScript. Có một ê-kíp đứng sau gọi là Ban kỹ thuật 39 [TC39] xem xét mọi thông số kỹ thuật trước khi áp dụng.

Mọi thay đổi đều trải qua một quá trình với các giai đoạn trưởng thành.

• Giai đoạn 0: Ý tưởng/Người rơm
• Giai đoạn 1: đề xuất
• Giai đoạn 2: bản nháp
• Giai đoạn 3: Ứng viên
• Giai đoạn 4: Đã hoàn thành/Đã phê duyệt

Một tính năng đạt đến giai đoạn 4 rất có thể sẽ là một phần của đặc tả ngôn ngữ.

Hãy đi sâu vào những thứ mới được thêm vào thông số kỹ thuật trong ES2019.

Array.prototype. {phẳng,phẳngBản đồ}

Array.prototype.flat() đề xuất làm phẳng các mảng theo cách đệ quy lên đến quy định depth và trả về một mảng mới.

cú pháp: Array.prototype.flat(depth)
chiều sâu – Giá trị mặc định 1Sử dụng Infinity để làm phẳng tất cả các mảng lồng nhau.

const numbers = [1, 2, [3, 4, [5, 6]]];
// Considers default depth of 1
numbers.flat(); 
> [1, 2, 3, 4, [5, 6]]
// With depth of 2
numbers.flat(2); 
> [1, 2, 3, 4, 5, 6]
// Executes two flat operations
numbers.flat().flat(); 
> [1, 2, 3, 4, 5, 6]
// Flattens recursively until the array contains no nested arrays
numbers.flat(Infinity)
> [1, 2, 3, 4, 5, 6]

Array.prototype.flatMap() ánh xạ từng phần tử bằng cách sử dụng hàm ánh xạ và làm phẳng kết quả thành một mảng mới. Nó giống hệt với hoạt động bản đồ theo sau là một flat của depth 1.

Cú pháp: Array.prototype.flatMap(callback)
gọi lại: function tạo ra một phần tử của Mảng mới.

const numbers = [1, 2, 3];
numbers.map(x => [x * 2]);
> [[2], [4], [6]]
numbers.flatMap(x => [x * 2]);
> [2, 4, 6]

Object.fromEntries

Object.fromEntries thực hiện ngược lại Object.entries . Nó chuyển đổi danh sách các cặp khóa-giá trị thành một đối tượng.

Cú pháp: Object.fromEntries(iterable)
có thể lặp lại: Một lần lặp như Array hoặc Map hoặc các đối tượng thực hiện giao thức lặp lại

const records = [['name','Mathew'], ['age', 32]];
const obj = Object.fromEntries(records);
> { name: 'Mathew', age: 32}
Object.entries(obj);
> [['name','Mathew'], ['age', 32]];

String.prototype. {trimStart, trimEnd}

trimStart() xóa khoảng trắng ở đầu chuỗi và trimEnd() xóa khoảng trắng ở cuối chuỗi.

const greeting = ` Hello Javascript! `;
greeting.length;
> 19
greeting = greeting.trimStart();
> 'Hello Javascript! '
greeting.length;
> 18
greeting = 'Hello World!   ';
greeting.length;
> 15
greeting = greeting.trimEnd();
> 'Hello World!'
greeting.length;
> 12

Liên kết bắt tùy chọn

Trước đặc điểm kỹ thuật mới, bắt buộc phải có một biến ngoại lệ liên kết với một catch khoản. ES2019 làm cho nó trở thành tùy chọn.

// Before
try {
   ...
} catch(error) {
   ...
}
// After
try {
   ...
} catch {
   ...
}

Tính năng này hữu ích khi bạn muốn hoàn toàn bỏ qua lỗi. Thực hành tốt nhất là xem xét xử lý một lỗi.

Có những trường hợp bạn biết lỗi có thể xảy ra khi vận hành. Bạn có thể bỏ qua việc xử lý khối bắt.

JSON ⊂ ECMAScript

Các ký hiệu dấu tách dòng (U+2028) và dấu tách đoạn (U+2029) hiện được cho phép ở dạng chuỗi ký tự. Trước đây, chúng được coi là đầu cuối dòng và dẫn đến SyntaxError ngoại lệ.

// Produces invalid string before ES2019
eval('"\u2028"');
// Valid in ES2019
eval('"\u2028"');

JSON.opesify được định dạng tốt

Thay vì các điểm mã thay thế không ghép nối dẫn đến một UTF-16 đơn vị mã, ES10 đại diện cho chúng bằng chuỗi thoát JSON.

JSON.stringify('\uD800');
> '"�"'
JSON.stringify('\uD800');
> '"\\ud800"'

Hàm.prototype.toString

.toString() hiện trả về các lát chính xác của văn bản mã nguồn, bao gồm khoảng trắng và nhận xét.

function /* a comment */ foo () {}
// Previously:
foo.toString();
> 'function foo() {}'
             ^ no comment
                ^ no space
// Now:
foo.toString();
> 'function /* comment */ foo () {}'

Biểu tượng.prototype.description

Thuộc tính chỉ đọc trả về mô tả tùy chọn của một Symbol Vật:

Symbol('desc').toString();
> "Symbol(desc)"
Symbol('desc').description;  
> "desc"
Symbol('').description;      
> ""
Symbol().description;
> undefined

Phần kết luận

TC39 giữ tất cả các thông số kỹ thuật sắp tới ở giai đoạn> 1 của quy trình tại đây. Là một nhà phát triển, điều quan trọng là phải theo dõi những gì đang xảy ra xung quanh. Còn rất nhiều điều thú vị sắp tới libao gồm các phương thức và trường tĩnh & riêng tư trong các lớp, Legacy RegEx, v.v. Tìm hiểu tất cả những điều mới đang trong giai đoạn đề xuất tại đây.

code = coffee + developer

Dưới đây là một vài chủ đề thú vị hơn: