固定链接 ES10(ES2019)新特性介绍和代码实例

ES10(ES2019)新特性介绍和代码实例

ES10(ES2019)新特性介绍和代码实例

特性列表

  1. Optional Catch Binding
  2. Array.flat
  3. Array.flatMap
  4. String trimStart, trimEnd
  5. Object.fromEntries
  6. Function.prototype.toString()
  7. Symbol.prototype.description
  8. JSON.superset
  9. JSON.stringify

1. Optional Catch Binding

以往的异常捕获语句,无论你是否用到,都需要在catch后面需要带上error参数,有代码洁癖的一定难以忍受,新的接口规范支持在不需要的时候不用带了

老的编码方式

新的编码方式

真实场景

如解析json字符串为对象的时候

官方链接 https://github.com/tc39/proposal-optional-catch-binding

2. Array.flat 数组展开

flat(depth)方法会按照一个可指定的深度(默认值为1)递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回。在以往,可以需要写个方法无限递归才可以实现同样的效果。

代码实例

// 使用 Infinity 常量,可无限展开任意深度的嵌套数组

真实场景

打平树结构,如多层嵌套文件树,或者多层嵌套的叶子结构

3. Array.flatMap

Array.flatMap跟flat和map都有些相似,可以映射每个元素,最后跟map一样生成一个新的数组;同时也跟flat一样,打平数组,但只支持深度为1。

真实场景

把二维数组打平并转换迭代每一个元素生成一个新的一维数组
参考链接:

4. String

String.prototype.{trimStart,trimEnd},相对应的另外二个别名是String.prototype.{trimLeft,trimRight}。
用途分别是移除字符串前面,后面的空格。

真实场景

在表单内容录入的时候,用户可能无意输入了空格,此时可使用该方法去掉

5. Object.fromEntries

该方法是将一个键值列表转换为一个对象

代码实例

真实场景

6. Function.prototype.toString

函数的toString方法其实之前就已经有了,es2019算是修订版,增加了打印函数内注释的能力,不过不支持箭头函数

7. Symbol.prototype.description

Symbol是es6引入的新的数据类型。生成的每一个值都是唯一的,且无法跟传入的值做对比,而description属性可以拿到Symbol里面的值。

真实场景

Symbol('test'). description === 'test' // true
参考链接: https://tc39.es/proposal-Symbol-description/

8. JSON.superset

背景是ES2019之前不支持转义行分隔符 (\u2028) 和段落分隔符 (\u2029) 字符,且在解析过程时报错: SyntaxError: Invalid or unexpected token。
新的提供了支持
参考链接: https://github.com/tc39/proposal-json-superset

9. JSON.stringify

也算是之前版本的修订版,对超出的Unicode字符串做了处理,将原来的乱码改成了有效的Unicode字符串
参考链接: https://github.com/tc39/proposal-well-formed-stringify

作者:柯有谋

您的留言将激励我们越做越好