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 相关文章推荐
类似框架的js代码
Nov 09 Javascript
javascript操作html控件实例(javascript添加html)
Dec 02 Javascript
Enter回车切换输入焦点实现思路与代码兼容各大浏览器
Sep 01 Javascript
javascript实现倒计时(精确到秒)
Jun 26 Javascript
解决jQuery uploadify在非IE核心浏览器下无法上传
Aug 05 Javascript
textarea 在浏览器中固定大小和禁止拖动的实现方法
Dec 03 Javascript
javascript输出AscII码扩展集中的字符方法
Dec 26 Javascript
jquery仿ps颜色拾取功能
Mar 08 Javascript
分享一个精简的vue.js 图片lazyload插件实例
Mar 13 Javascript
JS实现音乐钢琴特效
Jan 06 Javascript
解决Vue的文本编辑器 vue-quill-editor 小图标样式排布错乱问题
Aug 03 Javascript
JavaScript常用8种数组去重代码实例
Sep 09 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
常用星际术语索引(新手指南)
2020/03/04 星际争霸
PHP+FastCGI+Nginx配置PHP运行环境
2014/08/07 PHP
Smarty中调用FCKeditor的方法
2014/10/27 PHP
php识别翻转iphone拍摄的颠倒图片
2018/05/17 PHP
php生成随机数/生成随机字符串的方法小结【5种方法】
2020/05/27 PHP
Jquery 最近浏览过的商品的功能实现代码
2010/05/14 Javascript
html+js实现动态显示本地时间
2013/09/21 Javascript
jQuery中triggerHandler()方法用法实例
2015/01/19 Javascript
ajax+jQuery实现级联显示地址的方法
2015/05/06 Javascript
Javascript闭包与函数柯里化浅析
2016/06/22 Javascript
js制作可以延时消失的菜单
2017/01/13 Javascript
js仿小米手机上下滑动效果
2017/02/05 Javascript
AngularJS实用基础知识_入门必备篇(推荐)
2017/07/10 Javascript
解决微信二次分享不显示摘要和图片的问题
2017/08/18 Javascript
详解Vue项目中出现Loading chunk {n} failed问题的解决方法
2018/09/14 Javascript
微信小程序动态设置图片大小的方法
2019/11/21 Javascript
vue实现简单跑马灯效果
2020/05/25 Javascript
Bootstrap告警框(alert)实现弹出效果和短暂显示后上浮消失的示例代码
2020/08/27 Javascript
[02:54]DOTA2英雄基础教程 撼地者
2014/01/14 DOTA
使用Python3编写抓取网页和只抓网页图片的脚本
2015/08/20 Python
python使用opencv读取图片的实例
2017/08/17 Python
浅谈Python2获取中文文件名的编码问题
2018/01/09 Python
Python将一个CSV文件里的数据追加到另一个CSV文件的方法
2018/07/04 Python
Python爬取qq空间说说的实例代码
2018/08/17 Python
python使用magic模块进行文件类型识别方法
2018/12/08 Python
python之信息加密题目详解
2019/06/26 Python
利用python为PostgreSQL的表自动添加分区
2021/01/18 Python
利用HTML5+CSS3实现3D转换效果实例详解
2017/05/02 HTML / CSS
全球最受追捧的运动服品牌领先数字目的地:Stylerunner
2020/11/25 全球购物
2014领导班子四风问题查摆思想汇报
2014/09/13 职场文书
2014年村计划生育工作总结
2014/11/14 职场文书
继承公证书格式
2015/01/26 职场文书
公司年夜饭通知
2015/04/25 职场文书
2015年电气技术员工作总结
2015/07/24 职场文书
Python基础之进程详解
2021/05/21 Python
python获取带有返回值的多线程
2022/05/02 Python