极客笔记js ??运算符
1. 简介
??运算符是一种新的逻辑运算符，在JavaScript中引入自ECMAScript 2020标准。它被称为nullish合并运算符，用于简洁地判断一个值是否为null或undefined，并返回一个非空的默认值。
在许多编程语言中，我们经常需要对一个变量进行判断，如果它为null或undefined，就赋予一个默认值。传统的写法通常使用逻辑或运算符（||），但缺点是在某些情况下会导致错误的结果。??运算符的出现主要是为了解决这个问题。
2. 使用方式
??运算符的使用方式很简单，它的语法形式为：a ?? b，其中a和b都是表达式，a是一个待判断的值，b是默认值。
当a的值为null或undefined时，??运算符返回b；否则，返回a的值。
3. 示例代码
为了更好地理解??运算符的使用场景，我们来看几个示例代码。
3.1 使用??运算符给变量赋默认值
let validValue;
// 使用逻辑或运算符的写法
let defaultValue = validValue || 'Default Value';
console.log(defaultValue); // 输出：Default Value
// 使用??运算符的写法
defaultValue = validValue ?? 'Default Value';
console.log(defaultValue); // 输出：Default Value
在上面的代码中，我们定义了一个变量validValue，它没有被赋值，默认值为undefined。我们需要判断validValue是否为空，如果为空，就赋予默认值。使用逻辑或运算符时，为空的判断条件是validValue || 'Default Value'，这会导致一个错误的结果，因为空字符串、0和false等值也会被判断为false。而使用??运算符时，判断条件是validValue ?? 'Default Value'，只有当validValue为null或undefined时，才会赋予默认值。
3.2 使用??运算符解决函数参数默认值问题
function showMessage(name, message) {
name = name ?? 'Guest';
message = message ?? 'Welcome!';
console.log(`Hello, {name}!{message}`);
}
// 不传参数的情况
showMessage(); // 输出：Hello, Guest! Welcome!
// 传入部分参数的情况
showMessage('Alice'); // 输出：Hello, Alice! Welcome!
showMessage('Bob', 'Good morning!'); // 输出：Hello, Bob! Good morning!
在上述代码中，我们定义了一个名为showMessage的函数，它接受两个参数name和message，并打印出欢迎消息。使用??运算符给参数赋默认值，可以在不传入参数或者只传入部分参数时，保证程序的正常运行。
除了函数参数，??运算符还可以用于给变量赋默认值、对象属性赋默认值等场景，都可以通过短路判断来简化代码的编写。
4. 空值合并运算符 vs 逻辑或运算符
为了更好地理解与传统逻辑或运算符之间的区别，我们来看一个示例。
let a = 0;
let b = '';
console.log(a || 5); // 输出：5
console.log(b || 'Hello'); // 输出：Hello
console.log(a ?? 5); // 输出：0
console.log(b ?? 'Hello'); // 输出：
我们定义了两个变量a和b，分别赋值为0和空字符串。使用逻辑或运算符判断时，0和空字符串都会被判断为false，因此会返回默认值。而使用??运算符判断时，只有null和undefined才会返回默认值。
5. 总结
通过本文的介绍，我们了解了??运算符的用法及其与逻辑或运算符之间的区别。在判断一个变量是否为null或undefined，并给它赋一个默认值时，我们可以优先选择使用??运算符，以减少错误发生的概率。通过简化代码，提高代码的可读性和可维护性。在实际开发中，我们可以根据具体需求，灵活运用??运算符，提升代码的效率。