JavaScript: ES2019更新了什麼呢?

原文:blog.tildeloop.com/posts/javas…
譯者:前端技術小哥javascript

JavaScript(JS)是最流行的編程語言之一,也是Web開發的主要語言之一,它在不斷髮展,每一次迭代都會帶來一些新的內部變化。讓咱們來看看ES2019的一些新功能,它們可能很快就會進入咱們的平常代碼:前端

Array.flat()
如今咱們能夠將嵌套數組按照指定的深度遞歸展開。默認值是1,若是想徹底展開則使用Infinity。該方法不會修改原始數組,而是建立一個新的數組:java

const arr1 = [1, 2, [3, 4]];
arr1.flat(); // [1, 2, 3, 4]

const arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat(2); // [1, 2, 3, 4, 5, 6]

const arr3 = [1, 2, [3, 4, [5, 6, [7, 8]]]];
arr3.flat(Infinity); // [1, 2, 3, 4, 5, 6, 7, 8]
複製代碼

若是你的數組中有一個空槽,它將被刪除:編程

const arr4 = [1, 2, , 4, 5];
arr4.flat(); // [1, 2, 4, 5]
複製代碼

Array.flatMap()
這是一個全新的方法,它結合了基本的map函數,而後使用新的Array.flat()方法將結果展平1個深度:數組

const arr1 = [1, 2, 3];

arr1.map(x => [x * 4]); // [[4], [8], [12]]
arr1.flatMap(x => [x * 4]); // [4, 8, 12]
複製代碼

另外一個更有用的例子:bash

const sentence = ["This is a", "regular", "sentence"];

sentence.map(x => x.split(" ")); // [["This","is","a"],["regular"],["sentence"]]
sentence.flatMap(x => x.split(" ")); // ["This","is","a","regular", "sentence"]

複製代碼

String.trimStart() and String.trimEnd()
除了同時刪除字符串兩邊的空格的String.Trim()以外,如今還出現了另外一個方法只刪除字符串兩邊任意一邊的空格:編程語言

const test = " hello ";

test.trim(); // "hello";
test.trimStart(); // "hello ";
test.trimEnd(); // " hello";
複製代碼

Object.fromEntries
這是一個全新的方法:根據提供的鍵值對生成對象。它是咱們熟悉的函數Object.Entries的逆向操做。(Object.Entries將對象轉換爲數組,以便更容易地進行操做。)在轉換以後,咱們會獲得一個數組,可是如今咱們能夠將調整事後的數組返回到一個對象中。讓咱們試着用一個例子,咱們想平方全部對象屬性的值:函數

const obj = { prop1: 2, prop2: 10, prop3: 15 };

let array = Object.entries(obj); // [["prop1", 2], ["prop2", 10], ["prop3", 15]]

複製代碼

讓咱們用一個簡單的映射將新生成的鍵值對的值平方:oop

array = array.map(([key, value]) => [key, Math.pow(value, 2)]); // [["prop1", 4], ["prop2", 100], ["prop3", 225]]post

咱們已經轉換了對象值,但咱們只剩下一個數組,這時候咱們就須要Object.fromEntries,它將數組轉換回一個對象:

const newObj = Object.fromEntries(array); // {prop1: 4, prop2: 100, prop3: 225}

可選的catch綁定
這個新提案使咱們可以徹底省略catch()塊,由於在不少狀況下,咱們並不須要它:

try {
  //...
} catch (er) {
  //handle error with parameter er
}

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

複製代碼

Symbol.description
咱們如今能夠任意訪問一個Symbol的description屬性,無需藉助toString()方法。

const testSymbol = Symbol("Desc");

testSymbol.description; // "Desc"
複製代碼

函數.toString ()
如今,咱們對一個函數調用toString(),將徹底按照定義的方式返回函數,包括空格和註釋。以前咱們有:

function /* foo comment */ foo() {}

foo.toString(); // "function foo() {}"
複製代碼

而後如今是:

foo.toString(); // "function /* foo comment */ foo() {}"

JSON.parse()
如今,行分隔符 (\u2028) 和段落分隔符 (\u2029) 能被正確地解析,而不會致使SyntaxError。

但願本文能幫助到您!

看以後
點贊,讓更多的人也能看到這篇內容(收藏不點贊,都是耍流氓 -_-)
關注公衆號「新前端社區」,享受文章首發體驗!
每週重點攻克一個前端技術難點。

相關文章
相關標籤/搜索