如何使用 URLSearchParams 从给定 url 中的一组值中有效地仅删除一个查询字符串？

Question

使用这个： https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams

如果我在 url 中有几个 color[] 查询并且只想删除 red，这是最好的算法吗？

在下面的示例中，我使用了.delete()方法，然后重新添加删除的那些。有没有更有效的方法？

function log(h){document.getElementById('log').innerHTML += h+'<br>';}

let uri = 'http://localhost/?color[]=red&color[]=blue&color[]=green&page=2';
log(uri);
log(''); //space --------

let U = new URL(uri);
let search_params = U.searchParams;

log('current search params:');
for(let [k,v] of search_params.entries()){
log(`${k}: ${v}`);
}
log(''); //space --------


let colors = search_params.getAll('color[]');
log('colors: '+JSON.stringify(colors,null,2));
log(''); //space --------

//remove red by removing all and adding the rest
search_params.delete('color[]');
log('params after delete all colors: ');
for(let [k,v] of search_params.entries()){
log(`${k}: ${v}`);
}

log(''); //space --------

for(let v of colors){
  if(v !== 'red'){
    search_params.append('color[]',v);
  }
}

log('colors after adding all but red: '+JSON.stringify(search_params.getAll('color[]'),null,2));
log(''); //space --------

log('params after removing red: ');
for(let [k,v] of search_params.entries()){
log(`${k}: ${v}`);
}

#log { min-height:600px; min-width:600px;}

<div id="log"></div>

Answer 1

您可以使用 filter function

let search_params_without_red = new URLSearchParams(Array.from(search_params).filter(color => color[1] !== `red`))

在这里得到一些帮助： https://github.com/whatwg/url/issues/335

如何使用 URLSearchParams 从给定 url 中的一组值中有效地仅删除一个查询字符串？

How can one remove only one query-string effectively from an array of values in a given url using URLSearchParams?

javascript

query-string