请选择 进入手机版 | 继续访问电脑版

ES2018(es9) 使用指南

前端开发  / Javascript  / 倒序浏览   © 著作权归作者本人所有

#楼主# 2020-5-12

跳转到指定楼层

ECMAScript是JavaScript所基于的标准,并且通常缩写为ES。探索有关ECMAScript的所有内容以及ES2018中又称为ES9中添加的功能

ES6在处理数组解构时引入了rest元素的概念:

const numbers = [1, 2, 3, 4, 5]
[first, second, ...others] = numbers

传播元素

const numbers = [1, 2, 3, 4, 5]
const sum = (a, b, c, d, e) => a + b + c + d + e
const sumOfNumbers = sum(...numbers)

ES2018引入了相同的内容,但针对对象。

休息性质

const { first, second, ...others } = { first: 1, second: 2, third: 3, fourth: 4, fifth: 5 }

first // 1
second // 2
others // { third: 3, fourth: 4, fifth: 5 }

传播属性允许通过组合在spread-operator/之后传递的对象的属性来创建新对象:

const items = { first, second, ...others }
items //{ first: 1, second: 2, third: 3, fourth: 4, fifth: 5 }

异步迭代

新的构造for-await-of允许您将异步可迭代对象用作循环迭代:

for await (const line of readLines(filePath)) {
  console.log(line)
}

由于使用了await,因此您只能在async函数内部使用它,就像普通的函数一样await

Promise.prototype.finally()

兑现承诺后,成功地依次调用then()方法。

如果在此期间失败,则then()方法将被跳转并catch()执行该方法。

finally() 不管您是否成功执行promise,都可以运行一些代码:

fetch('file.json')
  .then(data => data.json())
  .catch(error => console.error(error))
  .finally(() => console.log('finished'))

正则表达式的改进

RegExp后置断言:根据字符串匹配后缀

这是一个先行内容:您可以?=用来匹配后面跟特定子字符串的字符串:

/Roger(?=Waters)/

/Roger(?= Waters)/.test('Roger is my dog') //false
/Roger(?= Waters)/.test('Roger is my dog and Roger Waters is a famous musician') //true

?!执行逆运算,如果字符串后没有特定的子字符串则匹配:

/Roger(?!Waters)/

/Roger(?! Waters)/.test('Roger is my dog') //true
/Roger(?! Waters)/.test('Roger Waters is a famous musician') //false

提前使用?=符号。它们已经可用。

新功能Lookbehinds使用?<=

/(?<=Roger) Waters/

/(?<=Roger) Waters/.test('Pink Waters is my dog') //false
/(?<=Roger) Waters/.test('Roger is my dog and Roger Waters is a famous musician') //true

使用`?以下方法可以使后向否定:

/(?<!Roger) Waters/

/(?<!Roger) Waters/.test('Pink Waters is my dog') //true
/(?<!Roger) Waters/.test('Roger is my dog and Roger Waters is a famous musician') //false

Unicode属性转义p{…}P{…}

在正则表达式模式中,您可以d用来匹配任何数字,s匹配非空格的w任何字符,匹配任何字母数字的字符,等等。

这项新功能将此概念扩展到所有Unicode字符引入p{}及其否定P{}

任何Unicode字符都有一组属性。例如,Script确定语言家族,ASCII是否为ASCII字符的布尔值等等。您可以将此属性放在图形括号中,正则表达式将检查该属性是否为真:

/^p{ASCII}+$/u.test('abc')   // yes
/^p{ASCII}+$/u.test('ABC@')  // yes
/^p{ASCII}+$/u.test('ABC') // no

ASCII_Hex_Digit 是另一个布尔属性,用于检查字符串是否仅包含有效的十六进制数字:

/^p{ASCII_Hex_Digit}+$/u.test('0123456789ABCDEF') // yes
/^p{ASCII_Hex_Digit}+$/u.test('h')                // no

还有许多其他的布尔属性,你只是图中所加括号的名称,包括检查UppercaseLowercaseWhite_SpaceAlphabeticEmoji和更多:

/^p{Lowercase}$/u.test('h') //yes
/^p{Uppercase}$/u.test('H') //yes

/^p{Emoji}+$/u.test('H')   // no
/^p{Emoji}+$/u.test('te') //yes

除了这些二进制属性外,您还可以检查任何unicode字符属性以匹配特定值。在此示例中,我检查字符串是否以希腊字母或拉丁字母书写:

/^p{Script=Greek}+$/u.test('ελληνικά') //yes
/^p{Script=Latin}+$/u.test('hey') //yes

阅读有关可直接在投标中使用的所有属性的更多信息。

命名捕获组

在ES2018中,可以为捕获组分配一个名称,而不仅仅是在结果数组中分配一个插槽:

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

// result.groups.year === '2015';
// result.groups.month === '01';
// result.groups.day === '02';

s正则表达式的标志

s标志(表示单行)的缩写也使.匹配新行字符。没有它,该点将匹配常规字符,但不匹配新行:

/hi.welcome/.test('hinwelcome') // false
/hi.welcome/s.test('hinwelcome') // true
转播转播
回复

使用道具

成为第一个评论人

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关于作者

qqpite

网站编辑

  • 主题

    245

  • 帖子

    248

  • 关注者

    0

手机版|ObjectX 超对象 |粤ICP备20005929号
Powered by  © 2019-2020版权归ObjectX 超对象