ES2018 新增特性清單

Rest/Spread 屬性 rest 將對象的剩餘屬性複製到一個新對象中。javascript

let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 };
x; // 1
y; // 2
z; // { a: 3, b: 4 }

spread 將對象的屬性快速複製到另外一個對象。php

let n = { x, y, ...z };
n; // { x: 1, y: 2, a: 3, b: 4 }

異步iterator和異步iterables 與iterator不一樣,異步iterator的next()方法返回一個包含{ value, done }的promise。java

const { value, done } = syncIterator.next();

asyncIterator.next().then(({ value, done }) => /* ... */);

能夠看到syncIterator是一個異步遍歷器。它能夠經過異步generator生成。下面演示如何定義異步generator函數。
異步 generator 函數web

async function* asyncGen() {
  let p1 = new Promise((resolve, reject) =>{
      setTimeout(()=>{
          resolve(1);
      }, 1000)
  });
  let p2 = new Promise((resolve, reject) =>{
      setTimeout(()=>{
          resolve(2);
      }, 1000)
  });
  yield await p1;
  yield await p2
}

for-await-of es2018提供了新的遍歷語法對異步 iterator 進行遍歷。ajax

for await (const val of asyncGen()) {
  console.log(val);
}

Promise.prototype.finally()正則表達式

Promise.prototype.finally()

無論promise的執行結果是成功仍是失敗,在promise執行完成後,會觸發一個回調函數。常見的應用場景好比在ajax請求成功或失敗後,隱藏loading動畫。json

fetch('https://demo.com/endpoint')
.then(res => {
    // ...
})
.catch(err => {
    // ...
})
.finally(() => {
    // do sth no matter success or failure
})

tagged 模板字符串與 轉義序列 從es2016開始,tagged 模板字符串會對以u、u{}、x開頭或者加數字開頭的字符串進行轉義。可是若是在模板字符串中出現以上述字符開頭的非轉義字符的話,會報語法錯誤。
es2018中取消了tagged 模板中對於轉義字符的限制,正常解析的話能夠正常獲取轉義字符的值,不然的話返回undefined。promise

function latex(str) { 
 return { "cooked": str[0], "raw": str.raw[0] }
} 

latex`\unicode`
// { cooked: undefined, raw: "\unicode"}

能夠看到咱們經過str[0]去獲取轉義字符的值並不會報錯。經過str.raw[0]能夠正常取得字符串"unicode"。
正則相關的特性 s (dotAll)模式 咱們知道元字符瀏覽器

.

沒法匹配r n u{2048} u{2049}等換行符。
在 ES2018 中爲正則表達式增長了一個新的標誌less

s

用來表示屬性

dotAll

。以使

.

能夠匹配任意字符, 包括換行符。

const re = /foo.bar/s;
re.test('foo\nbar');
// → true
re.dotAll
// → true
re.flags
// → 's'

命名捕獲組 named capture groups 正則表達式中能夠經過數字索引來引用()語法捕獲的部分匹配結果。如

let re = /(\d{4})-(\d{2})-(\d{2})/;
let result = re.exec('2015-01-02');
console.log(result[1],result[2],result[3]);
// 2015, 01, 02

es2018中提供了命名捕獲組的功能。咱們能夠經過

(?<name>...)

語法給捕獲組命名。

let re = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/u;
let result = re.exec('2015-01-02');
// result.groups.year === '2015';
// result.groups.month === '01';
// result.groups.day === '02';

或者以解構語法簡化代碼:

let {groups: {year, month, day}} = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/u.exec('2015-01-02');
console.log(`year: ${year}, month: ${month}, day: ${day}`);  // prints year: 2015, month: 01, day: 02

後行斷言 es5中,正則只支持先行斷言。例如:
正向先行斷言/x(?=y)/表示字符x後面的位置必須是y。
負向先行斷言/x(?!y)/表示x字符後面的位置不能等於y。
es2018中新增了後行斷言的支持。例如:
/(?<=y)x/表示字符x前面的位置必須是y。
/(?<!y)x/表示字符x前面的位置不能是y。

let re = /(?<=java)script/;
consle.log(re.test('javascript'));
// true

Unicode property escapes

Unicode property escapes

使得能夠在js正則表達式中本地訪問這些

Unicode

字符屬性。 例如,模式

\p {Script_Extensions = Greek}

匹配希臘腳本中的任意符號。

const regexGreekSymbol = /\p{Script_Extensions=Greek}/u;
regexGreekSymbol.test('π');
// → true

可選的catch參數 es2018對語法進行了修改,

catch

在沒使用參數的狀況下省略括號。例如:

try {
  // try to use a web feature which may not be implemented
} catch (unused) {
  // fall back to a less desirable web feature with broader support
}

上述代碼在新規範下能夠寫成:

try {
  // try to use a web feature which may not be implemented
} catch {
 // 省略catch後的函數括號
}

JSON 超集 咱們知道es5中經過JSON.parse能夠將json字符串轉換成js的json對象。但有例外,那就是當json文本中存在未轉義的換行符如u2028,u2029時,js中會報語法錯誤。
es2018中作了擴展,支持了全部的json文本,所以一樣容許未轉義的換行符的存在。

const LS = "
";
const PS = eval("'\u2029'");

上述代碼片斷在實現了es2018規範的瀏覽器中是不會出現語法錯誤的,反之則會報語法錯誤。本身能夠試一下。
轉載於猿2048:➻《ES2018 新增特性清單》

相關文章
相關標籤/搜索