一、什么是解析URL
js解析url,就是将如下url: const url = https://www.baidu.com/m?f=8&ie=utf-8&rsv_bp=1&tn=monline_3_dg&wd=session 解析为:
二、方法一:利用 splice 分割 + 循环依次取出
- 解析 url 并将其存储在新对象中,因此初始化一个空对象,让 obj = {}
- 首先判断 url 后面是否有 ?传参, 如果没有 ? 传参,直接返回空对象
if (url.indexOf('?') < 0) return obj
- 用 ? 进行参数分割 let arr = url.split('?')
此时的效果是将 ? 前后,一分为二
function queryURLparams(url) {
let obj = {}
if (url.indexOf('?') < 0) return obj
let arr = url.split('?')
url = arr[1]
let array = url.split('&')
for (let i = 0; i < array.length; i++) {
let arr2 = array[i]
let arr3 = arr2.split('=')
obj[arr3[0]] = arr3[1]
}
return obj
}
console.log(queryURLparams(url));
var url = "https://www.baidu.com/m?f=8&ie=utf-8&rsv_bp=1&tn=monline_3_dg&wd=session";
function getURL(url){
let str = url.split("?")[1];
let str1 = str.split("&");
let obj = {};
for(let i = 0; i<str1.length; i++){
let str2 = str1[i].split("=");
let key = str2[0];
let value = str2[1];
obj[key] = value;
}
return obj;
}
console.log(getURL(url))
三、方法二: 正则 + arguments
-
正则匹配规则
/([^?=&]+)=([^?=&]+)/g
-
利用 replace 替换
-
用伪数组进行键值对拼接
function queryURLparamsRegEs5(url) {
let obj = {}
let reg = /([^?=&]+)=([^?=&]+)/g
url.replace(reg, function() {
obj[arguments[1]] = arguments[2]
})
return obj
}
四、方法三: 正则 + ..arg
-
就是用 ES6 的 …arg
-
其实和 arguments 差不多 ,就是 arguments 是伪数组,…arg 是真数组
function queryURLparamsRegEs6(url) {
let obj = {}
let reg = /([^?=&]+)=([^?=&]+)/g
url.replace(reg, (...arg) => {
obj[arg[1]] = arg[2]
})
return obj
}