
三元表达式也叫做三元运算符是 JavaScript 中唯一需要三个操作数的运算符也是前端开发中最常用的简化判断语法。我们普通运算符大多是二元例如 11、ab只需要两个数据参与运算而三元表达式需要条件、成立执行代码、不成立执行代码三部分所以被称为“三元”。它的核心作用简化简单的 if…else 判断语句让代码更简洁、更优雅。二、三元表达式标准语法完整公式条件 ? 条件成立执行代码 : 条件不成立执行代码执行逻辑●先判断前面的 条件 是否为 true●条件为 true执行 ? 后面的代码●条件为 false执行 : 后面的代码基础示例对比需求判断分数是否及格普通 if else 写法let score 80let resif(score 60){res “及格”}else{res “不及格”}三元表达式极简写法let score 80let res score 60 ? “及格” : “不及格”可以明显看出4行的if判断三元表达式一行就能搞定。三、为什么叫“三元”很多初学者疑惑三元到底代表什么三元 三个参与运算的单元1.第一个单元判断条件2.第二个单元条件为真的结果3.第三个单元条件为假的结果这也是它和其他运算符最大的区别是 JS 中独一无二的三目运算语法。四、项目常用场景三元表达式专门用于 简单的二选一逻辑是项目高频用法●状态文字切换成功/失败、开启/关闭●样式动态切换高亮/默认●搜索结果判断、有无数据提示●参数默认值简单判断示例搜索结果提示你之前项目真实场景// 筛选后数据判断Filterpackage.length ? Toast.showSuccess(‘搜索成功’) : Toast.showError(‘无搜索结果’)逻辑有长度有数据就成功没有数据就提示无结果非常简洁。五、三元表达式使用禁忌重点三元表达式虽然简洁但是有严格使用规范只适合简单判断三元表达式的定位是 替代简单 if else只做二选一简单逻辑。禁止多层嵌套虽然三元表达式支持嵌套写法但是绝对不推荐嵌套后代码可读性极差、难以维护、容易出错不符合企业代码规范。复杂多分支判断必须使用 if else 或 switch。尽量用于赋值、简单语句不要在三元中写大量业务逻辑只做简单取值、赋值、提示。六、总结三元表达式三元运算符JS 唯一三目运算语法由「条件、true结果、false结果」三部分组成因此叫三元语法条件 ? 成立执行 : 不成立执行作用简化简单二选一的 if 判断精简代码规范只用于简单逻辑禁止嵌套保证代码可读性。三元表达式是前端最基础、最高频的语法熟练使用可以让代码更加干净、优雅是项目开发和面试的基础必备知识点。