JavaScript ES2019中的8个新特性详解
前言
JavaScript 不断改进和添加更多功能。TC39 已经完成并批准了 ES2019 的这 8 个功能,它有 4 个阶段,这些阶段是:
- Stage 0: Strawman
- Stage 1: Proposals
- Stage 2: Drafts
- Stage 3: Candidates
- Stage 4: Finished/Approved
以下链接可以查看Stage 0,Stage 1 – 3 和Final Stage
可选的 Catch 绑定
能够在不使用 catch 绑定的地方选择性地删除它
try { // trying to use a new ES2019 feature // which may not be implemented in other browsers } catch (unused) { // revert back to old way }
现在可以删除未使用的绑定
try { ... } catch { ... }
JSON 超集
此提议的动机是 JSON 字符串可以包含未转义的 U + 2028 LINE SEPARATOR 和 U + 2029 PARAGRAPH SEPARATOR 字符,而 ECMAScript 字符串则不能。在 ES2019 之前,它会产生错误SyntaxError: Invalid or unexpected token
const LS = eval('"\u2028"'); const PS = eval("'\u2029'");
符号说明
在 ES2015 中引入符号,具有非常独特的功能。在 ES2019 中,它现在可以提供给定的描述。其目的是避免间接获得所提供的描述Symbol.prototype.toString
const mySymbol = Symbol("myDescription"); console.log(mySymbol); // Symbol(myDescription) console.log(mySymbol.toString()); // Symbol(myDescription) console.log(mySymbol.description); // myDescription
Function.prototype.toString - 修订版
我们之前已经在函数原型中使用了toString方法,但是在 ES2019 中它已被修改并包含函数内的注释,请注意它在Arrow Functions上不起作用。
function /* comment */ foo /* another comment */() {} // Before console.log(foo.toString()); // function foo(){} // Now ES2019 console.log(foo.toString()); // function /* comment */ foo /* another comment */ (){} // Arrow Syntax const bar /* comment */ = /* another comment */ () => {}; console.log(bar.toString()); // () => {}
Object.fromEntries
它是 Object.entries 的反向方法,它也是克隆对象的方法之一
const obj = { prop1: 1, prop2: 2 }; const entries = Object.entries(obj); console.log(entries); // [ [ 'prop1', 1 ], [ 'prop2', 2 ] ] const fromEntries = Object.fromEntries(entries); console.log(fromEntries); // Object { prop1: 1, prop2: 2 } console.log(obj === fromEntries); // false
注意:任何嵌入式对象/数组都只是通过引用复制。
格式良好的 JSON.stringify
这也是由同一个人提出的,并且与 JSON 超集特征有关 。ES2019 不是将未配对的代理代码点作为单个 UTF-16 代码单元返回,而是用 JSON 转义序列表示它们
// Before console.log(JSON.stringify("\uD800")); // "�" // Now ES2019 console.log(JSON.stringify("\uD800")); // "\ud800"
String.prototype trimStart 和 trimEnd
我们已经在 String 原型中使用了trim方法,它删除了字符串开头和结尾之间的空格。但是现在开始介绍 ES2019 的 trimStart和trimEnd
// Trim const name = " Codedam "; console.log(name.trim()); // "Codedam" // Trim Start const description = " Unlocks Secret Codes "; console.log(description.trimStart()); // "Unlocks Secret Codes " // Trim End const category = " JavaScript "; console.log(category.trimEnd()); // " JavaScript"
Array.prototype flat 和 flatMap
flat方法创建一个新数组,所有子数组元素以递归方式连接到指定的深度。 默认情况下,深度为 1,使数组上第一层嵌套数组变平。
const arr = [1, 2, [3, 4, [5, 6]]]; arr.flat(); // [1, 2, 3, 4, [5, 6]] arr.flat(2); // [1, 2, 3, 4, 5, 6] // You can use Infinity to flatten all the nested arrays no matter how deep the array is const arrExtreme = [1, [2, [3, [4, [5, 6, 7, [8, 9]]]]]]; arrExtreme.flat(Infinity); // [1, 2, 3, 4, 5, 6, 7, 8, 9]
flatMap 类似于 flat 并且与 map 相关,其中它映射数组然后将其展平
const arr = ["Codedam", "is Awsome", "!"]; const mapResult = arr.map(item => item.split(" ")); console.log(mapResult); // [ [ 'Codedam' ], [ 'is', 'Awsome' ], [ '!' ] ] const flatMapResult = arr.flatMap(chunk => chunk.split(" ")); console.log(flatMapResult); // ['Codedam', 'is', 'Awsome', '!'];
其他
强调一下现在 Stage 3 中的一些有用的即将推出的功能。
- globalThis
- BigInt
- import()
- Legacy RegEx
- Private instance methods and accessors
- String.prototype.matchAll
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
相关文章
比较详细的关于javascript中void(0)的具体含义解释
比较详细的关于javascript中void(0)的具体含义解释...2007-08-08JavaScript(JS) 压缩 / 混淆 / 格式化 批处理工具
本工具所有的功能实现都是由 ttp://jscompress.sinaapp.com/api 处理.(包括现在可以使用的这个在线压缩)2010-12-12webpack file-loader和url-loader的区别
这篇文章主要介绍了webpack file-loader和url-loader的区别,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧2019-01-01
最新评论