JavaScript 中是否有空值合并运算符（null coalescing operator）？
例如，在 C# 中，我可以这样写：
String someString = null;
var whatIWant = someString ?? "Cookies!";
我认为在JavaScript中最好的逼近方法是使用条件运算符：
var someString = null;
var whatIWant = someString ? someString : 'Cookies!';
我认为那有点恶心。我能做得更好吗？
这里有两个项目：
const foo = '' || '默认字符串';
console.log(foo); // 输出结果是 '默认字符串'
const foo = '' ?? '默认字符串';
console.log(foo); // 输出结果是空字符串，即 ''
空值合并运算符 (??) 是一种逻辑运算符，当其左侧操作数为 null 或 undefined 时，返回其右侧操作数，否则返回其左侧操作数。
create-react-app工具链支持空值合并自从版本3.3.0(发布于2019年5月12日)。从发布说明中可以看到：
Optional Chaining and Nullish Coalescing Operators
We now support the optional chaining and nullish coalescing operators!
// Optional chaining a?.(); // undefined if `a` is null/undefined b?.c; // undefined if `b` is null/undefined // Nullish coalescing undefined ?? 'some other default'; // result: 'some other default' null ?? 'some other default'; // result: 'some other default' '' ?? 'some other default'; // result: '' 0 ?? 300; // result: 0 false ?? true; // result: false
如果您使用的是create-react-app 3.3.0+，那么您可以开始在React应用程序中使用空值合并运算符。
?? 运算符——看作是一种处理 null 或 undefined 时回退到默认值的方式。当我们编写如下代码时：let x = foo ?? bar();，这是一种新的表达方式，意味着当值 foo 存在时将使用它；但当它为 null 或 undefined 时，计算并使用 bar() 的返回值代替。ECMAScript 2021引入了两个新功能：
let b = undefined ?? 5;
console.log(b); // 5const car = {speed : 20};
car.speed ??= 5;
console.log(car.speed);
car.name ??= "reno";
console.log(car.name);关于逻辑空赋值的更多信息可以在这里找到 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_nullish_assignment
关于空值合并运算符的更多信息可以在这里找到 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Nullish_coalescing_operator
body.head.eyes[0] //body, head, eyes may be null
可以使用这个代码。
(((body||{}) .head||{}) .eyes||[])[0] ||'left eye'
const response = {
settings: {
nullValue: null,
height: 400,
animationDuration: 0,
headerText: '',
showSplashScreen: false
}
};
/* OR Operator */
const undefinedValue = response.settings.undefinedValue || 'Default Value'; // 'Default Value'
const nullValue = response.settings.nullValue || 'Default Value'; // 'Default Value'
const headerText = response.settings.headerText || 'Hello, world!'; // 'Hello, world!'
const animationDuration = response.settings.animationDuration || 300; // 300
const showSplashScreen = response.settings.showSplashScreen || true; // true
/* Nullish Coalescing Operator */
const undefinedValue = response.settings.undefinedValue ?? 'Default Value'; // 'Default Value'
const nullValue = response.settings.nullValue ?? ''Default Value'; // 'Default Value'
const headerText = response.settings.headerText ?? 'Hello, world!'; // ''
const animationDuration = response.settings.animationDuration ?? 300; // 0
const showSplashScreen = response.settings.showSplashScreen ?? true; // false
使用Babel的人需要升级到最新版本才能使用nullish coalescing(??)：
Babel 7.8.0默认支持新的ECMAScript 2020功能：您不再需要使用preset-env为nullish coalescing(??)，optional chaining(?.)和dynamic import()启用单独的插件。
const value = first ?? second ?? third ?? "default";
let valueToBeConsidered = !inputValue ? "trueCondition" : "falseCondition",
所以如果inputValue为null，则valueToBeConsidered = falseCondition，如果inputValue有值，则valueToBeConsidered = trueCondition
x ?? y语法现在处于一阶段提案状态 - 空值合并。 - Aprillionx ?? y）和可选链式操作符（user.address?.street）现在都达到了第四阶段。这意味着什么呢？请看这篇文章的详细描述：https://2ality.com/2015/11/tc39-process.html#stage-4%3A-finished 。 - Mass Dot Net