06.if & if-else语句

if语句

if语句也称为条件判断语句。通过if语句可以为语句的执行设置一些条件，条件满足时语句执行，否则语句不执行。

语法一

if(条件表达式){
    语句
}

这是最简单的if语句，在if后的()中设置了条件表达式。条件表达式最终会被计算为一个布尔值（true或false），如果值为true则执行其后的语句，如果值为false则不会执行。

示例：

if (true) {
    console.log('条件表达式为true，语句会执行')
}

上例中，if后的条件表达式就是true，所以运算结果也是true，语句最终会执行，在控制台中会看到打印语句的输出。

示例：

if (false) {
    console.log('条件表达式为false，语句会执行')
}

上例中，if后的条件表达式是false，语句最终不会执行，控制台不会看到任何输出。

除此之外，如果在条件表达式中传递的并不是一个布尔值，比如这样：

if ('hello'){
    console.log('会不会执行呢？')
}

上例中，条件表达式传递的是一个字符串’hello’，条件表达式最终都会转换为布尔值，而’hello’是一个非空字符串，所以这里它会被转换为true，所以代码依然可以执行。

类似上例中，直接在条件表达式中写值的情况并不多。因为一旦直接将值写在条件表达式上，那么它的最终值就已经确定，值一旦确定那么所谓的逻辑判断也就没有什么意义了，所以一般条件表达式处会设置变量，或者是一些由变量的组成的表达式。比如这样：

条件表达式示例：
a > 10 // 当a大于10时，返回true
a > 10 && a < 20 // 当a大于10且小于20时，返回true
a > 10 || a < 5 // 当a大于10或a小于5时，返回true

示例：

if (a > 10) {
    console.log('a比10要大')
}

这样一来，语句执行与否将会由a的值来决定，a大于10那么语句就会执行，a不大于10，语句就不会执行。

代码块

这里if后的{}被称为代码块，在JS中代码块用来为代码分组，在同一代码块中的代码属于同一组。

{    
    console.log('a比10要大')
}

上例就是一个代码块，在if语句中，如果条件表达式为true，则代码块中的代码将会自上向下依次执行，如果条件表达式为false，则代码块中的代码将不会执行。

目前，我们写的if语句都比较简单，代码块中只有一行代码，其实也是可以写多行的。

if (a > 10) {     console.log('a比10要大') console.log('1111111') console.log('2222222') }

上边代码块中包含三行代码，这三行代码要么都执行，要么都不执行，由if后的条件表达式决定。

如果if后只有一条语句，像这样的：

if ('hello'){    
    console.log('会不会执行呢？')
}

这里的{}可以省略不写

if ('hello')     console.log('会不会执行呢？')

这两种写法的效果是一样的。

if-else语句

作为逻辑判断语句，if语句的功能相对来说是比较简单的。它只能决定一个语句是否执行，而if-else语句比if语句的功能更进了一步，它可以用来决定执行两个语句中的哪一个。

if (条件表达式){
    语句1
}else{
    语句2
}

相比与if语句，语句中多了一个else子块，理解起来也非常简单，还是先对if后的条件表达式进行判断，如果为true，则执行if后的语句1，如果为false，则执行else后的语句2。换句话说，现在的if语句有了两个选择，语句1和语句2，它可以根据不同的条件来执行不同的语句。

if (a > 10){
    console.log('a比10大')
}else{
    console.log('a没有10大')
}

上例代码的执行顺序同样，先判断a > 10的结果，如果为true，执行if后的语句，如果为false则执行else后的语句。

除此之外，也可以将多个if-else语句进行组合，组成更加复杂的语句。

if (条件表达式){
    语句1
}else if (条件表达式){
    语句2
}else if (条件表达式){
    语句3
} ... ...
}else{
    语句N
}

上例中的语法实际就是将多个if-else连接到了一起，这种语句在执行时会自上向下依次对条件表达式进行判断，如果为true，则执行执行其后对语句，如果为false则继续向下判断，直到找到true为止，如果所有的都为false，则执行else后的语句。