url拆解成origin、文件名、hash拆解成示例的格式。

假如Url: http://www.baidu.com:8080/news/index.asp?boardID=5&ID=24618&page=1#name
1、获取 origin

// 正则提取 
// const originReg = /^https?:\/\/[\w-.]+(:\d+)?/i
// 第一种获取 origin
const originArr = new RegExp('^https?://[\\w-.]+(:\\d+)?', 'i').exec(url)
console.log('origin=22==:', originArr)
const url = 'http://www.baidu.com:8080/news/index.asp?boardID=5&ID=24618&page=1#name'
// console.log('origin===:', originReg.test(url))
// 第二种获取 origin
// const originReg = /^https?:\/\/[\w-.]+(:\d+)?/i
// console.log('origin=11==:', url.match(originReg))
// console.log('origin=22==:', originReg.exec(url))

2、获取文件名称

const getFiles = (url) => {
  const endUrl = url.split('//')[1]
  const startIndex = endUrl.indexOf('/')
  const curFiels = endUrl.substring(startIndex)
  if (curFiels && curFiels.indexOf('?') > -1) {
    return  curFiels.split('?')[0]
  } else {
    return curFiels
  }
}
console.log('===', getFiles(url))

3、获取hash

const anchor = (url) => {
  const anchorName = url && url.indexOf('#') > -1 ? url.split('#')[1] : ''
  return anchorName
}
console.log('=anchor==:', anchor(url))

4、获取参数

/**
 * @description 获取参数 可能存在锚点
 * @param url String 需要处理URL
 * @param paramsKey string 需要获取参数值的名称，可以不传
 * */ 
const getParams = (url, paramsKey) => {
  let paramStr = ''
  if (url.indexOf('?') > -1) {
    paramStr = url.split('?')[1]
  }
  const params = paramStr.indexOf('#') > -1 ?  paramStr.split('#')[0] : paramStr
  const parmasArr = params.split('&')
  let allPObj = {}
  parmasArr && parmasArr.length && parmasArr.map(item => {
    const curItemArr = item.split('=')
    allPObj[curItemArr[0]] = curItemArr[1]
  })

  if (paramsKey) {
    return allPObj[paramsKey]
  } else {
    return allPObj
  }
}
console.log('=all param==:', getParams(url))
console.log('=ID param==:', getParams(url, 'ID'))