urlsearchparams构造函数不接受普通对象，只支持字符串、urlsearchparams实例或可迭代对象；多级嵌套需手动扁平化，清空时应保留非过滤参数并避免popstate误触发。
URLSearchParams 构造时直接传入对象会失效，必须用 URL 或字符串
很多人尝试 new URLSearchParams({category: 'shoes', price: '100-500'})，结果得到空实例——这是最常踩的坑。URLSearchParams 构造函数**不接受普通对象**，只接受：string、URLSearchParams 实例、或支持 forEach 的可迭代对象（如 FormData）。
正确做法是先拼好查询字符串，或用 Object.entries() 转成键值对数组再传入：
const filters = { category: 'shoes', brand: 'nike', in_stock: 'true' };
const params = new URLSearchParams(Object.entries(filters));
// → "category=shoes&brand=nike&in_stock=true"
多级嵌套过滤条件（如价格区间、标签数组）需手动扁平化
真实商品筛选常含复合结构：价格区间 { min: 100, max: 500 }、多选标签 ['red', 'large']。这些不能直接塞进 URLSearchParams，否则会转成 tags=red,large 或 price=[object Object]，后端无法解析。
- 价格区间建议拆成两个独立参数：
price_min=100&price_max=500 - 数组类参数统一用重复键名：
tags=red&tags=large（后端按同名多值接收） - 避免 JSON 字符串化——既增加体积，又破坏可读性和缓存友好性
一键清空所有过滤参数，但保留基础路径和非过滤参数
清空不是简单地 window.location.search = ''，那会丢掉分页 page=2、排序 sort=price_asc 等非过滤类参数。应只剔除明确属于“过滤”的键名：
const keepKeys = new Set(['page', 'sort', 'limit']);
const url = new URL(window.location.href);
const params = new URLSearchParams(url.search);
for (const key of params.keys()) {
if (!keepKeys.has(key)) params.delete(key);
}
url.search = params.toString();
window.history.replaceState(null, '', url);
注意：replaceState 比 assign 更安全，不触发页面刷新；delete 操作要放在循环外收集 key 再批量删，否则 keys() 迭代器可能跳过项。
同步更新地址栏时，避免重复触发 popstate 监听器
如果页面监听了 popstate 来响应参数变化（比如自动重载商品列表），那么用 replaceState 清空参数后，用户点浏览器后退，会回到带旧参数的 URL——这容易造成逻辑错乱。
- 在
popstate回调里加守卫：只处理参数有实质变更的情况（对比prevSearch和当前location.search） - 清空操作完成后，手动调用一次渲染逻辑，而不是依赖 popstate 触发
- 不要在清空后立刻
pushState新记录——那会让前进/后退栈膨胀
复杂点在于「哪些算过滤参数」需要业务层明确定义并维护一份白名单，漏掉一个就可能导致清空不干净或误删关键参数。
