在 JavaScript 中，条件语句是一种必不可少的编程工具。而其中 if 和 else 是最常用的两个语句之一。然而，有时候我们需要快速、简洁地表达一个条件语句，这就需要使用“三元运算符”或者 “shorthand if/else 语句”。
什么是 Shorthand if/else 语句
Shorthand if/else 语句也被称为 ternary 运算符，它可以将基本的 if/else 语句缩写成一行代码。该语句由三部分组成：条件（condition）、真值（true value）和假值（false value）。根据条件的结果，将返回真值或假值。以下是 shorthand if/else 语句的基本结构：
--------- - --------- - ----------
在上述代码中，如果 condition 条件成立，则返回 trueValue，否则返回 falseValue。
Shorthand if/else 语句的语法
Shorthand if/else 语句的语法与常规的 if/else 语句非常相似，唯一的区别是使用了问号（?）和冒号（:）来缩写语句，并且所有的表达式都放在一行上。
以下是常规的 if/else 语句的例子：
--- - - --- --- -------- -- -- - --- - ------- - -- -- ------- ---- ---- - ---- - ------- - -- -- ---- ---- -- ----- -- ---- -
可以用 shorthand if/else 语句来缩写上述代码：
--- - - --- --- ------- - -- - --- - -- -- ------- ---- --- - -- -- ---- ---- -- ----- -- ----
Shorthand if/else 语句的优点
使用 shorthand if/else 语句可以带来以下好处：
- 可以使代码更加简洁和易读。
- 可以减少代码的行数，从而提高性能。
- 可以将多个条件语句合并为一个表达式。
Shorthand if/else 语句的应用场景
shorthand if/else 语句常常用于以下场景：
- 在定义变量时根据条件赋值。
- 在 HTML 模板中根据条件设置样式或提供不同的内容。
- 在函数中返回不同的结果。
以下是这些应用场景的示例代码：
定义变量时根据条件赋值
--- --- - --- --- ------- - ---- -- --- - ---- - ------ --------------------- -- -- ----
在上述代码中，如果 age 大于等于 18，则 canVote 被赋值为 true，否则被赋值为 false。
在 HTML 模板中根据条件设置样式或提供不同的内容
---- ------------ ----------------------- ------------------ ------
在上述代码中，messageType 变量的值决定了 alert 的样式类型。如果 messageType 值为 "success"，则该 div 元素的 class 属性将被设置为 alert-success。
在函数中返回不同的结果
-------- ------------------ --------- - ------ --------- - -- - ----- - -- - -------- - ---- - ------ -
在上述代码中，如果 discount 大于 0，则计算折扣后的价格；否则直接返回原价。
总结
Shorthand if/else 语句是 JavaScript 中一种非常有用的编程工具。它可以使代码更加简洁易读，并减少代码的行数。在适当的情况下，使用
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/27603