ES2019 的新特性
JavaScript 不断演变,每次迭代都会得到一些新的内部更新。让我们来看看 ES2019 有哪些新的特性,并加入到我们日常开发中
Array.prototype.flat()
Array.prototype.flat()
递归地将嵌套数组拼合到指定深度。默认值为 1,如果要全深度则使用 Infinity。此方法不会修改原始数组,但会创建一个新数组:
const arr1 = [1, 2, [3, 4]];
arr1.flat();
// [1, 2, 3, 4] const arr2 = [1, 2, [3, 4, [5, 6]]];
arr2.flat(2);
// [1, 2, 3, 4, 5, 6] const arr3 = [1, 2, [3, 4, [5, 6, [7, 8]]]];
arr3.flat(Infinity);
// [1, 2, 3, 4, 5, 6, 7, 8]
flat()
方法会移除数组中的空项:
const arr4 = [1, 2, , 4, 5];
arr4.flat(); // [1, 2, 4, 5]
Array.prototype.flatMap()
flatMap()
方法首先使用映射函数映射每个元素,然后将结果压缩成一个新数组。它与 Array.prototype.map
和 深度值为 1的 Array.prototype.flat
几乎相同,但 flatMap
通常在合并成一种方法的效率稍微高一些。
const arr1 = [1, 2, 3]; arr1.map(x => [x * 4]);
// [[4], [8], [12]] arr1.flatMap(x => [x * 4]);
// [4, 8, 12]
更好的示例:
const sentence = ["This is a", "regular", "sentence"]; sentence.map(x => x.split(" "));
// [["This","is","a"],["regular"],["sentence"]] sentence.flatMap(x => x.split(" "));
// ["This","is","a","regular", "sentence"] // 可以使用 归纳(reduce) 与 合并(concat)实现相同的功能
sentence.reduce((acc, x) => acc.concat(x.split(" ")), []);
trimStart和trimEnd
String.prototype.trimStart() 和 String.prototype.trimEnd()
除了能从字符串两端删除空白字符的 String.prototype.trim()
之外,现在还有单独的方法,只能从每一端删除空格:
const test = " hello "; test.trim(); // "hello";
test.trimStart(); // "hello ";
test.trimEnd(); // " hello";
trimStart()
:别名trimLeft()
,移除原字符串左端的连续空白符并返回,并不会直接修改原字符串本身。trimEnd()
:别名trimRight()
,移除原字符串右端的连续空白符并返回,并不会直接修改原字符串本身。
Object.fromEntries
将键值对列表转换为 Object 的新方法。
它与已有 Object.entries() 正好相反,Object.entries()
方法在将对象转换为数组时使用,它返回一个给定对象自身可枚举属性的键值对数组。
但现在您可以通过 Object.fromEntries
将操作的数组返回到对象中。
下面是一个示例(将所有对象属性的值平方):
const obj = { prop1: , prop2: , prop3: }; // 转化为键值对数组:
let array = Object.entries(obj);
// [["prop1", 2], ["prop2", 10], ["prop3", 15]]
将所有对象属性的值平方:
array = array.map(([key, value]) => [key, Math.pow(value, )]);
// [["prop1", 4], ["prop2", 100], ["prop3", 225]]
我们将转换后的数组 array
作为参数传入 Object.fromEntries ,将数组转换成了一个对象:
const newObj = Object.fromEntries(array);
// {prop1: 4, prop2: 100, prop3: 225}
可选的 Catch 参数
新提案允许您完全省略 catch()
参数,因为在许多情况下,您并不想使用它:
try {
//...
} catch (er) {
//handle error with parameter er
} try {
//...
} catch {
//handle error without parameter
}
Symbol.description
description
是一个只读属性,它会返回 Symbol
对象的可选描述的字符串,用来代替 toString()
方法。
const testSymbol = Symbol("Desc"); testSymbol.description; // "Desc" testSymbol.toString(); // "Symbol(Desc)"
Function.toString()
现在,在函数上调用 toString()
会返回函数,与它的定义完全一样,包括空格和注释。
之前:
function /* foo comment */ foo() {} foo.toString(); // "function foo() {}"
现在:
foo.toString(); // "function /* foo comment */ foo() {}"
JSON.parse() 改进
行分隔符 (\u2028) 和段落分隔符 (\u2029),现在被正确解析,而不是报一个语法错误。
var str = '{"name":"Bottle\u2028AnGe"}'
JSON.parse(str)
// {name: "Bottle AnGe"}
原文链接:JavaScript: What’s new in ES2019
ES2019 的新特性的更多相关文章
- 【CuteJavaScript】ES2019 新特性汇总
最近 ECMAScript2019,最新提案完成:tc39 Finished Proposals,我这里也是按照官方介绍的顺序进行整理,如有疑问,可以查看官方介绍啦~ 另外之前也整理了 <ES6 ...
- ES2019新特性的学习
前言 前端技术更新的实在是太快了,各种框架百花齐放,随着NodeJs不断的兴起,各种构建工具也是层出不穷,这不,前两周尤雨溪开源了Vue.js3.0源码之后,很多大佬早已把源码剖析皮都不剩了:昨天No ...
- 【ES】338- ECMAScirpt 2019 新特性汇总
点击上方"前端自习课"关注,学习起来~ 最近在做的一个活动,大家都可以参与: 送 1600 元超大现金红包啦,走过路过不要错过哦 ~ 最近 ECMAScript2019,最新提案完 ...
- ES10(2019)有哪些更新和新特性?
ES10新特性(2019) 行分隔符(U + 2028)和段分隔符(U + 2029)符号现在允许在字符串文字中,与JSON匹配 更加友好的 JSON.stringify 新增了Array的flat( ...
- 从 ES6 到 ES10 的新特性万字大总结
以下文章来源于鱼头的Web海洋 ,作者陈大鱼头 鱼头的Web海洋 一个名为Web的海洋世界 (给前端大全加星标,提升前端技能) 作者:鱼头的Web海洋 公号 / 陈大鱼头 (本文来自作者投稿) 介 ...
- 从ES6到ES10的新特性万字大总结
介绍ECMAScript是一种由Ecma国际(前身为欧洲计算机制造商协会)在标准ECMA-262中定义的脚本语言规范.这种语言在万维网上应用广泛,它往往被称为JavaScript或JScript,但实 ...
- 个人认为目前比较好用的ECMAScript(16-20)新特性
ECMAScript(16.17.18.19)新特性 Array.prototype.includes includes 是数组上的简单实例方法,可以轻松查找到数组中是否包含指定内容(包括NaN) 返 ...
- ES6、ES7、ES8、ES9、ES10新特性
ES6新特性(2015) ES6的特性比较多,在 ES5 发布近 6 年(2009-11 至 2015-6)之后才将其标准化.两个发布版本之间时间跨度很大,所以ES6中的特性比较多. 在这里列举几个常 ...
- SQL Server 2014 新特性——内存数据库
SQL Server 2014 新特性——内存数据库 目录 SQL Server 2014 新特性——内存数据库 简介: 设计目的和原因: 专业名词 In-Memory OLTP不同之处 内存优化表 ...
随机推荐
- css3中calc、vw、vh、vmin、vmax 属性的应用及兼容性详解
一. calc()的使用什么是calc()? calc()从字面我们可以把他理解为一个函数function.其实calc是英文单词calculate(计算)的缩写,是css3的一个新增的功能,用来指定 ...
- C语言中,关于排序的问题(输入n个数,输出最大的那个)
int n,max=0,t; scanf("%d",&n); int a[n],i,k; //这个a[n]必须要在输入n的值之后才能定义,不然定义不成. for(i=1; ...
- shell基础概念, if+命令, shell中引用python, shell脚本的几种执行方式
说明: 虚拟机中shell_test目录用来练习shell, 其中有个test.log文件用来存放日志 #!/usr/bin/bash # shell文件开头, 用来指定该文件使用哪个解释器 ...
- 【Oracle命令】sql语句之排序(order by)
通过对数据库数据进行降序排序来达到显示最新数据在前面的效果 -- 降序排序(最新的显示在前面) SELECT * FROM 表名 t ORDER BY t.uploadDatetime DESC; 格 ...
- 解决centos下tomcat启动太慢 & JDBC连接oracle太慢的问题
近期遇到一个非常奇怪的问题,也不知道改了什么,tomcat启动非常慢,以前几秒就启动好了,现在要30秒左右. 而且,通过jdbc连接oracle数据库也非常慢,以前建立一个连接只要几十毫秒,现在也要1 ...
- Python将list中的unicode转换成中文显示
有这样一个列表: list = [{'channel_id': -3, 'name': u'\u7ea2\u5fc3\u5146\u8d6b'}, {u'seq_id': 0, u'name_en': ...
- javascript刷新当前页面的几种方式
这里总结一下JavaScript刷新当前页面的几种方式. 1.history对象. history.go(0); 2.location对象. location.reload(); location = ...
- Django多进程滚动日志的问题
使用RotatingFileHandler控制日志文件的大小 # settings.py LOGGING = { ... 'handlers': { ... 'file': { 'level': 'I ...
- python基础(19):random模块、time模块、sys模块、os模块
1. random模块 导入的是random模块,格式是: import random 1.1 随机小数 取随机小数 : 数学计算. print(random.random()) # 取0-1之间的小 ...
- Java生鲜电商平台-订单中心服务架构与异常订单逻辑
Java生鲜电商平台-订单中心服务架构与异常订单逻辑 订单架构实战中阐述了订单系统的重要性,并从订单系统的信息架构和流程上对订单系统有了总体认知,同时还穿插着一些常见的订单业务规则和逻辑.上文写到订单 ...