URLSearchParams 是浏览器原生解析查询字符串最靠谱的方式，不用正则、不依赖第三方库，兼容性也够用（Chrome 49+、Firefox 44+、Safari 10.1+、Edge 17+）。

怎么把 URL 查询字符串转成可操作的对象

直接传字符串或 URL 实例进去就行，它内部会自动解码（包括空格变空格、%2B 变 + 等），比手写 split("&") 安全得多：

const params = new URLSearchParams("name=张三&city=%E4%B8%8A%E6%B5%B7&age=25");
console.log(params.get("name")); // "张三"
console.log(params.get("city")); // "上海"

• 传入 location.search 最常见：new URLSearchParams(location.search)
• 如果字符串开头带 ?（比如 ?a=1&b=2），URLSearchParams 能自动忽略；不带也没问题
• 别用 decodeURIComponent 预处理——它会把 + 当空格错解，而 URLSearchParams 内部按规范处理

get 和 getAll 的区别和使用场景

get 只取第一个同名参数值，getAll 返回数组——这在表单多选、复选框、重复参数时特别关键：

DeepBI DHTML 页面生成器

生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur

下载

const params = new URLSearchParams("tag=js&tag=web&tag=api");
params.get("tag");    // "js"
params.getAll("tag"); // ["js", "web", "api"]

• 后端返回的查询串可能含重复键（如 filter=id:1&filter=status:active），这时必须用 getAll
• has("key") 比 get("key") !== null 更准确，因为值可能是空字符串
• toString() 会重新编码并拼接，结果可用于跳转或 fetch：window.location.search = params.toString()

IE 不支持怎么办？要不要 polyfill

IE 完全不支持 URLSearchParams，但强行 polyfill 有风险：

立即学习“前端免费学习笔记（深入）”；

• 社区常用 polyfill（如 url-search-params-polyfill）在 IE9 下对 % 编码处理不一致，可能导致中文乱码
• 如果项目已用 axios 或 fetch，它们内部的 params 配置是另一套逻辑，和 URLSearchParams 并不等价，混用容易出 bug
• 简单场景（只读、无重复键）可降级为手动解析：

  function parseQuery(q) {
    return q.substring(1).split("&").reduce((o, kv) => {
      const [k, v] = kv.split("=");
      o[decodeURIComponent(k)] = decodeURIComponent(v || "");
      return o;
    }, {});
  }

真正麻烦的是需要动态增删改查、还要保持编码正确、又得兼容老浏览器的场景——这时候不是选 API 的问题，是得先理清「谁控制 URL 的生成」：是前端路由？表单提交？还是后端重定向？搞错源头，光修 URLSearchParams 没用。