如何在URL参数为空或缺失时为网页姓名显示设置回退值？

你只需要在获取URL参数时，添加回退值的判断逻辑即可，以下是几种简单可行的实现方式：

方式一：使用逻辑或运算符（||） #

逻辑或运算符会在左侧值为假值（包括null、空字符串等）时，自动取右侧的回退值，刚好匹配你“参数为空或缺失时显示Friend”的需求。

修改后的完整代码：

<html>
    <body>
       Hi there <span id="name"></span>!
    </body>
</html>

<script>
    const queryString = window.location.search;
    const urlParams = new URLSearchParams(queryString);
    // 当name参数不存在或为空时，自动使用'Friend'
    const name = urlParams.get('name') || 'Friend';
    document.getElementById("name").innerHTML = name;
</script>

方式二：使用空值合并运算符（??） #

如果你希望仅当参数**完全缺失（返回null）**时才用回退值，而参数存在但为空（比如?name=）时显示空内容，可以用空值合并运算符——它只会在左侧值为null或undefined时取右侧值：

const name = urlParams.get('name') ?? 'Friend';

方式三：显式条件判断 #

如果觉得运算符不够直观，也可以用显式的if判断实现：

let name = urlParams.get('name');
// 判断参数是否为空或不存在
if (!name) {
    name = 'Friend';
}
document.getElementById("name").innerHTML = name;

以上三种方式都能实现你的需求，根据个人习惯选择即可。

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