英文 | https://www.javascripttutorial.net/
译文 | 杨小爱
在上节中，我们学习了JavaScript 程序流程中的if else语句，错过的小伙伴可以点击文章《 【JavaScript 教程】第四章 程序流程01— JavaScript if else 语句》进行学习。
那么，在今天的教程中，我们将一起来学习如何使用 JavaScript 三元运算符使您的代码更加简洁。
JavaScript 三元运算符简介
当您想在特定测试的计算结果为true时执行代码块，您通常会使用if-else语句。例如，如果age大于16，则允许该人开车可以编码如下：
var age = 19;
var canDrive;
if (age > 16) {
canDrive = 'yes';
} else {
canDrive = 'no';
}
在此示例中，您可以使用三元运算符作为if-else语句的快捷方式，如下所示：
var age = 19;
var canDrive = age > 16 ? 'yes' : 'no';
这样，代码看起来干净多了。
一般来说，三元运算符的语法如下：
condition ? expression_1 : expression_2;
JavaScript 三元运算符是唯一接受三个操作数的运算符。
condition是一个表达式计算结果为布尔值（true或false），无论是true或false。如果条件为true，则三元运算符返回expression_1，否则返回expression_2。
expression_1，和expression_2是任何类型的表达式。
JavaScript 三元运算符示例
设置默认参数
ES5 中三元运算符的典型用途之一是设置函数的默认参数，例如：
function foo(bar) {
bar = typeof(bar) !== 'undefined' ? bar : 10;
console.log(bar);
}
foo(); // 10
foo(20); // 20在本例中，如果不传递bar参数，则其值设置为10。否则，bar参数使用其传递的值，在本例中为 20。
请注意，ES6引入了一种更好的方法来设置函数的默认参数。
执行多项操作
可以在三元运算符的每种情况下执行多个操作，每个操作用逗号分隔。请参阅以下示例：
var authenticated = true;
var nextURL = authenticated ? (
alert('You will redirect to admin area'),
'/admin'
) : (
alert('Access denied'),
'/403'
);
// redirect to nextURL here
console.log(nextURL); // '/admin'
在此示例中，三元运算符的返回值是逗号分隔列表中的最后一个值。
简化三元运算符
请参阅以下示例：
var locked = 1;
var canChange = locked != 1 ? true : false;
如果locked为 1，则canChange变量设置为false，否则设置为true。
在这种情况下，您可以使用布尔表达式来简化它，如下所示：
var locked = 1;
var canChange = locked != 1;
使用多个 JavaScript 三元运算符
以下示例显示如何在同一表达式中使用两个三元运算符：
var speed = 90;
var message = speed >= 120 ? 'Too Fast' : (speed >= 80 ? 'Fast' : 'OK');
console.log(message);
当三元运算符使代码更易于阅读时，最佳做法是使用它。如果逻辑包含许多if...else语句，则不应使用三元运算符。
总结
通过本教程的学习，我们知道了如何使用 JavaScript 三元运算符，您可以将其用作 if-else 语句的快捷方式，使您的代码更简洁。
