一分钟认识JS中 ?? 和 || 两者的用法和区别

前言

在JS中,??|| 都可以处理空值或者未定义,这两个操作符有什么区别呢?

||

|| 是逻辑或运算符,用于进行逻辑判断,它是这样运行的,如果第一操作值为假值(null、undefined、false、空字符串、0、NaN),那么就会返回第二个值。如果第一个值为真值,返回第一个值。

|| 一般用在处理默认值或者条件运算

示例

js 复制代码
const a = null;
const b = "Hello World";
const c = a || b; // c is now "Hello World"

??

??是空值合并操作符,用于对空值(null、undefined)进行处理。它的行为是这样的:如果第一个操作数是空值(例如 nullundefined),那么它就会返回第二个操作数的值。反之返回第一个值。

?? 一般用于简化代码进行空值合并

js 复制代码
const a = null;
const b = "Hello World";
const c = a ?? b; // c is now "Hello World"

区别

js 复制代码
const a = false
const b = "Hello World"
a ?? b  // false
a || b // "Hollo World"

总结起来有两点不同:

  1. 值判断范围不同: || 判断是否为假值 , 而??主要针对null undefined
  2. 用途稍有不同:|| 是逻辑运算符偏向逻辑处理, ??主要为了简化代码
相关推荐
前端Hardy4 分钟前
别再忽略 Promise 拒绝了!你的 Node.js 服务正在“静默自杀”
前端·javascript·面试
前端Hardy6 分钟前
别再被setTimeout闭包坑了!90% 的人都写错过这个经典循环
前端·javascript·vue.js
小林coding12 分钟前
专为程序员打造的简历模版来啦!覆盖前端、后端、测开、大模型等专业简历
前端·后端
前端Hardy12 分钟前
你的 Vue 组件正在偷偷吃掉内存!5 个常见的内存泄漏陷阱与修复方案
前端·javascript·面试
RaidenLiu23 分钟前
Flutter Platform Channel 底层架构解析 —— 从 BinaryMessenger 到跨平台消息通信机制
前端·flutter·前端框架
bluceli26 分钟前
CSS容器查询:响应式设计的新范式
前端·css
Tapir29 分钟前
被 Karpathy 下场推荐的 NanoClaw 是什么来头
前端·后端·github
前端人类学29 分钟前
深入解析JavaScript中的null与undefined:区别、用法及判断技巧
前端·javascript
带刺的坐椅31 分钟前
SolonCode v0.0.20 发布 - 编程智能体(新增子代理和浏览器能力)
java·ai·agent·solon·solon-ai·claude-code·openclaw
ssshooter2 小时前
Tauri 项目实践:客户端与 Web 端的授权登录实现方案
前端·后端·rust