Js 解析URL获取查询字符串对象

前言

location 是 BOM 对象之一，提供了当前窗口中加载文档的信息，以及通常的导航功能。控制台打印信息如下：

从图可以看到 location 把 URL 解析成离散片段，目前想获取 URL 的查询串，并转成方便使用的对象，可以使用 location.search 获取到查询串，再转成对象。下面我们直接获取 location.href，在此基础上提取出查询串对象。

代码

let str = "https://editor.csdn.net/md?not_checkout=1&articleId=125228381";
//解析URL获取查询字符串对象
function getQueryStringArgs(urlStr){

	const res = {};
	//预防 URL 是经过 encodeURIComponent 编码，先进行一次解码,变成标准的URL
	let strs = decodeURIComponent(urlStr);
	//判断URL是否有查询串
	if(strs.lastIndexOf("?") == -1){
		return res;
	}else{
	   strs = strs.slice(strs.lastIndexOf("?")+1); //获取 ? 之后的字符串
	}
	//分割字符串为 [ [ 'name', 'ståle' ], [ 'age', '23' ] ] 格式
	const strArr = strs.split("&").map(item => item.split("="));
	strArr.forEach(item =>{
		res[item[0]] = item[1];
	})
	return res;
}

console.log(getQueryStringArgs(str));
//{ not_checkout: '1', articleId: '125228381' }