欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

JavaScript ES2019中的8个新特性详解

程序员文章站 2022-06-05 22:45:10
前言 javascript 不断改进和添加更多功能。tc39 已经完成并批准了 es2019 的这 8 个功能,它有 4 个阶段,这些阶段是: stage...

前言

javascript 不断改进和添加更多功能。tc39 已经完成并批准了 es2019 的这 8 个功能,它有 4 个阶段,这些阶段是:

  • stage 0: strawman
  • stage 1: proposals
  • stage 2: drafts
  • stage 3: candidates
  • stage 4: finished/approved

以下链接可以查看stage 0stage 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 中的一些有用的即将推出的功能。

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