【代码片段】JS 获取网址中的 get 查询参数

大家的板块 稻米鼠的频道🐹
1

非常基础，常用的功能。但一般我们能够查找到的方法都是对网址进行字符串的切割或者正则匹配。

字符串的切割比较麻烦，当然效果还是不错的。

正则匹配看起来很简短，但是却可能遇到正则不够完善，然后出现意外。毕竟想写一个完善的，正则表达式需要考虑到的情况还是非常多非常复杂的。

然后很多地方不加验证就反复转载这些方法，导致许多时候从上面摘抄下来的代码，在使用中就会遇到问题。

本来想自己去写一个尽可能完善的正则表达式。但是查询一下发现并没有必要这么麻烦

我在这里（ 关于 querystring 疑问 - V2EX ）发现，原来现在已经有对应的 API 可以使用了。所以简单地书写了一个功能函数，方便自己日常引用。

贴在这里只是为了以后遇到类似问题的朋友，也能够找到更先进一点的答案。

/**
 * 获取网址中的 get 查询参数
 *
 * @param {string} key 要查询的参数名称
 * @param {string} defaultVal 默认值,当未获取到指定参数时返回默认值
 * @param {string} [url=window.location.search] 输入的网址，默认是当前页面的查询部分。输入的格式和网址查询部分的格式相同（不是完整网址）
 * @return {*} 
 */
const getValinURL = (key, defaultVal, url=window.location.search)=>{
  const searchParams = new URLSearchParams(url)
  const val = searchParams.get(key)
  return val ? val : defaultVal
}

MDN 对应的 API 说明：URLSearchParams - Web API 接口参考 | MDN

请老鼠喝杯咖啡可好？

老鼠爱发电

1 个赞