开发过程中，常常会遇到需要根据url中的参数来做一些判断，我这里就分享一个提取url中的参数的工具类方法，简洁明了，方便使用。
一般工具类的方法都会放在util.js中，下面就是我们的JS代码：
/**
* 解析url参数
* @example ?id=12345&a=b
* @return Object {id:12345, a:b}
* */
export function urlParse() {
let url = window.location.search
let obj = {}
let reg = /[?&][^?&]+=[^?&]+/g
let arr = url.match(reg)
// ['?id=12345','&a=b']
if (arr) {
arr.forEach((item) => {
let tempArr = item.substr(1).split('=')
let key = decodeURIComponent(tempArr[0])
let val = decodeURIComponent(tempArr[1])
obj[key] = val
})
}
return obj
}
使用的时候像下面这样：
// 先引入
import { urlParse } from './common/js/util'
// 在需要的地方直接调用
urlParse()
这里简单解释一下这个正则表达式/[?&][?&]+=[?&]+/g
第一个[]表示以?或&开头，就匹配?id=12345&a=b这个例子中第一个?号，第二个[]表示非?&，就匹配到了i或者d，第二个[]后面的+号表示多个，=号就直接匹配例子中的=号，最后这个[]跟第二个[]是一样的，+号也是一样的作用，/g就是全局匹配，意思就是匹配多组参数。
最终的结果就像下面这样：
{id: "12345", a: "b"}
再解释一下decodeURIComponent()这个方法：
它的作用是把字符串作为URI 组件进行编码，其返回值URIstring 的副本，其中的某些字符将被十六进制的转义序列进行替换。
注意 encodeURIComponent() 函数 与 encodeURI() 函数的区别之处，前者假定它的参数是 URI 的一部分（比如协议、主机名、路径或查询字符串）。因此 encodeURIComponent() 函数将转义用于分隔 URI 各个部分的标点符号。
例子：
<script type="text/javascript">
document.write("测试一："+encodeURIComponent("你好，世界！")+ "<br />")
document.write("测试二："+encodeURIComponent("Hello world!")+ "<br />")
document.write("测试三："+encodeURIComponent(",/?:@&=+$#"))
</script>
输出结果：
测试一：%E4%BD%A0%E5%A5%BD%EF%BC%8C%E4%B8%96%E7%95%8C%EF%BC%81
测试二：Hello%20world!
测试三：%2C%2F%3F%3A%40%26%3D%2B%24%23
再举一个我们这里的例子，如果我们的url参数是这个样子的：
?id=12345&a=b&a%20aa=b%20b%2Cb
解析之后就会变成下面这样：
{id: "12345", a: "b", a aa: "b b,b"}
%20就是空格，%2C就是英文逗号。
这里只输出这一个方法的写法，如果你的util.js文件中有很多方法，可以像下面这样写：
const urlParse = function () {
// 重复的代码
}
module.exports = {
urlParse
}
使用方式跟上面一样。
