分享一道params参数转对象的面试题

金三银四的招聘期，笔者也参加了几场面试。这道题是面试时面试官出的题，面试的时候紧张没写出来，结束后复盘把他重新写了一遍。

先来看题目

//   console.log(getQuery('https://domain?a=1&b=2&c='));       //  {a: "1", b: "2", c: ""}
//   console.log(getQuery('https://domain?a=1&b=2&c=3&c=4'));  //  {a: "1", b: "2", c: ["3", "4"]}
//   console.log(getQuery('domain?a=1&b=2&c=3??3='));          //  {a: "1", b: "2", c: "3??3="} 
//   ## 将 url 的 queryString 转成 object 返回，当有相同参数时，合并成数组，如: a=1&a=2， 则 {a: ["1", "2"]} 

一开始刚拿到手觉得特别简单，不就是找出问号然后再用split对&进行拆分就行了吗。首先我就用indexOF找出第一个问号的下标然后使用slice进行截取，再对&进行拆分。相信很多人跟我一样都是这样想的。

const getQuery=(url)=>{
    if(url.indexOf('?')==-1)return {};
    let index=url.indexOf('?')
    const result = {};
    let str=url.slice(index+1)
    let params=str.split('&');
    for(let item of params){
        let index=item.indexOf('=')
        let key=item.slice(0,index),value=item.slice(index+1)
        result[key]=value;
    }
    return result;
}
  console.log(getQuery('https://domain'));                  //  {}
  console.log(getQuery('https://domain?a=1&b=2&c='));       //  {a: "1", b: "2", c: ""}
  console.log(getQuery('https://domain?a=1&b=2&c=3&c=4'));  //  { a: '1', b: '2', c: '4' }
  console.log(getQuery('domain?a=1&b=2&c=3??3='));          //  {a: "1", b: "2", c: "3??3="} 

写到这我以为完成了，但是面试官说我是不是漏了些什么，我一看才发现样例三不对劲。 需要将同名的参数存住并且放进一个数组中。当时可能是比较紧张加上剩余的时间也不多了，面试官就叫我下去自己再看看。

面试完后的复盘我又重写了这道题，其实很简单的一个思想，先判断result对象里是否存在key值，如果存在就在判断result[key]是否为数组，如果是一个数组，那就直接将value值push进去，如果不是数组，那就构建一个数组。

const getQuery = (url) => {
    if(url.indexOf('?')==-1)return {};
    let index=url.indexOf('?')
    const result = {};
    let str=url.slice(index+1)
    let params=str.split('&');
    for(let item of params){
        let index=item.indexOf('=')
        let key=item.slice(0,index),value=item.slice(index+1)
        if(result.hasOwnProperty(key)){
            if(result[key].constructor==Array){
                result[key].push(value)
            }else{
                result[key]=result[key].concat(value).split("")
            }
        }else{
            result[key]=value
        }
    }
    return result;
  }

  console.log(getQuery('https://domain'));                  //  {}
  console.log(getQuery('https://domain?a=1&b=2&c='));       //  {a: "1", b: "2", c: ""}
  console.log(getQuery('https://domain?a=1&b=2&c=3&c=4'));  //  {a: "1", b: "2", c: ["3", "4"]}
  console.log(getQuery('domain?a=1&b=2&c=3??3='));          //  {a: "1", b: "2", c: "3??3="} 

这道题考了很多数组的api以及对象的api，可以说是受益匪浅。