使用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:总是返回部分查询参数。

这 JSFiddle上的输出：

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

我对forEach()的理解是，它将遍历所有键/值对，但基于这个小提琴，它似乎退出了倒数第二对的循环。

根据以下评论中的反馈意见编辑：

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

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()方法获取键列表，它似乎也在引用它的内部键列表。

您可以通过使用铺展克隆密钥列表来解决此问题。

​

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());

​