写点什么

所有主流浏览器都支持新的 JavaScript 集合方法

作者:Agazi Mekonnen

  • 2024-08-29
    北京
  • 本文字数:1809 字

    阅读完需:约 6 分钟

大小:454.40K时长:02:35
所有主流浏览器都支持新的JavaScript集合方法

随着 Firefox 127 的发布,现在所有主流浏览器引擎都全面支持新的JavaScript集合方法,包括 intersection()、union()、difference()、symmetricDifference()、isSubsetOf()、isSupersetOf()和 isDisjointFrom()。这意味着开发者们不再需要依赖 polyfill 来确保这些方法在不同环境中的兼容性。这些新加入的特性提供了一套便捷的内置工具来操作和比较集合,不仅简化了开发,还提升了程序的性能。


JavaScript 中的 Set 与 Array 类似,但它可以确保集合中的每个元素都是唯一的。这种自动除重的特性使得 Set 成为创建唯一元素集合的理想选择。下面是一个简单的例子,展示了如何创建一个 Set 并向其添加元素:


const users = new Set();
const alice = { id: 1, name: "Alice" };
users.add(alice);
users.forEach(user => { console.log(user) });
复制代码


在检查元素是否存在时, Set 通常比 Array 更加高效,这一特性使得它对于性能要求较高的应用程序来说非常有价值。


union()方法返回一个新 Set,包含原始 Set 和给定 Set 中的元素。这个方法在合并集合时极为有用,同时确保结果集中不包含重复项:


const set1 = new Set(["Alice", "Bob", "Charlie"]);
const set2 = new Set(["Bob", "Charlie", "David"]);
const unionSet = set1.union(set2);
unionSet.forEach(name => {
  console.log(name); // 输出: Alice, Bob, Charlie, David
});
复制代码


intersection()方法返回一个新 Set,只包含两个 Set 共有的元素。这个方法在识别两个集合共同元素时非常有用:


const intersectionSet = set1.intersection(set2);
intersectionSet.forEach(name => {
  console.log(name); // 输出: Bob, Charlie
});
复制代码


symmetricDifference()方法返回一个新 Set,包含只在其中一个 Set 中出现的元素,不包含两个 Set 共有的元素。这个方法在识别两个集合各自的不同元素时非常有用:


const symmetricDifferenceSet = set1.symmetricDifference(set2);
symmetricDifferenceSet.forEach(name => {
  console.log(name); // 输出: Alice, David
});
复制代码


difference()方法返回一个新 Set,包含了原始 Set 中有而给定 Set 中没有的元素。这在需要从集合中排除某些元素时非常有用:


const set1Only = set1.difference(set2);
set1Only.forEach(name => {
  console.log(name); // 输出: Alice
});
复制代码


isSubsetOf()和 isSupersetOf()方法根据两个 Set 之间的包含关系返回一个布尔值。isSubsetOf()方法检查一个 Set 的所有元素是否都包含在另一个 Set 中,而 isSupersetOf()方法检查一个 Set 是否包含了另一个 Set 的所有元素。

const subset = new Set(["Alice", "Bob"]);
const superset = new Set(["Alice", "Bob", "Charlie"]);
if (subset.isSubsetOf(superset)) {
  console.log("subset is a subset of superset"); // 这将被打印出来,因为subset的所有元素也都在superset中。
} else {
  console.log("subset is not a subset of superset");
}
if (superset.isSupersetOf(subset)) {
  console.log("superset is a superset of subset"); // 这将被打印出来,因为subset中的所有元素也都在superset中。
} else {
  console.log("superset is not a superset of subset");
}
复制代码


isDisjointFrom()方法检查两个 Set 是否有共同元素:

const set3 = new Set(["Eve", "Frank", "Gina"]);
if (set1.isDisjointFrom(set2)) { console.log("Set1 and Set2 are disjoint"); // 这将被打印出来,因为集合set1和集合set2没有共同元素} else { console.log("Set1 and Set2 are not disjoint");}
if (set1.isDisjointFrom(set3)) { console.log("Set1 and Set3 are disjoint");} else { console.log("Set1 and Set3 are not disjoint"); // 这将被打印出来,因为集合set1和集合set3有一个共同的元素“Charlie”
复制代码

社区对这些新方法反响热烈。在Reddit的一个讨论帖中,用户 peterlinddk 表示:


“太好了,我们终于可以用 Set 做更多的事情,不仅仅是‘重复项检测器’。我还希望有一种方法,允许对象在不必是完全相同的实例的情况下也能被认为是‘相等’的,有点像 Java 的.equals 和.hashCode 方法。”


另一位用户 Pelopida92 对这些新方法在性能上带来的提升表示赞赏,并表示:


“Set 太棒了。我在一些处理大数据量的脚本中广泛使用了这些 Set 方法,因为它们不仅在性能上优于数组,使用起来也非常简便和直观。”


原文链接

https://www.infoq.com/news/2024/07/javascript-set-methods/

2024-08-29 08:009015

评论 1 条评论

发布
用户头像
Chrome 是支持 ECMAScript 6 (ES6) 及更高版本的 JavaScript 标准的主要浏览器之一。这意味着开发者可以使用最新的 JavaScript 功能,如箭头函数、模块化、Promise、async/await 等,来编写更简洁、更现代的代码。
2024-09-02 15:22 · 福建
回复
没有更多了
发现更多内容

PingCAP x 亚马逊云科技,为 TiDB 云端体验“加冕”

PingCAP

Soul运维总监尤首智:企业如何从0到1建设云上运维体系

阿里云弹性计算

阿里云 云上架构 运维峰会

性能分析之Linux系统平均负载案例分析

zuozewei

Linux 性能分析 12月日更

完蛋,我的事务怎么不生效?

秦怀杂货店

MySQL 数据库 事务 事务失效

OPPO小布助手算法系统探索、实践与思考

安第斯智能云

算法

最强最全面的大数据SQL系列

五分钟学大数据

sql 大数据 hive

版本不兼容Jar包冲突该如何是好?

vivo互联网技术

jar Java 开发

kafka丢失和重复消费数据

编程江湖

大数据 kafka

共筑AI开源繁荣生态 | 新一代人工智能院士高峰论坛深度学习框架分论坛成功举办

OpenI启智社区

滴滴数据通道服务演进之路

Kafka中文社区

给弟弟的信第26封|做一个懂得感恩的人

大菠萝

28天写作

10个Node.js 开发人员必须使用的IDE

编程江湖

node.js

网络安全好学吗?网络安全入门篇,安装渗透测试系统kali全套教学

学神来啦

运维 网络安全 渗透测试· kali基础 kali Linux

【转】java开发之spring面试题

@零度

JAVA开发 spring框架

教你Python字符串的基本操作:拆分和连接

华为云开发者联盟

Python 连接 字符串 拆分 拆分字符串

基于流程管理,提高工作质量和效率

流程管理

SpringBoot应用和PostgreSQL数据库部署到Kubernetes上的一个例子

汪子熙

Kubernetes k8s 28天写作 docker build 12月日更

智算未来 | 2021新一代人工智能院士高峰论坛智算网络分论坛成功举办

OpenI启智社区

Golang协程之了解管道的缓存能力

恒生LIGHT云社区

Go golang

初探语音识别ASR算法

华为云开发者联盟

算法 语音识别 ASR 语音转写文章 声学模型

一文带你了解数据库连接池的必要性

编程江湖

数据库 JAVA开发

饿了么资深架构师分享云上基础架构演进

阿里云弹性计算

云上架构 运维峰会

大数据开发Hive之如何进行数据抽样

@零度

大数据 hive

技术揭秘!百度搜索中台低代码的探索与实践

百度Geek说

中台 后端 低代码 搜索

PassJava 开源 (九) :Spring Cloud 整合 Gateway 网关

悟空聊架构

SpringCloud Gateway passjava 悟空聊架构

Jira Software 年度总结:12个重要功能大放送!

Atlassian

DevOps 敏捷 Atlassian Jira ITSM

云原生时代,需要什么样的数据库?

博文视点Broadview

Arctic:网易数帆开放式流批一体表服务 | BDTC 精彩回顾

网易数帆

大数据 数据湖 iceberg 流批一体 Arctic

面试被问一致性hash?看这一篇就够了

公众号:程序猿成神之路

迭代你好,我是冲刺

华为云开发者联盟

Scrum 开发 迭代 冲刺 迭代增量开发

所有主流浏览器都支持新的JavaScript集合方法_大前端_InfoQ精选文章