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中的几个运算符
Jun 29 Javascript
JavaScript是否可实现多线程  深入理解JavaScript定时机制
Dec 22 Javascript
关于extjs4如何获取grid修改后的数据的问题
Aug 07 Javascript
jquery插件jquery倒计时插件分享
Dec 27 Javascript
在Linux上用forever实现Node.js项目自启动
Jul 09 Javascript
jquery实现标签支持图文排列带上下箭头按钮的选项卡
Mar 14 Javascript
javascript 分号总结及详细介绍
Sep 24 Javascript
BootStrap Datetimepicker 汉化的实现代码
Feb 10 Javascript
基于jQuery实现定位导航位置效果
Nov 15 jQuery
Vue退出登录时清空缓存的实现
Nov 12 Javascript
Vue3新特性之在Composition API中使用CSS Modules
Jul 13 Javascript
JavaScript如何操作css
Oct 24 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
动态新闻发布的实现及其技巧
2006/10/09 PHP
Yii2.0中的COOKIE和SESSION用法
2016/08/12 PHP
PHP实现小偷程序实例
2016/10/31 PHP
PHP正则匹配反斜杠'\'和美元'$'的方法
2017/02/08 PHP
wordpress网站转移到本地运行测试的方法
2017/03/15 PHP
PHP生成各种随机验证码的方法总结【附demo源码】
2017/06/05 PHP
jQuery(1.3.2) 7行代码搞定跟随屏幕滚动的层
2009/05/21 Javascript
Javascript 面向对象编程(coolshell)
2012/03/18 Javascript
JS Pro-深入面向对象的程序设计之继承的详解
2013/05/07 Javascript
客户端js判断文件类型和文件大小即限制上传大小
2013/11/20 Javascript
VS2008中使用JavaScript调用WebServices
2014/12/18 Javascript
详细介绍jQuery.outerWidth() 函数具体用法
2015/07/20 Javascript
jQuery基于json与cookie实现购物车的方法
2016/04/15 Javascript
AngularJs bootstrap详解及示例代码
2016/09/01 Javascript
jQuery插件FusionCharts绘制的2D帕累托图效果示例【附demo源码】
2017/03/28 jQuery
基于Swiper实现移动端页面图片轮播效果
2017/12/28 Javascript
react-navigation之动态修改title的内容
2018/09/26 Javascript
vue-model实现简易计算器
2020/08/17 Javascript
[39:19]完美世界DOTA2联赛PWL S2 SZ vs LBZS 第二场 11.26
2020/11/30 DOTA
Python set常用操作函数集锦
2017/11/15 Python
解决pip install xxx报错SyntaxError: invalid syntax的问题
2018/11/30 Python
利用python实现冒泡排序算法实例代码
2019/12/01 Python
python GUI编程(Tkinter) 创建子窗口及在窗口上用图片绘图实例
2020/03/04 Python
Python基于xlutils修改表格内容过程解析
2020/07/28 Python
python单例模式的应用场景实例讲解
2021/02/24 Python
Python3自带工具2to3.py 转换 Python2.x 代码到Python3的操作
2021/03/03 Python
使用Html5、CSS实现文字阴影效果
2018/01/17 HTML / CSS
公司营业员的工作总结自我评价
2013/10/05 职场文书
妇女儿童发展规划实施方案
2014/03/16 职场文书
公司股权转让协议书
2014/04/12 职场文书
骨干教师培训方案
2014/05/06 职场文书
2014年预备党员学习新党章思想汇报
2014/09/15 职场文书
营销总监岗位职责
2014/09/16 职场文书
婚宴邀请函
2015/01/30 职场文书
质量保证书怎么写
2015/02/27 职场文书
男方家长婚礼答谢词
2015/09/29 职场文书