JS删除不存在的URL查询参数时无值参数被追加=的原因求助

问题现象 #

当处理带无值查询参数的URL（比如https://stackoverflow.com/questions/ask?tes）时，直接调用URLSearchParams.delete()删除一个不存在的参数，会让原本的无值参数tes变成tes=；但先检查目标参数是否存在再执行删除，就能保留原始的无值参数格式。

核心逻辑拆解 #

1. URLSearchParams的参数存储与序列化规则
   原始URL里的?tes属于「无值查询参数」，是URL规范里的简写形式。URLSearchParams解析它时，会把tes记录为键存在但值为空的条目，但默认序列化（生成URL查询串）时，如果参数值为空，会输出key=的格式。

2. delete()方法的触发机制
   不管目标参数是否存在，只要调用delete()，URLSearchParams就会触发内部的参数序列化更新流程——它会重新梳理所有参数的格式，把原本以「无值简写」存在的参数，强制转换成标准键值对格式（即追加=），哪怕实际没有删除任何参数。

3. 先检查参数存在性的作用
   用get("hello")检查时，因为目标参数不存在，get()会返回null，此时不会执行delete()，也就不会触发URLSearchParams的序列化更新，原始的无值参数简写形式自然会被保留。

示例验证 #

示例1：直接删除不存在的参数

var currentURL = new URL("https://stackoverflow.com/questions/ask?tes");
var currentURLSearchParams = currentURL.searchParams;

console.log("urlBefore:", currentURL)
currentURLSearchParams.delete("hello")
console.log("urlAfter:", currentURL)

执行结果：

urlBefore: "https://stackoverflow.com/questions/ask?tes"
urlAfter: "https://stackoverflow.com/questions/ask?tes="

示例2：检查存在性后再删除

var currentURL = new URL("https://stackoverflow.com/questions/ask?tes");
var currentURLSearchParams = currentURL.searchParams;

console.log("urlBefore:", currentURL)
var helloParameter = currentURLSearchParams.get("hello") 
if (helloParameter) {
   currentURLSearchParams.delete("hello")
}
console.log("urlAfter:", currentURL)

执行结果：

urlBefore: "https://stackoverflow.com/questions/ask?tes"
urlAfter: "https://stackoverflow.com/questions/ask?tes"

内容的提问来源于stack exchange，提问作者Dinesh s