js实现一个函数用来解析 URL 的 querystring

思路整理

• 正常的querystring：https://juejin.tech?a=1
• 增加场景
  1. 没有
  2. 有key，没value
  3. 有中文
  4. 带有hash，#xxx
  5. 同一个key

代码实现

function qs(url) {
    var startIndex = url.indexOf('?')
    var endIndex = url.indexOf('#') > -1 ? url.indexOf('#') : url.length 
    var querystring = startIndex > -1 ? decodeURIComponent(url.substring(startIndex + 1, endIndex)) : ''
    if (querystring) {
        var searchArr = querystring.split('&').map(item => item.split('='))
        var result = searchArr.reduce(function(acc, curr) {
            var key = curr[0]
            var value = curr[1] ?? ''
            if (acc[key]) {
                value = [acc[key]].concat(value)
            }
            return {...acc, [key]: value}
        }, {})
        return result
    } else {
        return {}
    }
}
var url1 = 'https://juejin.tech'
var url2 = 'https://juejin.tech?a'
var url3 = 'https://juejin.tech?name=%E5%B1%B1%E6%9C%88'
var url4 = 'https://juejin.tech?name=%E5%B1%B1%E6%9C%88&a=3'
var url5 = 'https://juejin.tech?name=%E5%B1%B1%E6%9C%88&a=3&a=4'
var url6 = 'https://juejin.tech?name=%E5%B1%B1%E6%9C%88&a=3#hash'
qs(url1)