【前端】‘??‘与‘||‘有什么区别,为什么不问问万能的chatgpt呢
RogerQianpeng 2024-07-29 13:03:04 阅读 80
0 问题
经常写<code>const data = res.data.a ?? ''或者const data = res.data.a || 'default'
,一下子感觉好像没啥差别,那为何不问问万能的chatgpt呢?
1 解答
在 JavaScript 中,当使用 ??
或 ||
运算符时,如果左侧的值为 null
、undefined
、false
、0
、NaN
或空字符串 ""
,则返回右侧的值。
但是,两个运算符的行为有所不同。 ??
运算符只在左侧的值为 null
或 undefined
时返回右侧的值,而 ||
运算符在左侧的值为上述任何一个时都会返回右侧的值。如果左侧的值不是上述值之一,则返回左侧的值。
下面是一些示例,可以帮助说明它们的行为:
let a = null;
let b = 5;
console.log(a ?? 10); // 输出 10,因为 a 是 null
console.log(a || 10); // 输出 10,因为 a 是 null
console.log(b ?? 10); // 输出 5,因为 b 不是 null 或 undefined
console.log(b || 10); // 输出 5,因为 b 不是 falsy 值
console.log("" ?? "hello"); // 输出 "",因为 "" 不是 null 或 undefined
console.log("" || "hello"); // 输出 "hello",因为 "" 是 falsy 值
请注意,||
运算符在某些情况下可能返回不同于预期的值,因为它不仅仅在左侧的值为 null
或 undefined
时返回右侧的值。如果左侧的值是一个 falsy
值(例如 0
或 ""
),那么 ||
运算符也会返回右侧的值。因此,如果你想检查一个变量是否为 null
或 undefined
,最好使用 ??
运算符。
2 其他补充
收到一个值,value
,希望判断它是否存在是否有值,0可以被认为为无值,有时也可以被认为为有值
1、如果你想判断一个字段是否有值,可以使用!!value
的方式
false
、0
、-0
、0n (BigInt 类型的零)
、""(空字符串)
、null
、undefined
、NaN
,都会被识别出来为false
2、而如果你希望0
被认为是有值,则可以使用!!value || value === 0
的方式
3、如果你希望真值被返回其本身而不是true,可以使用value || false ? value : false
,注意,0会被认为为false
4、如果你希望0也被认为为有值并返回其本身,可以使用!!value || value === 0 ? value : false
用一个hasValue
函数来简单封装一下即可按需使用
声明
本文内容仅代表作者观点,或转载于其他网站,本站不以此文作为商业用途
如有涉及侵权,请联系本站进行删除
转载本站原创文章,请注明来源及作者。