javascript - 防止在 searchParams 处理中出现不必要的 '='

Question

处理时searchParams , 额外 =为空值添加的，会导致错误的 URL。
有没有办法防止不必要的=处理时searchParams ?
注:可以删除额外的 =与 RegExp()但这个问题的目的是用 searchParams 本地实现它.

const u = new URL('https://example.com/?4FEE63D94&foo=1');
params = u.searchParams;

params.delete('foo');         // Delete the foo parameter
console.log(u.href);          // https://example.com/?4FEE63D94=

更新
URLSearchParams方法似乎改变了 URL。 URLSearchParams.entries() & URLSearchParams.forEach() & URLSearchParams.get()替换 +带空格( %20)。

const u = new URL('https://example.com/?4FEE63D94&foo=1&bar=aaa+bbb+ccc');
let params = u.searchParams;

params.delete('foo');         // Delete the foo parameter
console.log(u.href);          // https://example.com/?4FEE63D94=&bar=aaa+bbb+ccc

u.search = [...params.entries()].map(([key, value]) =>  value ? `${key}=${value}` : key).join('&');
console.log(u.href);          // https://example.com/?4FEE63D94&bar=aaa%20bbb%20ccc

偶 params.delete()更改 URL。 ( auth,client 到 auth%2Cclient )
注: 运行代码片段不显示

const url = 'https://example.com/?4FEE63D94&scope=auth,client&foo=1&bar=aaa+bbb+ccc';
const u = new URL(url);
let params = u.searchParams;
params.delete['foo'];
console.log(u.href);          // https://example.com/?4FEE63D94=&scope=auth%2Cclient&bar=aaa+bbb+ccc

解决方法:删除不必要的 =根据@Bergi 的建议

const u = new URL('https://example.com?4FEE63D94&foo=1&bar=aaa+bbb+ccc');
let params = u.searchParams;

params.delete('foo');         // Delete the foo parameter
console.log(u.href);          // https://example.com/?4FEE63D94=&bar=aaa+bbb+ccc

// URL() params.delete() adds = to all params
u.search = u.search.replace(/=(?=&|$)/g, '');

console.log(u.search);        // ?4FEE63D94&bar=aaa+bbb+ccc
console.log(u.href);          // https://example.com/?4FEE63D94&bar=aaa+bbb+ccc

性能测试
手动处理与 URLSearchParams

let t;
const n = 100000;

const url = 'https://example.com/?4FEE63D94&scope=auth,client&foo=1&bar=aaa+bbb+ccc';
const u = new URL(url);

t = performance.now();
for (let i = 0; i < n; i++) {
  let params = Object.fromEntries(u.search.substring(1).split('&').map(p => p.split('=')));
  delete params['foo'];
  u.search = Object.entries(params).map(([key, value]) => value ? `${key}=${value}` : key).join('&');
}
console.log(`Operation took ${performance.now() - t} milliseconds`); // 731 millisecond

t = performance.now();
for (let i = 0; i < n; i++) {
  let params = u.searchParams;
  params.delete('foo');
}
console.log(`Operation took ${performance.now() - t} milliseconds`); // 208 millisecond

Answer 1

URL如评论之一所述，类将搜索参数理解为键值对。你需要想想FEE63D94是:键还是值？
如果它是一个键，那么它将有一个空值，如 FEE63D94=如果它是一个值，则为它找到一个合适的键，key=FEE63D94另一种选择是让它成为路径的一部分，https://example.com/4FEE63D94?foo=1