前端url地址解析

直接上代码

//url 解析
const urlAnalysis = (url) => {
  //通过？分割
  const index = url.split("?");
  //地址
  const address = index[0];
  //参数
  const parameter = index[1];
  //继续进行分割
  const parameterArr = parameter.split("&");
  //储存的数组
  const resultArr = [];
  parameterArr.forEach((item, index) => {
    let r = item.split("=");
    let obj = {
      key: r[0],
      value: r[1],
    };
    resultArr.push(obj);
  });
  let urlanalysisResults = {
    url: address,
    data: resultArr,
  };
  return urlanalysisResults;
};

已经封装好了，直接拿去用就好

分析

其实是一个很简单的一个操作

比如我定义一个叫url的值是

const url = "https://www.baidu.com?id=100&name=测试"

那么我可以通过url.split("?")通过？进行一个分割那么它就变成两部分

const index = url.split("?")

["https://www.baidu.com","id=100&name=测试"] 他会给你返回一个这个数组

那么第一步就完成了我们就可以直接拿到这个数组下标1的这个字符串然后进行一个操作,

对"id=100&name=测试"再进行一个分割，这个的话拼接符号是&。

const parameter = index[1].url.split("&");

所以就可以再得到["id=100","name=测试"]这两个数组，然后同理嘛,对数组里面的每一项都进行一次分割,设置个resultArr数组进行储存一下

let resultArr = []

 parameter.forEach((item, index) => {

    let r = item.split("=");

    let obj = {

      key: r[0],

      value: r[1],

    };

    resultArr.push(obj);

  });

然后就完成了，resultArr里面的就是你想要的结构了

{

      id:100,

      name:"测试"  

}

 上面的代码已经封装好了，直接用即可