三目运算符是JavaScript中用“条件?表达式1:表达式2”实现简洁条件赋值的语法，条件为真时取表达式1的值，否则取表达式2的值，适用于变量初始化、函数返回等场景，但嵌套需谨慎且须注意运算符优先级。
三目运算符（也叫条件运算符）是 JavaScript 中最简洁的条件赋值方式，它用一行代码替代了 if...else 语句，特别适合在变量初始化、函数返回、模板渲染等场景中做简单判断赋值。
三目运算符的基本语法
格式是：条件 ? 表达式1 : 表达式2
执行逻辑：先计算“条件”，如果为真值（truthy），整个表达式结果是“表达式1”的值；否则取“表达式2”的值。注意：两个表达式都会被求值（除非短路，但三目本身不短路），但只返回其中一个。
用三目运算符简化变量赋值
常见于根据某个状态决定初始值：
立即学习“Java免费学习笔记（深入）”；
- 判断用户是否登录，设置欢迎语：const greeting = isLoggedIn ? '欢迎回来！' : '请先登录';
- 处理可能为 null/undefined 的数据，默认兜底：const name = userData?.name ?? '匿名用户';（这里用了空值合并，但也可写成 const name = userData && userData.name ? userData.name : '匿名用户';，三目更清晰）
- 根据数组长度决定提示文字：const tip = items.length > 0 ? `共${items.length}项` : '暂无数据';
嵌套三目要谨慎，优先考虑可读性
虽然可以写成 status === 'success' ? '✅' : status === 'error' ? '❌' : '⏳'，但多层嵌套会降低可维护性。建议：
- 超过一层嵌套时，改用 if...else 或 switch
- 复杂逻辑可封装成函数，再在三目中调用：const icon = getIconByStatus(status);
- 模板字符串中使用三目很自然，比如 Vue/React 的 JSX 或 HTML 模板：``
注意事项和易错点
三目运算符优先级低于逻辑运算符（如 &&、||），所以组合使用时记得加括号：
- ❌ 错误写法：isActive && role === 'admin' ? '编辑' : '查看' → 实际等价于 (isActive && role === 'admin') ? '编辑' : '查看'，看似没问题，但若想表达 “isActive 为真时，再根据 role 决定文字”，就容易歧义
- ✅ 推荐写法：isActive ? (role === 'admin' ? '编辑' : '查看') : '禁用'，或拆成变量提升可读性
- 三目必须有冒号和右侧表达式，不能省略（不像某些语言支持“条件 ?? 默认”这种简写）
