如何使用 URLSearchParams 删除空查询参数？

Question

我正在处理查询参数，并被介绍给 URLSearchParams。我正在用它来形成这种对象来查询，

const x = {
  a: 'hello World'
  b: 23
  c: ''
}
let params = new URLSearchParams(x);
console.log(params.toString()) // a=hello+World&b=23&c=

这里，我不想要那个 c=，因为它很丑，我的 API 不需要那个。

所以，我想要这个结果 a=hello+World&b=23（没有空查询字符串）但是，我在 MDN 网络文档上找不到任何内容。

我该怎么做？

执行以下操作不起作用，因为它似乎直接改变了影响 forEach 的 params:

const x = {
  a: 'hello World',
  b: '',
  c: ''
};

let params = new URLSearchParams(x);
params.forEach((value, key) => { // never reaches `c`
  console.log(key, ' => ', value)
  if (value == '')
    params.delete(key);
});
console.log(params.toString());

Answer 1

您可以遍历键值对并删除具有 null 个值的键：

const x = {
  a: 'hello World',
  b: '',
  c: ''
};

let params = new URLSearchParams(x);
let keysForDel = [];
params.forEach((value, key) => {
  if (value == '') {
    keysForDel.push(key);
  }
});

keysForDel.forEach(key => {
  params.delete(key);
});

console.log(params.toString());

Answer 2

在 JavaScript ES5+ 中从查询中删除无用参数的简单方法：

for (let param in query) { /* You can get copy by spreading {...query} */
  if (query[param] === undefined /* In case of undefined assignment */
    || query[param] === null 
    || query[param] === ""
  ) {    
    delete query[param];
  }
}
return new URLSearchParams(query).toString();

Answer 3

我自己做的一个干净的方法如下（使用 lodash）：

import omitBy from 'lodash/omitBy';
import isEmpty from 'lodash/isEmpty';

const x = {
  a: 'hello World'
  b: 23
  c: ''
}

const params = new URLSearchParams(omitBy(x, isEmpty));

// mixing other sets
const params = new URLSearchParams({
  otherParam: 'foo', 
  ...omitBy(x, isEmpty)
});

Answer 4

如果您将查询作为字符串使用，您还可以使用正则表达式对其进行过滤：

const query = "a=hello+World&b=23&c=&d=12&e="

query.replace(/\w+=&/g, '').replace(/&\w+=$/, '')
// "a=hello+World&b=23&d=12"

如何使用 URLSearchParams 删除空查询参数？

How to remove empty query params using URLSearchParams?

javascript

url

url-parameters

node.js