- 小知识,大挑战!本文正在参与“程序员必备小知识”创作活动。
前言
今天在群里,有一位好友提出一个问题,问javascript中的??是什么用法,说没有见过这种写法。阅读本文,我将带你认识javascript中的??语法。
看完本文你可以收获:
- 什么是?? 什么情况下用??
- 什么是|| 什么情况下用||
js中的空值合并操作符(??)
定义
空值合并操作符(??)是一个逻辑操作符,当左侧的操作数为 null 或者 undefined 时,返回其右侧操作数,否则返回左侧操作数。
基本用法
案例1
const foo = null ?? "string"
// string
复制代码
案例2
const foo = "zz" ?? "string"
// zz
复制代码
案例3
const foo = undefined ?? "string"
// string
复制代码
我们从以上是三个案例可以总结出来 当左侧的操作数为 null 或者 undefined 时,返回其右侧操作数,否则返回左侧操作数。
我的疑问
空值合并操作符(??)和逻辑或操作符(||)有什么不一样呢,可能大家在项目中经常用到逻辑或操作符号(||),那我们在来比较下他们的区别吧
js中的逻辑或操作符(||)
定义
逻辑或操作符(||)不同,逻辑或操作符会在左侧操作数为假值时返回右侧操作数
基本用法
案例1
const foo = null || "string"
// string
复制代码
案例2
const foo = undefined || "string"
// string
复制代码
案例3
cosnt foo = 0 || "string"
// string
复制代码
案例4
const foo = true || "string"
// true
复制代码
案例5
const foo = "" || "string"
// string
复制代码
经过我们比较会发现,如果使用 || 来为某些变量设置默认值,可能会遇到意料之外的行为。比如为假值(例如,'' 或 0)时候。
业务场景
-
我们在开发中与后端联调都会发现这样一个问题。明明后端应该返回数组,却因为某种原因返回的null。这个时候我们用空值合并操作符可以避免带来的一些问题。
-
业务中做一些判断,如下
推荐阅读
最后
我是布谷鸟工作室的zz,如果觉得可以大家记得一键三连哦!!!