最简洁可靠的方式是用 urlsearchparams api:传入查询字符串,用 object.fromentries() 转为对象,自动解码;重复键默认取最后一个,需数组则手动遍历聚合;旧环境可用正则+decodeuricomponent 手动解析。

JavaScript 中把查询字符串转换为键值对对象,最简洁可靠的方式是用 URLSearchParams API —— 它是浏览器原生支持的标准接口,能自动处理 URL 编码、重复键、空值等边界情况。
使用 URLSearchParams(推荐)
这是现代浏览器(Chrome 49+、Firefox 44+、Safari 10.1+、Edge 16+)的首选方法,代码少、健壮、无需手动解码:
- 直接传入查询字符串(含或不含
?都可) - 用
Object.fromEntries()将迭代器转为普通对象 - 自动对键和值做
decodeURIComponent处理
示例:
const queryString = "name=%E5%BC%A0%E4%B8%89&age=25&hobby=reading&hobby=coding";
const params = Object.fromEntries(new URLSearchParams(queryString));
// 结果:{ name: "张三", age: "25", hobby: "coding" }
⚠️ 注意:如果查询参数有重复键(如 hobby=reading&hobby=coding),URLSearchParams 默认只保留最后一个值。需要保留全部时,得手动遍历处理(见下文)。
处理重复键(如多选 checkbox)
当同一个键出现多次(例如 tags=js&tags=css&tags=html),想得到数组形式的值,不能依赖 Object.fromEntries,而应遍历 entries() 并聚合:
function queryStringToObjWithArrays(str) {
const searchParams = new URLSearchParams(str);
const result = {};
for (const [key, value] of searchParams) {
if (result.hasOwnProperty(key)) {
if (!Array.isArray(result[key])) {
result[key] = [result[key]];
}
result[key].push(value);
} else {
result[key] = value;
}
}
return result;
}
// 使用
const qs = "tags=js&tags=css&city=Beijing&city=Shanghai";
console.log(queryStringToObjWithArrays(qs));
// → { tags: ["js", "css"], city: ["Beijing", "Shanghai"] }
兼容旧环境(无 URLSearchParams 时)
若需支持 IE 或极老版本浏览器,可用正则 + decodeURIComponent 手动解析:
- 先去掉开头的
?(如有) - 按
&拆分每组键值对 - 对每组用
=分割,并分别解码 - 注意处理没有值的情况(如
debug或flag=)
简易实现:
function parseQueryString(str) {
const obj = {};
if (!str) return obj;
// 去掉开头 ?,再分割
const pairs = str.replace(/^\?/, '').split('&').filter(Boolean);
for (const pair of pairs) {
const [key, val] = pair.split('=', 2).map(decodeURIComponent);
obj[key] = val !== undefined ? val : '';
}
return obj;
}
该写法不处理重复键,如需数组支持,同样要改造成累加逻辑。
小提示:从当前 URL 获取查询参数
如果目标是获取当前页面 URL 的查询参数,直接用 location.search 即可:
const currentParams = Object.fromEntries( new URLSearchParams(location.search) );
无需拼接或判断是否带 ?,location.search 总是以 ? 开头(无参数时为空字符串)。
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南











