ES10的13个新特性示例(小结)


Posted in Javascript onSeptember 23, 2019

ES10的13个新特性示例(小结)

介绍

ES10是与2019年相对应的ECMAScript版本。这个版本中的新功能没有ES6(2015)中的那么多。但是,也不乏一些有用的功能。

本文在简单的代码示例中介绍了ES10提供的功能。这样,您无需复杂的解释即可快速了解新功能。

当然,需要具备JavaScript的基础知识才能完全理解所介绍的新功能。

ES2019中的JavaScript新功能包括:

  • Array#{flat,flatMap}
  • Object.fromEntries
  • String#{trimStart,trimEnd}
  • Symbol#description
  • try { } catch {} // 可选的错误参数绑定
  • JSON ⊂ ECMAScript
  • 格式良好的 JSON.stringify
  • 稳定的排序 Array#sort
  • 新版 Function#toString
  • 新增 BigInt 原始类型 (stage 3).
  • 动态引入模块(stage 3).
  • 标准的 globalThis 对象 (stage 3).
  • ES10 Class: private, static & public (stage 3).

Array.flat() & Array.flatMap()

两个新的数组方法:

Array.flat() 方法创建一个新数组,所有子数组元素都以递归方式合并到该数组中,直至达到指定深度。

Array.flatMap() 方法首先使用map函数转换每个元素,然后将结果展平为新数组。它与map()后再调用深度为1的flat() 效果相同,但是flatMap()将两者合并为一种方法,效率更高。

ES10的13个新特性示例(小结)

Object.fromEntries()

把键值对数组为元素的二维数组转换为一个对象。

ES10的13个新特性示例(小结)

String.protype.matchAll()

matchAll() 方法返回所有与正则表达式匹配字符串的结果的迭代器,包括捕获组。

ES10的13个新特性示例(小结)

String.trimStart() & String.trimEnd()

有两种新的String方法可从字符串中删除空格:

trimStart() 方法从字符串的开头删除空格。
trimEnd() 方法从字符串末尾删除空格。

ES10的13个新特性示例(小结)

Symbol.Description

当创建符号时,可以提供一个字符串作为描述。在ES10中,有一个获取描述的访问器。

ES10的13个新特性示例(小结)

可选的 Catch 参数变量

过去,try / catch语句中的catch子句需要一个变量。现在,它允许开发人员使用try / catch而不创建未使用的error变量绑定。

ES10的13个新特性示例(小结)

JSON⊂ECMAScript

在ES10之前的版本中,不接受非转义的行分隔符U+2028和段落分隔符U+2029。

U+2028是段落分隔符。
U+2029是行分隔符。

ES10的13个新特性示例(小结)

格式良好的 JSON.stringify()

JSON.stringify() 可能返回U+D800和U+DFFF之间的字符,来作为没有等效UTF-8字符的值。但是,JSON格式需要UTF-8编码。解决方案是,将未配对的替代代码点表示为JSON转义序列,而不是将其作为单个UTF-16代码单元返回。

ES10的13个新特性示例(小结)

Array.prototype.sort()

V8的先前实现,对包含10个以上项的数组使用了不稳定的快速排序算法。

一种稳定的排序算法是,当两个具有相同键的对象在排序输出中出现的顺序,与未排序输入中出现的顺序相同。

ES10的13个新特性示例(小结)

新版 Function.toString()

toString() 方法返回一个表示函数源代码的字符串。在ES6中,当在函数上调用toString时,它将根据ECMAScript引擎返回该函数的字符串表示形式。如果可能,它将返回源代码,否则-一个标准化的占位符。

ES10的13个新特性示例(小结)

BigInt — 任意精度的整数

BigInt是第7个原始类型,它是一个任意精度的整数。而不仅仅是在9007199254740992处的最大值。

ES10的13个新特性示例(小结)

动态引入

动态import()返回所请求模块的Promise。因此,可以使用async/await 将导入的模块分配给变量。

ES10的13个新特性示例(小结)

ES10的13个新特性示例(小结)

标准 globalThis 对象

全局 this 在ES10之前尚未标准化。在生产代码中,您可以通过编写下边代码来“标准化”它:

ES10的13个新特性示例(小结)

ES10 Class: private, static & public 成员变量,函数

现在,新的语法字符#(哈希标签)用于直接在类中定义变量,函数,getter和setter,以及构造函数和类方法。

ES10的13个新特性示例(小结)

总结

自2015年ES6出现以来,这个语言就一直处于高速发展的状态。在这篇文章中,我们回顾了ES10(2019)中出现的功能,并介绍了一些在ES11(2020)中将保持稳定的功能,因为它们处于状态3,并且可能最终会在下一版中实现标准化。

尽管这些功能中的许多功能对于Web应用程序的开发可能不是必需的,但是它们提供了通过技巧或大量冗长代码才能实现的可能性。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 对象定义方法 简单易学
Mar 22 Javascript
javascript权威指南 学习笔记之null和undefined
Sep 25 Javascript
jQuery将多条数据插入模态框的示例代码
Sep 25 Javascript
javascript数组去重方法汇总
Apr 23 Javascript
jQuery实现向下滑出的平滑下拉菜单效果
Aug 21 Javascript
Bootstrap安装环境配置教程分享
May 27 Javascript
JS在浏览器中解析Base64编码图像
Feb 09 Javascript
微信小程序开发之相册选择和拍照详解及实例代码
Feb 22 Javascript
探讨Vue.js的组件和模板
Oct 27 Javascript
vue使用pdfjs显示PDF可复制的实现方法
Dec 14 Javascript
微信小程序mpvue点击按钮获取button值的方法
May 29 Javascript
解析vue、angular深度作用选择器
Sep 11 Javascript
layui-tree实现Ajax异步请求后动态添加节点的方法
Sep 23 #Javascript
vue多页面项目中路由使用history模式的方法
Sep 23 #Javascript
JS随机密码生成算法
Sep 23 #Javascript
详解mpvue开发微信小程序基础知识
Sep 23 #Javascript
layui动态渲染生成左侧3级菜单的方法(根据后台返回数据)
Sep 23 #Javascript
layui树形菜单动态遍历的例子
Sep 23 #Javascript
Vue+elementui 实现复杂表头和动态增加列的二维表格功能
Sep 23 #Javascript
You might like
高性能PHP框架Symfony2经典入门教程
2014/07/08 PHP
ThinkPHP提示错误Fatal error: Allowed memory size的解决方法
2015/02/12 PHP
PHP JSON格式的中文显示问题解决方法
2015/04/09 PHP
PHP sdk文档处理常用代码示例解析
2020/12/09 PHP
图片自动更新(说明)
2006/10/02 Javascript
如何用javascript去掉字符串里的所有空格
2007/02/08 Javascript
CodeMirror2 IE7/IE8 下面未知运行时错误的解决方法
2012/03/29 Javascript
jquery validate在ie8下的bug解决方法
2013/11/13 Javascript
浅析JavaScript中两种类型的全局对象/函数
2013/12/05 Javascript
JS动态日期时间的获取方法
2015/09/28 Javascript
基于jquery实现智能提示控件intellSeach.js
2016/03/17 Javascript
jQuery自定义图片缩放拖拽插件imageQ实现方法(附demo源码下载)
2016/05/27 Javascript
vue.js指令v-model使用方法
2017/03/20 Javascript
jQuery插件FusionCharts实现的MSBar3D图效果示例【附demo源码】
2017/03/23 jQuery
javascript  数组排序与对象排序的实例
2017/07/17 Javascript
vue mint-ui学习笔记之picker的使用
2017/10/11 Javascript
JS实现的碰撞检测与周期移动完整示例
2019/09/02 Javascript
js获取 gif 的帧数的代码实例
2019/09/10 Javascript
微信公众号H5之微信分享常见错误和问题(小结)
2019/11/14 Javascript
vue实现路由不变的情况下,刷新页面操作示例
2020/02/02 Javascript
jquery传参及获取方式(两种方式)
2020/02/13 jQuery
python实现汉诺塔方法汇总
2016/07/25 Python
Python命令启动Web服务器实例详解
2017/02/23 Python
Python实现图片转字符画的示例代码
2017/08/21 Python
怎么使用pipenv管理你的python项目
2018/03/12 Python
Expedia爱尔兰:酒店、机票、租车及廉价假期
2017/01/02 全球购物
Tiqets荷兰:出售欧洲最美丽的景点和博物馆门票
2018/01/09 全球购物
思想汇报格式
2014/01/05 职场文书
运动会获奖感言
2014/02/11 职场文书
租房安全协议书
2014/08/20 职场文书
优秀团队申报材料
2014/12/26 职场文书
教师个人学习总结
2015/02/11 职场文书
给老婆的检讨书(搞笑版)
2015/05/06 职场文书
《比的意义》教学反思
2016/02/18 职场文书
Go语言并发编程 sync.Once
2021/10/16 Golang
什么是SOLID
2022/03/24 Javascript