URL参数的增删改查以及不刷新页面更新url

interface ISearchParams {
  [key: string]: string
}

/**
 * 获取URL中的参数object
 * @param {String} url 链接
 */
export function getURLSearchParams(url: string): ISearchParams {
  const urlInstance = new URL(url)
  const searchParamsInstance = urlInstance.searchParams
  const searchParamsEntries = searchParamsInstance.entries()
  const searchParams = Object.fromEntries(searchParamsEntries)
  return searchParams
}

/**
 * 删除URL中的指定参数
 * @param {String} url 链接
 * @param {Array<string>} keys key组
 */
export function removeURLSearchParams(url: string, keys: string[]): string {
  const urlInstance = new URL(url)
  const searchParamsInstance = urlInstance.searchParams
  keys.forEach((key: string) => {
    searchParamsInstance.delete(key)
  })
  const newUrl = urlInstance.toString()
  return newUrl
}

/**
 * 新增/更新URL中的指定参数
 * @param {String} url 链接
 * @param {ISearchParams} partialSearchParams 参数对象
 */
export function updateURLSearchParams(url: string, partialSearchParams: ISearchParams) {
  const urlInstance = new URL(url)
  const searchParamsInstance = urlInstance.searchParams

  Object.keys(partialSearchParams).forEach((key: string) => {
    const value = partialSearchParams[key]
    searchParamsInstance.set(key, value)
  })

  const newUrl = urlInstance.toString()

  return newUrl
}

/**
 * 无痕更新页面URL
 * @param {String} url 新链接
 */
export function replaceURL(url: string) {
  window.history.replaceState(null, '', url)
}