【笔记】JS解析URL的query参数

发表于 更新于 阅读次数：

前言

JS解析URL的query参数（查询字符串）

将字符串转换为查询字符串对象

  • 自动进行URL解码
1
const searchParams = new URLSearchParams("?key1=value&key2=value");

将查询字符串对象转换为字符串

  • 自动进行URL编码
1
const urlSearchString = searchParams.toString();

遍历查询字符串对象中的键值对

  • searchParams是可迭代对象，在使用for…of遍历时，会自动遍历searchParams.entries()

以下两种写法结果完全相同

1
for (const [key, value] of searchParams()) {}
1
for (const [key, value] of searchParams.entries()) {}

根据指定键从查询字符串对象中获取值

通过get()方法获取

1
console.log(searchParams.get("key1")); // value

转换为对象并通过属性获取

  • 现将查询字符串对象转换为数组，再将数组转换为对象
1
2
3
const searchParamsObject = Object.fromEntries(searchParams.entries())

console.log(searchParamsObject.key1); // value

完成