set可自动去重,适用于用户输入过滤:初始化new set(),add添加值自动忽略重复,[...set]转数组;批量粘贴用split+trim+filter预处理再建set;对象需按字段(如id)手动去重;has/delete/clear提升交互体验。

用 Set 过滤重复用户输入数据,核心是利用 Set 自动去重的特性——它只保留唯一值,且能高效判断是否存在。只要把输入内容(如字符串、数字)放进 Set,再转回数组或直接遍历,就能拿到无重复的数据。
收集输入并实时去重
适合表单多次提交、聊天输入、标签添加等场景。每次获取新输入后,直接 add 到 Set 中,无需手动比对:
- 用 new Set() 初始化一个空集合
- 每次用户输入(比如点击“添加”按钮),调用 set.add(value)
- Set 会自动忽略已存在的值,重复添加无效
- 需要展示时,用 [...set] 或 Array.from(set) 转为数组
示例:
const userInputs = new Set();function addInput(value) {
if (value.trim()) {
userInputs.add(value.trim()); // 自动跳过重复项
}
}
addInput("张三");
addInput("李四");
addInput("张三"); // 不会重复添加
console.log([...userInputs]); // ["张三", "李四"]
处理批量输入(如粘贴多行文本)
用户可能一次性粘贴多条数据(换行分隔),这时先分割再用 Set 去重:
- 用 .split(/\n+/) 拆分成数组,注意过滤空行和空白字符
- 用 new Set(array) 构造,自动剔除重复项
- 转成数组后可排序、渲染或提交
示例:
function handlePaste(text) {const lines = text.split(/\n+/)
.map(s => s.trim())
.filter(s => s);
return [...new Set(lines)];
}
console.log(handlePaste("苹果\n香蕉\n苹果\n橙子")); // ["苹果", "香蕉", "橙子"]
注意类型和引用问题
Set 的去重基于 SameValueZero 算法,对基本类型(字符串、数字)很可靠,但对对象不适用:
- 字符串"1" 和数字 1 是不同值,不会被当成重复
- 两个结构相同的对象(如 {id:1})仍是不同引用,Set 会视为两个元素
- 若需按某个字段(如 userId)去重,应先提取 key,用 Set 存 key,再筛选原数组
示例(按 id 去重用户对象):
const users = [{id:1,name:"A"}, {id:2,name:"B"}, {id:1,name:"C"}];const seenIds = new Set();
const uniqueUsers = users.filter(user => {
if (seenIds.has(user.id)) return false;
seenIds.add(user.id);
return true;
});
配合其他操作提升体验
实际项目中常结合校验、提示和状态更新:
- 添加前检查是否已存在,给出友好提示:“该用户名已添加”
- 使用 set.has(value) 快速判断,比数组 includes() 更快(尤其大数据量)
- 清空可用 set.clear();删除某项用 set.delete(value)
- 想保持插入顺序?Set 本身按插入顺序迭代,无需额外处理
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南











