JavaScript 中怎么用扩展运算符快速去重 URL 查询参数-js教程-PHP中文网

javascript中扩展运算符需配合urlsearchparams和set实现url参数去重：可提取所有值去重、保留首对同名键值、或仅对特定参数（如tags）去重合并。

javascript 中怎么用扩展运算符快速去重 url 查询参数

JavaScript 中扩展运算符（...）本身不能直接去重 URL 查询参数，但它常和 Set、URLSearchParams 配合使用，实现简洁高效的去重逻辑。

提取并去重所有参数值（不区分键）

如果你只关心「所有参数值」是否重复（比如多个 tag=js 和 tag=web 中的 js 出现多次），可以这样：

const url = new URL('https://example.com/?a=1&b=2&a=1&c=3');
const values = [...new URLSearchParams(url.search).values()];
const uniqueValues = [...new Set(values)]; // ['1', '2', '3']

去重并保留首个出现的键值对（推荐）

实际场景中更常见的是：相同参数名（如 id）多次出现时，只保留第一个，其余丢弃。这时不能只靠 Set 值，而要用对象或 Map 记录已见的键：

Java Maven Code Review

审查Java Maven项目（ZIP压缩包或GitLab仓库URL），检查代码规范、命名、模块边界、可维护性问题以及重复代码。

下载

function dedupeSearchParams(urlString) {
  const url = new URL(urlString);
  const params = new URLSearchParams();
  const seenKeys = new Set();

  for (const [key, value] of url.searchParams) {
    if (!seenKeys.has(key)) {
      seenKeys.add(key);
      params.append(key, value);
    }
  }

  url.search = params.toString();
  return url.toString();
}

// 示例
const result = dedupeSearchParams('https://a.com/?x=1&y=2&x=99&z=3&y=4');
// → 'https://a.com/?x=1&y=2&z=3'

仅对某几个特定参数去重（如 tags 数组）

如果参数本就是设计为数组（如 tags=js&tags=web&tags=js），你想去重后合并成单个逗号分隔值，可以这样处理：

const url = new URL('https://example.com/?tags=js&tags=web&tags=js&name=alice');
const tags = [...new Set(url.searchParams.getAll('tags'))];
url.searchParams.delete('tags');
if (tags.length) {
  url.searchParams.set('tags', tags.join(','));
}
// → 'https://example.com/?tags=js,web&name=alice'