javascript 条件分支语句：if，if else, else if, 条件运算符 ?

在上面的例子中，条件是一个简单的相等检查（year == 2015），但它也可以复杂得多。

如果我们想执行多条语句，就必须用花括号 {} 将代码块包裹起来：

if (year == 2015) {
  alert( "That's correct!" );
  alert( "You're so smart!" );
}

我们建议每次使用 if 语句时都使用花括号 {} 包裹代码块，即使只有一条语句也不要省略。这样做可以提升代码的可读性。

布尔转换

if (…) 语句会计算括号中的表达式，并将结果转换为布尔值。

让我们回顾一下“类型转换”章节中的规则：

• 数字 0、空字符串 ""、null、undefined 和 NaN 都会被转换为 false，因此它们被称为“假值”（falsy）。

• 其他值会被转换为 true，因此被称为“真值”（truthy）。

所以，在这种条件下，下面的代码将永远不会执行：

if (0) { // 0 is falsy
  ...
}

……而在这种条件下，代码总是会执行：

if (1) { // 1 is truthy
  ...
}

我们也可以将一个预先计算好的布尔值传递给 if，比如这样：

let cond = (year == 2015); // equality evaluates to true or false

if (cond) {
  ...
}

else 子句

if 语句可以包含一个可选的 else 块。当条件为假值（falsy）时，else 中的代码就会执行。

例如：

let year = prompt('In which year was the ECMAScript-2015 specification published?', '');

if (year == 2015) {
  alert( 'You guessed it right!' );
} else {
  alert( 'How can you be so wrong?' ); // any value except 2015
}

多重条件子句：else if

有时候，我们想要测试多种条件的情况。可以使用 else if 子句来实现。

例如：

let year = prompt('In which year was the ECMAScript-2015 specification published?', '');

if (year < 2015) {
  alert( 'Too early...' );
} else if (year > 2015) {
  alert( 'Too late' );
} else {
  alert( 'Exactly!' );
}

在上面的代码中，JavaScript 首先检查 year < 2015。如果结果为假，就继续检查下一个条件 year > 2015。如果这个条件也为假，就执行最后的 alert。

可以有多个 else if 块。最后的 else 是可选的。

if else if … 语句—多分支

● 可以通过 if 和 else if 来设置多个条件进行判断

● 语法：

○ if (条件1) { 条件1为 true 时候执行 } else if (条件2) { 条件2为 true 时候执行 }

● 会从头开始依次判断条件

● 如果第一个条件为 true 了，那么就会执行后面的 {} 里面的内容

● 如果第一个条件为 false，那么就会判断第二个条件，依次类推

● 多个 {} ，最多会有一个被执行，一旦有一个条件为 true 了，后面的就不在判断了

// 第一个条件为 true，第二个条件为 false，最终会打印 “我是代码段1”
if (true) {
  	alert('我是代码段1')
} else if (false) {
    alert('我是代码段2')
}

// 第一个条件为 true，第二个条件为 true，最终会打印 “我是代码段1”
// 因为只要前面有一个条件满足了，就不会继续判断了
if (true) {
  	alert('我是代码段1')
} else if (true) {
  	alert('我是代码段2')
}

// 第一个条件为 false，第二个条件为 true，最终会打印 “我是代码段2”
// 只有前一个条件为 false 的时候才会继续向后判断
if (false) {
  	alert('我是代码段1')
} else if (true) {
  	alert('我是代码段2')
}

// 第一个条件为 false，第二个条件为 false，最终什么也不会发生
// 因为当所有条件都为 false 的时候，两个 {} 里面的代码都不会执行
if (false) {
  	alert('我是代码段1')
} else if (false) {
  	alert('我是代码段2')
}

if else if … else 语句—多分支

● 和之前的 if else if … 基本一致，只不过是在所有条件都不满足的时候，执行最后 else 后面的 {}

// 第一个条件为 false，第二个条件为 false，最终会打印 “我是代码段3”
// 只有前面所有的条件都不满足的时候会执行 else 后面的 {} 里面的代码
// 只要前面有一个条件满足了，那么后面的就都不会执行了
if (false) {
  	alert('我是代码段1')
} else if (false) {
  	alert('我是代码段2')
} else {
  	alert('我是代码段3')
}

条件运算符 ?

有时候，我们需要根据条件来给一个变量赋值。

例如：

let accessAllowed;
let age = prompt('How old are you?', '');

if (age > 18) {
  accessAllowed = true;
} else {
  accessAllowed = false;
}

alert(accessAllowed);

所谓的“条件”或“问号”运算符可以让我们以更简洁的方式完成这个操作。

该运算符由一个问号 ? 表示。有时它被称为“三元运算符”，因为这个运算符有三个操作数。实际上，它是 JavaScript 中唯一一个拥有三个操作数的运算符。

其语法是：

let result = condition ? value1 : value2;

条件被评估：如果它是“真值”（truthy），则返回 value1，否则返回 value2。

例如：

let accessAllowed = (age > 18) ? true : false;

从技术上讲，我们可以省略 age > 18 周围的括号。问号运算符的优先级较低，所以它会在比较运算符 > 之后执行。

这个例子与之前的效果相同：

// the comparison operator "age > 18" executes first anyway
// (no need to wrap it into parentheses)
let accessAllowed = age > 18 ? true : false;

但是括号使代码更易读，因此我们建议使用括号。

请注意：

在上面的例子中，您可以避免使用问号运算符，因为比较本身就会返回 true 或 false：

// the same
let accessAllowed = age > 18;

多个问号运算符 ?

一系列问号运算符 ? 可以根据多个条件返回一个值。

例如：

let age = prompt('age?', 18);

let message = (age < 3) ? 'Hi, baby!' :
  (age < 18) ? 'Hello!' :
  (age < 100) ? 'Greetings!' :
  'What an unusual age!';

alert( message );

一开始可能很难理解发生了什么。但是仔细观察后，我们可以看到它只是一个普通的条件测试序列：

• 第一个问号检查 age < 3。

• 如果为真，它返回 'Hi, baby!'。否则，它继续到冒号 : 后面的表达式，检查 age < 18。

• 如果为真，它返回 'Hello!'。否则，它继续到下一个冒号 : 后面的表达式，检查 age < 100。

• 如果为真，它返回 'Greetings!'。否则，它继续到最后一个冒号 : 后面的表达式，返回 'What an unusual age!'。

以下是使用 if..else 的写法：

if (age < 3) {
  message = 'Hi, baby!';
} else if (age < 18) {
  message = 'Hello!';
} else if (age < 100) {
  message = 'Greetings!';
} else {
  message = 'What an unusual age!';
}

问号的非传统用法

有时，问号 ? 被用来代替 if：

let company = prompt('Which company created JavaScript?', '');

(company == 'Netscape') ?
   alert('Right!') : alert('Wrong.');

根据条件 company == 'Netscape'，问号运算符 ? 后的第一个或第二个表达式会被执行，并显示一个 alert。

在这里，我们并没有将结果赋值给变量。相反，我们根据条件执行不同的代码。

不推荐以这种方式使用问号运算符

这种表示法比等效的 if 语句更简洁，可能吸引一些程序员，但它的可读性较差。

下面是使用 if 语句进行比较的相同代码：

let company = prompt('Which company created JavaScript?', '');

if (company == 'Netscape') {
  alert('Right!');
} else {
  alert('Wrong.');
}

我们的眼睛通常是垂直扫描代码的。跨越多行的代码块比一长串水平的指令更容易理解。

问号运算符 ? 的目的是根据条件返回一个值或另一个值。请仅仅用它来做这件事。当你需要执行不同分支的代码时，请使用 if。

总结

● if 或 else if 的条件存在数据隐式类型的转换

● else 只能跟在 if 或 else if，之后，从语法角度看 else 可以省略

● 支持嵌套