ECMAScript 12 (ES12, ES2021) 新特性

server/2024/9/24 0:25:34/

还是大剑师兰特:曾是美国某知名大学计算机专业研究生,现为航空航海领域高级前端工程师;CSDN知名博主,GIS领域优质创作者,深耕openlayers、leaflet、mapbox、cesium,canvas,webgl,echarts等技术开发,欢迎加底部微信(gis-dajianshi),一起交流。

No.内容链接
1Openlayers 【入门教程】 - 【源代码+示例300+】
2Leaflet 【入门教程】 - 【源代码+图文示例 150+】
3Cesium 【入门教程】 - 【源代码+图文示例200+】
4MapboxGL【入门教程】 - 【源代码+图文示例150+】
5前端就业宝典 【面试题+详细答案 1000+】

在这里插入图片描述

文章目录

      • 新特性概述
        • 1. Promise.any()
        • 2. String.prototype.replaceAll()
        • 3. WeakRefs
        • 4. Logical Assignment Operators
        • 5. New Methods in RegExp
        • 6. Numeric Separators


ECMAScript 12(通常称为ES2021或ES12)是JavaScript语言的一个版本,它在2021年由ECMA国际标准化组织发布。虽然这个版本引入的变化相对较小,但它仍然包含了一些有用的新特性。

新特性概述

1. Promise.any()

Promise.any() 是一个新方法,用于处理多个Promise。如果其中任何一个Promise解析成功,则返回第一个成功的Promise的结果;如果所有的Promise都被拒绝,则返回一个聚合错误。

示例:

const promise1 = Promise.reject(new Error('Fail'));
const promise2 = new Promise((resolve) => setTimeout(resolve, 500, 'Success'));
const promise3 = Promise.reject(new Error('Fail'));Promise.any([promise1, promise2, promise3]).then((value) => console.log(value)) // Logs "Success".catch((error) => console.error(error));
2. String.prototype.replaceAll()

replaceAll() 方法返回一个新的字符串,其中所有匹配给定模式的子串都被替换为指定的替换文本。

示例:

const str = 'hello world';
console.log(str.replaceAll('l', 'L')); // Logs "heLLo worLd"
3. WeakRefs

WeakRef 允许你持有对象的一个弱引用,这意味着当对象不再被任何强引用所引用时,垃圾回收器可以自由地回收该对象。

示例:

class Resource {constructor(data) {this.data = data;}
}const resource = new Resource('some data');
const weakRef = new WeakRef(resource);
console.log(weakRef.deref()); // Logs the Resource object// Clearing the strong reference.
resource = null;
// After garbage collection, the weakRef should be null.
setTimeout(() => {console.log(weakRef.deref()); // Logs "undefined" if garbage collected
}, 0);
4. Logical Assignment Operators

逻辑赋值运算符允许你使用逻辑AND (&&=) 和 OR (||=) 运算符进行赋值。

示例:

let a = false;
let b = true;a ||= 1; // a remains false
b ||= 2; // b remains true
a &&= 3; // a remains false
b &&= 4; // b becomes 4console.log(a); // Logs "false"
console.log(b); // Logs "4"
5. New Methods in RegExp

在正则表达式中添加了新的方法,如 lastIndex 的 setter。

示例:

const re = /./g;
re.lastIndex = 10; // Set lastIndex to 10
console.log(re.lastIndex); // Logs "10"
6. Numeric Separators

数字分隔符 _ 可以用来更清晰地表示大数。

示例:

const largeNumber = 1_000_000;
console.log(largeNumber); // Logs "1000000"

http://www.ppmy.cn/server/95633.html

相关文章

<数据集>BDD100K人车识别数据集<目标检测>

数据集格式:VOCYOLO格式 图片数量:15807张 标注数量(xml文件个数):15807 标注数量(txt文件个数):15807 标注类别数:7 标注类别名称: [pedestrian, car, bus, rider, motorcycle, truck, bicycle] 序号…

C# 设计模式之抽象工厂模式

总目录 前言 工厂方法模式是为了克服简单工厂模式的缺点而设计出来的,简单工厂模式的工厂类随着产品类的增加需要增加额外的代码,而工厂方法模式每个具体工厂类只完成单个实例的创建,所以它具有很好的可扩展性。但是在现实生活中&#xff0c…

前端表格控件:打造自动化报表的高效工具

摘要 在现代Web应用中,自动化报表的生成对于数据分析和业务决策至关重要。前端表格控件提供了一种直观且强大的方式,使得报表的创建、展示和交互变得更加容易。本文将探讨如何利用前端表格控件实现自动化报表的设计、生成和优化。 引言 自动化报表可以…

探索Prefect:Python自动化的终极武器

文章目录 探索Prefect:Python自动化的终极武器背景:自动化的呼唤Prefect:自动化的瑞士军刀安装Prefect:一键启动基础用法:Prefect的五招场景应用:Prefect的实战演练常见问题:Prefect的故障排除总…

[RoarCTF 2019]Easy Calc1

打开题目 查看源码,看到 看到源代码有 calc.php,构造url打开 看到php审计代码, 由于页面中无法上传num,则输入 num,在num前加入一个空格可以让num变得可以上传,而且在进行代码解析时,php会把前…

详解工厂模式与抽象工厂模式有什么区别?【图解+代码】

目录 工厂模式,抽象工厂模式是什么? 两种设计模式的流程: 1、工厂模式 2、抽象工厂模式 两种模式的对比 共同点: 不同点: 总结 工厂模式,抽象工厂模式是什么? 我已经具体的写了这两种模…

卡码网--数组篇(移除元素)

系列文章目录 文章目录 系列文章目录前言27. 移除元素总结 前言 代码随想录:详情链接 27. 移除元素 力扣27 https://leetcode.cn/problems/remove-element/description/ Step1: 读题: 原地移除所有数值等于 val 的元素,并返回移除后数组的新长度。不要使用额外的…

AWD神器—watchbird后台rce挖掘

简介 在传统的AWD攻防中,Waf扮演着重要的角色,Watchbird作为一款专门为AWD而生的PHP防火墙,具有部署简单,功能强大等特点,一出世便受到了广大CTFer的喜爱,目前在GitHub上已有600多star。本篇则详细介绍如果…