使用 Set 管理搜索历史可自动去重、保持插入顺序，结合 localStorage 实现跨会话持久化；支持 O(1) 插入/查找、便捷增删查操作及数量限制。
用 Set 保存搜索历史，天然适合去重——它自动拒绝重复值，且插入、查找时间复杂度都是 O(1)，比数组去重更轻量高效。
初始化一个持久化的 Set 实例
搜索历史通常需要跨会话保留，所以得结合 localStorage 恢复数据；首次加载时从本地读取并还原为 Set：
let searchHistory = new Set();
// 从 localStorage 恢复（存的是 JSON 字符串数组）
const saved = localStorage.getItem('searchHistory');
if (saved) {
try {
JSON.parse(saved).forEach(item => searchHistory.add(item));
} catch (e) {
console.warn('解析历史记录失败，使用空记录');
}
}
添加新搜索词并自动去重
每次用户提交搜索，直接调用 add() 即可。重复词不会被重复插入，也不影响已有顺序（Set 保持插入顺序）：
JavaStoryDevelop
下载
你接手一个需求时，是不是经常这样："改一个小字段 → 结果把不相关的代码也改了"、"需求说得很模糊 → 做着做着发现跑偏了"、"数据库加个字段 → 上线才发现漏了数据兼容"、"做了个新功能 → 一个月后自己都忘了当时怎么设计的"、"写到一半被中断 → 再回来不知道从哪继续"；这个 Skill 就是专门解决这些问题的。 它会自动探测你的项目环境（JDK、Spring Boot、ORM、数据库、前端框架），记在
function addSearch(term) {
if (!term?.trim()) return;
const cleanTerm = term.trim();
// 自动去重：如果已存在，add() 不做任何事
searchHistory.add(cleanTerm);
// 同步到 localStorage（可选：限制最多保存 20 条）
const arr = Array.from(searchHistory);
const toSave = arr.slice(-20); // 只保留最近 20 条
localStorage.setItem('searchHistory', JSON.stringify(toSave));
}
读取和渲染历史列表
Set 可直接转为数组，方便遍历渲染。注意：不需要手动去重，也不用担心顺序错乱：
立即学习“Java免费学习笔记（深入）”；
function getRecentSearches() {
return Array.from(searchHistory).slice(-10); // 最近 10 条
}
// 示例：插入到 DOM
const listEl = document.getElementById('history-list');
listEl.innerHTML = getRecentSearches()
.map(term => `<li><button onclick="performSearch('${term}')">${term}</button></li>`)
.join('');
支持删除某条或清空全部
利用 Set 的 delete() 和 clear() 方法，操作简洁明确：
-
删单条：
searchHistory.delete('react') -
清空所有：
searchHistory.clear(); localStorage.removeItem('searchHistory'); - 更新后记得同步 localStorage，否则刷新就丢失
