ES2015+

作者: 林智_lz | 来源:发表于2024-03-18 10:17 被阅读0次

顶层 await

在 ES Module 中,现在可以直接在顶层使用 await 关键字,而不需要再使用包装函数来调用异步函数。

// 如果文件是ES模块(在package.json中设置,具有exports,命名为".mts"),我们可以直接在顶层使用await。

console.log(await asyncFuncSuccess()); // "test"

try {

  await asyncFuncFail();

} catch (e) {

  console.error(e); // Error: "Test"

}

// 这是因为所有的async调用都被等待,所以在Promise结果之后记录的。

console.log('Hello'); // "Hello"

String.replaceAll()

const testString = 'hello/ConardLi everyone/everybody';

// 先前,仅替换第一个实例:

console.log(testString.replace('/', '|')); // 'hello|ConardLi everyone/everybody'

// 需要使用正则表达式,这会降低性能并需要进行转义。

// 不使用全局标志(/g)。

console.log(testString.replace(/\//g, '|')); // 'hello|ConardLi everyone|everybody'

// 使用replaceAll可以更清晰和更快。

console.log(testString.replaceAll('/', '|')); // 'hello|ConardLi everyone|everybody'

Promise.any

Promise.any 方法接收一个 Promise 数组作为参数,当其中只需要一个 Promise 的结果时,它将返回第一个 Promise 的结果。如果所有的 Promise 都被拒绝了,它将返回一个 AggregateError,这个错误包含了所有被拒绝的 Promise 的错误信息。不同于 Promise.race 方法,它在任何一个 Promise 被拒绝时就会立即拒绝,我们可以用它处理多个异步操作中只需要其中一个结果的情况。

Promise.allSettled()

Promise.all() 和 Promise.allSettled() 都用于同时处理多个 Promise,区别在于如果 Promise.all() 中存在一个 Promise reject/throw,就会立即返回 reject/throw;而 Promise.allSettled() 则会等待所有 Promise 执行完成,然后返回所有 Promise 的执行结果

赋值操作符 (??=)

操作符只在变量的值为 null 或 undefined 时才会执行赋值操作。

BigInt

BigInt 是 JavaScript 中的一种新数据类型,用于处理大型整数,这些整数可能超过 JavaScript 最大的可表示数字范围(-2^53 ~ 2^53),从而导致存储和操作数据时出现精度误差。BigInt 数据类型可以使用 BigInt()

globalThis

globalThis 是一个全局对象,可以用于获取全局上下文中的变量,不管在哪个执行环境下,例如在浏览器中或在 Node.js 服务器环境中。在浏览器中,globalThis 相当于在顶层作用域中使用 this 关键字。

Array.Includes

判断一个数组中是否包含一个指定的元素,对于NaN、undefined的查找,includes要好于indexOf:

arr.includes(valueToFind, fromIndex)

Object.values

之前我们可以通过 Object.keys 获取一个对象所有的key,在ES8中提供了 Object.values 来获取所有的value值:

const obj = {

  name: "why",

  age: 18,

  height: 1.88

}

console.log(Object.values(obj)) // [ 'why', 18, 1.88 ]

相关文章

  • babel基本使用示例

    一、转换ES2015+ 安装 babel.config.json 执行 二、转换React 安装 babel.co...

  • Ant design Pro 简纪

    一、Ant Design Pro 环境准备 写在前面的话 技术栈基于 ES2015+、React、UmiJS、dv...

  • JavaScript ES6 核心功能一览

    JavaScript ES6 核心功能一览(ES6 亦作 ECMAScript 6 或 ES2015+) Java...

  • antd pro 使用小结

    前序准备 你的本地环境需要安装 node 和 git。技术栈基于 ES2015+、React、dva、g2 和 a...

  • Vue-Element前端框架搭建注意事项

    1.前期准备 需要在本地安装 node 和 git。本项目技术栈基于 ES2015+、vue、vuex、vue-r...

  • vue 3-新特性预览

    一、兼容性 目前打包后的代码是 ES2015+,不支持 IE 11。 二、对 TypeScript 的使用 目前的...

  • 一文说尽 Babel 的前世今生

    作者: 多巴胺 一、Babel 是什么 Babel 是一个可以将 使用ES2015+语法的代码 编译成 向后兼容 ...

  • 理解 vue-cli 现代模式

    背景 有了 Babel 我们可以兼顾所有最新的 ES2015+ 语言特性,但也意味着我们需要交付转译和 polyf...

  • 必须记住的前端知识点(二)

    1、babelBabel是一个编译器,能将ES2015+的代码转换正ES2015。babel的核心概念就是利用一系...

  • Babel 编辑器

    我们在学习 Babel 的使用可以选择一个编辑器。现在很多流行的编辑器都支持 ES2015+ 语法高亮显示,并且此...

网友评论

      本文标题:ES2015+

      本文链接:https://www.haomeiwen.com/subject/auxrddtx.html