编写一个parseParam()函数, 将url解析为对象

最近遇到一个题目: 用js编写一个parseParam()函数, 将获取到的url解析为如下格式的对象.

输入: 'www.domain.com/?user=anony…'

输出: { user: 'anonymous', id: [ 123, 456 ], // 重复出现的 key 要组装成数组，能被转成数字的就转成数字类型 city: '北京', // 中⽂需解码 enabled: true, // 未指定值得 key 约定为 true }

直接上代码

/*
编写一个parseParam()函数, 将获取到的url解析为如下对象:
输入: 'http://www.domain.com/?user=anonymous&id=123&id=456&city=%E5%8C%97%E4%BA%AC&enabled'
结果: 
{ 
    user: 'anonymous', 
    id: [ 123, 456 ], // 重复出现的 key 要组装成数组，能被转成数字的就转成数字类型 
    city: '北京', // 中⽂需解码 
    enabled: true, // 未指定值得 key 约定为 true 
}
*/

let url = 'http://www.domain.com/?user=anonymous&id=123&id=456&city=%E5%8C%97%E4%BA%AC&enabled';

function parseParam(url) {
    
    let paramsObj = {};

    // 将 ? 后⾯的字符串取出来 
    // const paramsStr = /.+\?(.+)$/.exec(url)[1]; // 正则表达式写法
    const paramsStr = url.split('?').pop().toString();

    // 将字符串以 & 分割后存到数组中
    const paramsArr = paramsStr.split('&');

    // 遍历paramsArr, 并将其中的元素存到对象中 
    paramsArr.forEach(item => {

        // 判断有无=, 也就是判断有无value
        if (/=/.test(item)) {

            // 有value, 将数组中的元素以=分割开, 分别赋值给key和val
            // let keyValueArr = item.split('=')
            let [key, val] = item.split('=') // 还能这样写

            val = /^\d+$/.test(val) ? parseFloat(val) : val; // 判断是否转为数字

            // 判断是否有重复的id
            if (paramsObj.hasOwnProperty(key)) {
                // 有的话合并成数组
                paramsObj[key] = [paramsObj[key]].concat(val)
            } else {
                // 没有的话正常给obj赋值, 顺便解个码
                //      补充: decodeURIComponent()是解码函数
                //           encodeURIComponent()是编码函数
                paramsObj[key] = decodeURIComponent(val)
            }
        } else {
            // 没有value的情况直接给他指定true
            paramsObj[item] = true
        }
    });
    return paramsObj
}

// 执行并打印结果
console.log(parseParam(url))

/**
 * 知识点: 
 * - 正则表达式
 * - forEach()
 * - 数组方法
 * - 对象键值的赋值
 * - encodeURIComponent()和decodeURIComponent()
 */