加入收藏 | 设为首页 | 会员中心 | 我要投稿 辽源站长网 (https://www.0437zz.com/)- 云专线、云连接、智能数据、边缘计算、数据安全!
当前位置: 首页 > 运营中心 > 建站资源 > 优化 > 正文

你可能错过的现代 JavaScript 特性

发布时间:2019-11-06 01:05:48 所属栏目:优化 来源:疯狂的技术宅
导读:尽管我在过去 7 年中几乎每天都在写 JavaScript 代码,但不得不承认,我实际上并不是很注意 ES 语言的发布声明。 async/await 和 Proxies 之类的主要特性是一回事,但是每年都有稳定的小规模、渐进式的改进在不断涌现,因为总有一些东西需要学习。 所以在

includes 可以通过第二个参数 fromIndex 让你提供一个偏移量:

  1. // positions   0  1  2  3  4 
  2. const array = [1, 1, 1, 2, 2]; 
  3.  
  4. array.includes(1, 2) === true 
  5. array.includes(1, 3) === false 

太顺手了。

函数签名: Array.prototype.includes : (match: any, offset?: Int) => boolean

ES2017

共享数组缓冲区和原子操作

这是一对很棒的功能,如果你要与 web workers 一起做大量的工作,那么这些特性将被证明是无价的。它们使你可以直接在进程之间共享内存,并通过设置锁来避免资源争抢的情况。

它们都是相当复杂的 API 功能,因此这里不回对其进行概述,但是可以通过 Sitepen 的文章了解更多信息。目前有一些浏览器还不支持,但有望在未来几年内得到改善。

ES2018

强大的正则表达式

ES2018引入了一整套正则表达式特性:

Lookbehind 匹配项(前向匹配)

在支持它的运行时中,你现在可以用正则表达式来进行前向匹配。例如要查找所有以美元开头的数字:

  1. const regex = /(?<=$)d+/; 
  2. const text  = 'This cost $400'; 
  3. text.match(regex) === ['400'] 

关键是新的 lookbehind 搜索组与lookahead 搜索组是一对邪恶的双胞胎:

  1. Look ahead:  (?=abc) 
  2. Look behind: (?<=abc) 
  3.  
  4. Look ahead negative:  (?!abc) 
  5. Look behind negative: (?<!abc) 

不幸的是,目前还没有什么方法可以为较旧的浏览器支持新的后向语法,所以你目前只能在 Node 上用它。

你可以命名捕获组

正则表达式真正强大的功能是能够挑选出子匹配项,并用它们进行一些简单的解析。但是直到不久前,我们只能通过数字来引用子匹配项,例如:

  1. const getNameParts  = /(w+)s+(w+)/g; 
  2. const name          = "Weyland Smithers"; 
  3. const subMatches    = getNameParts.exec(name); 
  4.  
  5. subMatches[1]     === 'Weyland' 
  6. subMatches[2]     === 'Smithers' 

现在有了一种语法,可以通过在要命名的每个组的括号的开头放置 ? 来分配这些子匹配项(或捕获组)的名称:

  1. const getNameParts  = /(?<first>w+)s(?<last>w+)/g; 
  2. const name          = "Weyland Smithers"; 
  3. const subMatches    = getNameParts.exec(name); 
  4.  
  5. const {first, last} = subMatches.groups 
  6. first             === 'Weyland' 
  7. last              === 'Smithers' 

不幸的是,目前暂时只有 Chrome 和 Node 支持。

现在可以用点匹配新行

你只需要提供 /s 标志,例如 /someRegex./s、`/anotherRegex./sg。

ES2019

Array.prototype.flat() & flatMap()

我很高兴在 MDN 上看到这些内容。

简单地说,flat() 将多维数组按指定的最大 depth 展平:

  1. const multiDimensional = [ 
  2.     [1, 2, 3], 
  3.     [4, 5, 6], 
  4.     [7,[8,9]] 
  5. ]; 
  6.  
  7. multiDimensional.flat(2) === [1, 2, 3, 4, 5, 6, 7, 8, 9] 

flatMap 本质上是一个 map,也是深度为 1 的 flat。当从映射函数返回一个数组,但你不希望结果为嵌套数据结构时,用它很方便:

  1. const texts = ["Hello,", "today I", "will", "use FlatMap"]; 
  2.  
  3. // with a plain map 
  4. const mapped = texts.map(text => text.split(' ')); 
  5. mapped === ['Hello', ['today', 'I'], 'will', ['use', 'FlatMap']]; 
  6.  
  7. // with flatmap 
  8. const flatMapped = texts.flatMap(text => text.split(' ')); 
  9. flatMapped === ['Hello', 'today', 'I', 'will', 'use', 'FlatMap']; 

未绑定的捕获

(编辑:辽源站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

推荐文章
    热点阅读