JavaScript 中 Array 、 Set 、 WeakSet 区别

JavaScript 中 Set 和 Array 的核心区别在于唯一性、顺序性和方法设计。Set 是唯一值集合,Array 是有序列表。

一、Set 与 Array 核心区别

二、关键差异示例

1. 唯一性处理

javascript 复制代码
const arr = [1, 2, 2, 3];
const set = new Set([1, 2, 2, 3]);

console.log(arr); // [1, 2, 2, 3]
console.log([...set]); // [1, 2, 3]

2. 存在性检查性能

javascript 复制代码
// Set 的 has() 是 { O(1): 常数时间,无论数据有多少,操作时间基本固定 },
set.has(2); // true,速度快

//  Array.includes() 是{O(n)  线性时间 } 就像一本本翻书,元素越多越慢
arr.includes(2); // true,数组大时较慢,最坏情况:100个元素,要检查到第100个,还能发现。

3. 转换技巧

javascript 复制代码
// 数组去重
const unique = [...new Set(array)];

// Set 转数组
const arrayFromSet = Array.from(set);

WeakSet 与 Set 核心区别

Set 可以存储任何类型,WeakSet只能存储对象。WeakSet是弱引用,不影响垃圾回收。

1、存储限制

javascript 复制代码
// Set 可以存储任何类型
const set = new Set();
set.add(1);           // ✅ 数字
set.add("hello");    // ✅ 字符串
set.add({});         // ✅ 对象
set.add(Symbol());   // ✅ Symbol
set.add(null);       // ✅ null
set.add(undefined);  // ✅ undefined
set.add([1, 2, 3]);  // ✅ 数组
set.add(function(){});// ✅ 函数

// WeakSet 只能存储对象
const weakSet = new WeakSet();
weakSet.add({});         // ✅ 对象
weakSet.add([]);         // ✅ 数组(也是对象)
weakSet.add(new Date()); // ✅ Date 对象
weakSet.add(function(){});// ✅ 函数(也是对象)

weakSet.add(1);          // ❌ TypeError: Invalid value used in weak set
weakSet.add("hello");    // ❌ TypeError: Invalid value used in weak set
weakSet.add(Symbol());   // ❌ TypeError: Invalid value used in weak set
weakSet.add(null);       // ❌ TypeError: Invalid value used in weak set
相关推荐
Chester_19995 小时前
CSP202203C.计算资源调度器
开发语言·数据结构·c++·蓝桥杯
海兰6 小时前
【应用】基于 Next.js 16 + Python mplfinance的金融K线图与技术指标可视化平台(三)
javascript·python·金融
EXI-小洲6 小时前
Java 操作 Word:字符串替换、图片插入、动态生成表格与API接口下载
java·开发语言·spring boot·word
会周易的程序员7 小时前
给 PLC 写一个字节码虚拟机:STVM 虚拟机架构设计
开发语言·c++·虚拟机·软plc·iec61131·stvm
机器视觉知识推荐、就业指导7 小时前
为什么老说“纯 Qt 没啥就业市场”?
开发语言·qt
telepan7 小时前
Qt 开发避坑与性能指南:如何优雅、安全地定义全局常量字符串?
开发语言·qt
m0_695251497 小时前
Qt MaintenanceTool 使用国内镜像加速下载(超详细教程)
开发语言·qt
小磊哥er7 小时前
深入解构Claude Code - 第 7 篇 · 连接外面的世界
javascript·ai编程
小磊哥er8 小时前
深入解构Claude Code - 第 6 篇 · 终端里的图形界面
javascript·ai编程
海兰8 小时前
【应用】基于 Next.js 16 + Python mplfinance的金融K线图与技术指标可视化平台(一)
javascript·python·金融