写点什么

所有主流浏览器都支持新的 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:008890

评论 1 条评论

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

服务调用链相关基础知识

luojiahu

调用链

聊聊Spring的XML Schema扩展机制的使用方式

Hex

spring

消息队列系统架构设计

王硕

架构训练营

Spark为什么会流行

大数据技术指南

大数据 5月日更

网络攻防学习笔记 Day14

穿过生命散发芬芳

5月日更 网络攻防

5分钟速读之Rust权威指南(二)

wzx

rust

花一周整理!Python全系列学习资料,全是干货

Python研究者

全文检索的介绍

五分钟学大数据

大数据 5月日更

不是会员不让复制粘贴?看我“三板斧”!

liuzhen007

使用技巧 5月日更

APP透露的焦虑

wgc

杂谈

Python-XPath

若尘

Python编程 5月日更

就这?腾讯云高工熬夜手写'Java微服务学习笔记'也就让我月薪涨3k

Java 编程 程序员 架构 面试

声网2020实时大会后的弱网对抗实践

Fenngton

音视频 网络环境 视频编解码 声网 弱网下的极限实时视频通信

Android设备实时音视频传输有效方案

小驰笔记

android 音视频 引航计划

20个不良用户体验

老猿Python

程序员 用户体验 程序开发

Nginx通过split_client实现客户端分流

运维研习社

nginx 灰度发布 5月日更 分流

量化网格交易策略系统,马丁倍投策略软件源码

iOS 面试策略之系统框架-UIScrollView及其子类

iOSer

ios 面试 UIScrollView UICollectionView

通过实践带你揭开TCP中CLOSE_WAIT和TIME_WAIT的神秘面纱

linux大本营

c++ Linux TCP 网络协议 epoll

JavaScript 进阶——井字棋游戏智能AI搭建

空城机

JavaScript 大前端 5月日更 web游戏

数据续谈

顿晓

数据 5月日更

打破思维定式(十)

Changing Lin

用Python找出100以内的质数 - DAY6

Qien Z.

5月日更 ptyhon 找质数 质数

这个世界不会欺负诚实的人,也绝对不会亏待努力的人

小天同学

5月日更 真诚 诚信 努力

今日学习小结

Nydia

学习

Golang library source file 库源码文件

escray

学习 极客时间 Go 语言 5月日更

学生管理系统考试试卷存储方案

Simon

架构实战营

数据科学指南#基础篇 Bokeh入门

Lev

Python 学习 数据分析 数据科学

Netty整体架构学习笔记

风翱

Netty 5月日更

数据挖掘从入门到放弃(一):线性回归和逻辑回归

数据社

机器学习 5月日更

API网关关键技术

lenka

5月日更

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