javascript - 使用 URLSearchParams 删除 URL 参数

Question

我正在利用 URLSearchParams API 从 URL 的查询字符串中删除键/值。

我有以下代码片段:

params = new URLSearchParams('a=x&b=y&c=z');
params.forEach(function(value, key){
  console.log("Deleted: ", key, value, params.toString());
  params.delete(key);
});
console.log("Left with: ", params.toString());

Left with: 总是返回部分查询参数。

this 上的输出JSFiddle:

☁️ "Running fiddle"
"Deleted: ", "a", "x", "a=x&b=y&c=z"
"Deleted: ", "c", "z", "b=y&c=z"
"Left with", "b=y"

我对 forEach() 的理解是，它将循环所有键/值对，但基于这个 fiddle ，它看起来像是在倒数第二对上退出循环。

根据以下评论中的反馈进行编辑:

我正在尝试有选择地保留一两个参数(基于提供的列表)。

params = new URLSearchParams('a=x&b=y&c=z&d=1');
params.forEach(function(value, key){
  retainList = ['d'];
  if (retainList.includes(key)){
    console.log("Retaining ", key);
  } else {
    console.log("Deleted: ", key, value, params.toString());
    params.delete(key);
  }
});
console.log("Left with: ", params.toString());

Answer 1

URLSearchParams 似乎发生了一些奇怪的引用问题。即使当您使用 .keys() 方法来获取键列表时，它似乎也提供了对其内部键列表的引用。

您可以通过使用 spread 克隆 key 列表来解决此问题。

params = new URLSearchParams('a=x&b=y&c=z');
keys = [...params.keys()]
for (key of keys) {
  console.log("Deleting: ", key, params.get(key), params.toString());
  params.delete(key)
};
console.log("Left with: ", params.toString());

要达到预期的结果，您可以执行以下操作:

params = new URLSearchParams('a=x&b=y&c=z&d=1');
retainList = ['d']

for (key of [...params.keys()]) {
  if (! retainList.includes(key)) {
    console.log("Deleting: ", key, params.get(key), params.toString());
    params.delete(key)
  }
};
console.log("Left with: ", params.toString());