DANH MỤC: Blog

Những tính năng mới trong ES10 (ECMAScript 2019)


Bày viết này mình sẽ không giới thiệu nhiều về ECMA (ai không biết có thể tìm hiểu tại đây) mà mình sẽ nói luôn các tính năng mới trong ES10 (ECMAScript 2019).

Chú ý: bạn cần update trình duyệt lên phiên bản mới nhất, mới có thể sử dụng được những tính năng này

1. Array.flat().

Phương thức này cho phép chúng ta tạo ra mảng mới với các phần tử của các mảng con.

var arr = [1, 2, 3, 4, [5, 6, [7, 8, 9]]];

console.log(arr.flat()); // [1, 2, 3, 4, 5, 6, [7, 8, 9]]
console.log(arr.flat()); // [1, 2, 3, 4, 5, 6, 7, 8, 9]

2. Array.flatMap().

Phương thức này tương tự như phương thức map nhưng nó sẽ đồng thời flat luôn mảng kết quả.

var arr = [1, 2, 3, 4, 5];

arrMap = arr.map(cur => [cur, cur + 2]);
console.log(arrMap); // [[1, 3], [2, 4], [3, 5], [4, 6], [5, 7]]

arrFlatMap = arr.flatMap(cur => [cur, cur + 2]);
console.log(arrFlatMap); // [1, 3, 2, 4, 3, 5, 4, 6, 5, 7]

3. Object.fromEntries().

Phương thức này cho phép chúng ta chuyển đổi một Array hoặc Map sang một object với object key là phần tử đầu của mảng và value là phần tử tiếp theo của mảng.

VD: đối với mảng

var arr = [['name', "Vu Thanh Tai"], ['blog', 'https://toidicode.com']];
var entries = Object.fromEntries(arr);

console.log(entries);
// {name: "Vu Thanh Tai", blog: "https://toidicode.com"}

VD: Đối với Map.

var arr = new Map([
    ['name', "Vu Thanh Tai"],
    ['blog', 'https://toidicode.com']
]);
var entries = Object.fromEntries(arr);

console.log(entries);
// {name: "Vu Thanh Tai", blog: "https://toidicode.com"}

VD: bạn có thể chuyển đổi qua lại với phương thức Object.entries()

var obj = {
    name: "Vu Thanh Tai",
    blog: "https://toidicode.com"
};

var arr = Object.entries(obj);
console.log(arr);
// [["name", "Vu Thanh Tai"],  ["blog", "https://toidicode.com"]]

var entries = Object.fromEntries(arr);

console.log(entries);
// {name: "Vu Thanh Tai", blog: "https://toidicode.com"}

4. String.trimStart() và String.trimEnd().

Phương thức trimStart() có tác dụng xóa bỏ khoảng trắng ở đầu chuỗi. Tương tự phương thức trimEnd() có tác dụng xóa bỏ khoảng trắng ở cuối chuỗi.

VD:

var str = "   Toidicode.com    ";

console.log(str.trimStart());
// "Toidicode.com   "

console.log(str.trimEnd());
// "   Toidicode.com"

5. Function.toString().

Phuơng thức này sẽ chuyển đổi tất cả mã nguồn của hàm về dạng string.

VD:

function say(name) {
    // this is comment
    return `name ${name}`;
}

console.log(say.toString());
/*
function say(name) {
    // this is comment
    return `name ${name}`;
}
*/

6. Symbol.description.

Thuộc tính này lấy ra mô tả của Symbol Object.

VD:

var site = 'Toidicode.com';

var sym = Symbol(site);

console.log(sym); // Symbol(Toidicode.com)
console.log(String(sym) === `Symbol(${site})`); // true
console.log(sym.description); // Toidicode.com

7. Catch tùy chọn.

Bây giờ bạn đã có thể không cần xác định exception trong catch nữa.

VD:

try {
    throw new Error("raise error")
} catch {
    console.log("Catch with none param")
}

// Catch with none param

8. JSON.Stringifly() hoạt động tốt hơn.

Nếu nhưng trước đây khi sử dụng JSON.Stringifly() hay trả về ill-formed Unicode thì nay nó đã được loại bỏ.

VD:

JSON.stringify('\ud834');
// "\ud834"

9. Array.sort() ổn định hơn.

Giờ đây chúng ta đã có thể sắp xếp mảng một cách ổn định hơn (trước đây nếu mảng lớn sẽ không được ổn định).

var priceList = [
    {name: 'Lo vi song', price: 10000},
    {name: 'Tran Nhu Nhong', price: 800000},
    {name: 'Nguyen Thi A', price: 240000},
    {name: 'Nguyen Thi B', price: 350000},
    {name: 'Nguyen Thi C', price: 400000},
    {name: 'Beola', price: 20000},
    {name: 'Be De', price: 70000},
    {name: 'Tung Son', price: 300000},
    {name: 'Ngoc Trinh', price: 400000},
    {name: 'Minh Beo', price: 0},
    {name: 'Tram Anh', price: 200000},
];

priceList.sort((a, b) => a.price - b.price);

console.log(priceList)
/*
[
    {name: "Minh Beo", price: 0},
    {name: "Lo vi song", price: 10000},
    {name: "Beola", price: 20000},
    {name: "Be De", price: 70000},
    {name: "Tram Anh", price: 200000},
    {name: "Nguyen Thi A", price: 240000},
    {name: "Tung Son", price: 300000},
    {name: "Nguyen Thi B", price: 350000},
    {name: "Nguyen Thi C", price: 400000},
    {name: "Ngoc Trinh", price: 400000},
    {name: "Tran Nhu Nhong", price: 800000},
 ]
 */

Nguồn: Toidicode.com

Thông tin tác giả

Vũ Thanh Tài

Vũ Thanh Tài

The best way to learn is to share

Hãy tham gia group facebook để cùng giao lưu chia sẻ kiến thức! Tham Gia

Bình Luận