Hướng dẫn ES2019

ECMAScript là tiêu chuẩn dựa trên JavaScript và nó thường được viết tắt thành ES. Khám phá mọi thứ về ECMAScript và các tính năng được thêm vào ES2019

ESNext là tên luôn chỉ ra phiên bản tiếp theo của JavaScript.

Phiên bản ECMAScript hiện tại làES2018. It was released in June 2018.

Các phiên bản JavaScript trong lịch sử đã được chuẩn hóa trong mùa hè, vì vậy chúng tôi có thể mong đợiECMAScript 2019 to be released in summer 2019.

Vì vậy, tại thời điểm viết bài, ES2018 đã được phát hành vàESNext là ES2019

Các đề xuất đối với tiêu chuẩn ECMAScript được sắp xếp theo từng giai đoạn. Các giai đoạn 1-3 là nơi ươm mầm các tính năng mới và các tính năng đạt đến Giai đoạn 4 được hoàn thiện như một phần của tiêu chuẩn mới.

Tại thời điểm viết bài, chúng tôi có một số tính năng tạiStage 4. Tôi sẽ giới thiệu chúng trong phần này. Các phiên bản mới nhất của các trình duyệt chính sẽ triển khai hầu hết các trình duyệt đó.

  • Array.prototype.{flat,flatMap}
  • Ràng buộc đánh bắt tùy chọn
  • Object.fromEntries()
  • String.prototype.{trimStart,trimEnd}
  • Symbol.prototype.description
  • Cải tiến JSON
  • Đúng ngữ phápJSON.stringify()
  • Function.prototype.toString()

Một số thay đổi đó chủ yếu là để sử dụng nội bộ, nhưng bạn cũng nên biết điều gì đang xảy ra.

Có các tính năng khác ở Giai đoạn 3, có thể được nâng cấp lên Giai đoạn 4 trong vài tháng tới và bạn có thể xem chúng trên kho lưu trữ GitHub này:https://github.com/tc39/proposal.

Array.prototype.{flat,flatMap}

flat()là một phương thức thể hiện mảng mới có thể tạo mảng một chiều từ mảng nhiều chiều.

Thí dụ:

['Dog', ['Sheep', 'Wolf']].flat()
//[ 'Dog', 'Sheep', 'Wolf' ]

Theo mặc định, nó chỉ "phẳng" tối đa một mức, nhưng bạn có thể thêm một tham số để đặt số mức bạn muốn làm phẳng mảng. Đặt nó thànhInfinityđể có cấp độ không giới hạn:

['Dog', ['Sheep', ['Wolf']]].flat()
//[ 'Dog', 'Sheep', [ 'Wolf' ] ]

['Dog', ['Sheep', ['Wolf']]].flat(2)
//[ 'Dog', 'Sheep', 'Wolf' ]

['Dog', ['Sheep', ['Wolf']]].flat(Infinity)
//[ 'Dog', 'Sheep', 'Wolf' ]

Nếu bạn đã quen thuộc với JavaScriptmap()của một mảng, bạn biết rằng khi sử dụng nó, bạn có thể thực thi một hàm trên mọi phần tử của mảng.

flatMap()là một phương thức phiên bản Array mới kết hợpflat()vớimap(). Nó hữu ích khi gọi một hàm trả về một mảng trong lệnh gọi lại map (), nhưng bạn muốn mảng kết quả của mình bằng phẳng:

['My dog', 'is awesome'].map(words => words.split(' '))
//[ [ 'My', 'dog' ], [ 'is', 'awesome' ] ]

['My dog', 'is awesome'].flatMap(words => words.split(' '))
//[ 'My', 'dog', 'is', 'awesome' ]

Ràng buộc đánh bắt tùy chọn

Đôi khi chúng ta không cần phải có một tham số liên kết với khối bắt của một lần thử / bắt.

Trước đây chúng tôi phải làm:

try {
  //...
} catch (e) {
  //handle error
}

Ngay cả khi chúng tôi không bao giờ phải sử dụngeđể phân tích lỗi. Bây giờ chúng ta có thể đơn giản bỏ qua nó:

try {
  //...
} catch {
  //handle error
}

Object.fromEntries()

Đối tượng có mộtentries()phương pháp, kể từES2017.

Nó trả về một mảng chứa tất cả các thuộc tính của riêng đối tượng, dưới dạng một mảng[key, value]cặp:

const person = { name: 'Fred', age: 87 }
Object.entries(person) // [['name', 'Fred'], ['age', 87]]

ES2019 giới thiệu mộtObject.fromEntries(), có thể tạo một đối tượng mới từ mảng thuộc tính như vậy:

const person = { name: 'Fred', age: 87 }
const entries = Object.entries(person)
const newPerson = Object.fromEntries(entries)

person !== newPerson //true

String.prototype.{trimStart,trimEnd}

Tính năng này đã là một phần của v8 / Chrome gần một năm nay và nó sẽ được chuẩn hóa trong ES2019.

trimStart()

Trả về một chuỗi mới với khoảng trắng đã bị loại bỏ từ đầu chuỗi ban đầu

'Testing'.trimStart() //'Testing'
' Testing'.trimStart() //'Testing'
' Testing '.trimStart() //'Testing '
'Testing '.trimStart() //'Testing'

trimEnd()

Trả về một chuỗi mới với khoảng trắng đã bị loại bỏ từ cuối chuỗi ban đầu

'Testing'.trimEnd() //'Testing'
' Testing'.trimEnd() //' Testing'
' Testing '.trimEnd() //' Testing'
'Testing '.trimEnd() //'Testing'

Symbol.prototype.description

Bây giờ bạn có thể truy xuất mô tả của mộtBiểu tượngbằng cách truy cập nódescriptiontài sản thay vì phải sử dụngtoString()phương pháp:

const testSymbol = Symbol('Test')
testSymbol.description // 'Test'

Cải tiến JSON

Trước thay đổi này, các ký hiệu dấu phân tách dòng (\ u2028) và dấu phân tách đoạn (\ u2029) không được phép trong các chuỗi được phân tích cú pháp nhưJSON.

Sử dụngJSON.parse(), những ký tự đó dẫn đến mộtSyntaxErrornhưng bây giờ họ phân tích cú pháp chính xác, như được định nghĩa bởi tiêu chuẩn JSON.

Đúng ngữ phápJSON.stringify()

Sửa lỗiJSON.stringify()đầu ra khi nó xử lý các điểm mã UTF-8 thay thế (U + D800 đến U + DFFF).

Trước khi thay đổi này, cuộc gọiJSON.stringify()sẽ trả về một ký tự Unicode không đúng định dạng (“�”).

Giờ đây, những điểm mã đại diện đó có thể được biểu diễn một cách an toàn dưới dạng chuỗi bằng cách sử dụngJSON.stringify()và chuyển đổi trở lại hình thức biểu diễn ban đầu bằng cách sử dụngJSON.parse().

Function.prototype.toString()

Các hàm luôn có một phương thức thể hiện được gọi làtoString()trả về một chuỗi chứa mã hàm.

ES2019 đã giới thiệu một thay đổi đối với giá trị trả về để tránh loại bỏ các nhận xét và các ký tự khác như khoảng trắng, đại diện chính xác cho hàm như nó đã được định nghĩa.

Nếu trước đây chúng ta có:

function /* this is bar */ bar () {}

Hành vi là:

bar.toString() //'function bar() {}

bây giờ hành vi mới là:

bar.toString(); // 'function /* this is bar */ bar () {}'

Tải xuống miễn phí của tôiSổ tay dành cho Người mới bắt đầu JavaScript


Các hướng dẫn js khác: