条件语句

条件语句

JavaScript 提供if结构和switch结构,完成条件判断,即只有满足预设的条件,才会执行相应的语句。

1.if 结构

if结构先判断一个表达式的布尔值,然后根据布尔值的真伪,执行不同的语句。所谓布尔值,指的是 JavaScript 的两个特殊值,true表示“真”,false表示“伪”。

1
2
3
4
5
if (布尔值)
语句;

// 或者
if (布尔值) 语句;

上面是if结构的基本形式。需要注意的是,“布尔值”往往由一个条件表达式产生的,必须放在圆括号中,表示对表达式求值。如果表达式的求值结果为true,就执行紧跟在后面的语句;如果结果为false,则跳过紧跟在后面的语句。

1
2
if (m === 3)
m = m + 1;

上面代码表示,只有在m等于3时,才会将其值加上1。

这种写法要求条件表达式后面只能有一个语句。如果想执行多个语句,必须在if的条件判断之后,加上大括号,表示代码块(多个语句合并成一个语句)。

1
2
3
if (m === 3) {
m += 1;
}

建议总是在if语句中使用大括号,因为这样方便插入语句。

注意,if后面的表达式之中,不要混淆赋值表达式(=)、严格相等运算符(===)和相等运算符(==)。尤其是赋值表达式不具有比较作用。

1
2
3
4
5
6
var x = 1;
var y = 2;
if (x = y) {
console.log(x);
}
// "2"

上面代码的原意是,当x等于y的时候,才执行相关语句。但是,不小心将严格相等运算符写成赋值表达式,结果变成了将y赋值给变量x,再判断变量x的值(等于2)的布尔值(结果为true)。

这种错误可以正常生成一个布尔值,因而不会报错。为了避免这种情况,有些开发者习惯将常量写在运算符的左边,这样的话,一旦不小心将相等运算符写成赋值运算符,就会报错,因为常量不能被赋值。

1
2
if (x = 2) { // 不报错
if (2 = x) { // 报错

2.if…else 结构

if代码块后面,还可以跟一个else代码块,表示不满足条件时,所要执行的代码。

1
2
3
4
5
if (m === 3) {
// 满足条件时,执行的语句
} else {
// 不满足条件时,执行的语句
}

上面代码判断变量m是否等于3,如果等于就执行if代码块,否则执行else代码块。

对同一个变量进行多次判断时,多个if…else语句可以连写在一起。

1
2
3
4
5
6
7
8
9
if (m === 0) {
// ...
} else if (m === 1) {
// ...
} else if (m === 2) {
// ...
} else {
// ...
}

else代码块总是与离自己最近的那个if语句配对。

1
2
3
4
5
6
var m = 1;
var n = 2;

if (m !== 1)
if (n === 2) console.log('hello');
else console.log('world');

上面代码不会有任何输出,else代码块不会得到执行,因为它跟着的是最近的那个if语句,相当于下面这样。

1
2
3
4
5
6
7
if (m !== 1) {
if (n === 2) {
console.log('hello');
} else {
console.log('world');
}
}

如果想让else代码块跟随最上面的那个if语句,就要改变大括号的位置。

1
2
3
4
5
6
7
8
if (m !== 1) {
if (n === 2) {
console.log('hello');
}
} else {
console.log('world');
}
// world

3. switch 结构

多个if…else连在一起使用的时候,可以转为使用更方便的switch结构。

1
2
3
4
5
6
7
8
9
10
switch (fruit) {
case "banana":
// ...
break;
case "apple":
// ...
break;
default:
// ...
}

上面代码根据变量fruit的值,选择执行相应的case。如果所有case都不符合,则执行最后的default部分。需要注意的是,每个case代码块内部的break语句不能少,否则会接下去执行下一个case代码块,而不是跳出switch结构。

1
2
3
4
5
6
7
8
9
10
11
12
13
var x = 1;

switch (x) {
case 1:
console.log('x 等于1');
case 2:
console.log('x 等于2');
default:
console.log('x 等于其他值');
}
// x等于1
// x等于2
// x等于其他值

上面代码中,case代码块之中没有break语句,导致不会跳出switch结构,而会一直执行下去。正确的写法是像下面这样。

1
2
3
4
5
6
7
8
9
10
switch (x) {
case 1:
console.log('x 等于1');
break;
case 2:
console.log('x 等于2');
break;
default:
console.log('x 等于其他值');
}

switch语句部分和case语句部分,都可以使用表达式。

1
2
3
4
5
6
7
switch (1 + 3) {
case 2 + 2:
f();
break;
default:
neverHappens();
}

上面代码的default部分,是永远不会执行到的。

需要注意的是,switch语句后面的表达式,与case语句后面的表示式比较运行结果时,采用的是严格相等运算符(===),而不是相等运算符(==),这意味着比较时不会发生类型转换。

1
2
3
4
5
6
7
8
9
10
var x = 1;

switch (x) {
case true:
console.log('x 发生类型转换');
break;
default:
console.log('x 没有发生类型转换');
}
// x 没有发生类型转换

上面代码中,由于变量x没有发生类型转换,所以不会执行case true的情况。这表明,switch语句内部采用的是“严格相等运算符”

4.三元运算符

JavaScript 还有一个三元运算符(即该运算符需要三个运算子)?:,也可以用于逻辑判断。

1
(条件) ? 表达式1 : 表达式2

上面代码中,如果“条件”为true,则返回“表达式1”的值,否则返回“表达式2”的值。

1
var even = (n % 2 === 0) ? true : false;

上面代码中,如果n可以被2整除,则even等于true,否则等于false。它等同于下面的形式。

1
2
3
4
5
6
var even;
if (n % 2 === 0) {
even = true;
} else {
even = false;
}

这个三元运算符可以被视为if…else…的简写形式,因此可以用于多种场合。

1
2
3
4
5
6
7
var myVar;
console.log(
myVar ?
'myVar has a value' :
'myVar does not have a value'
)
// myVar does not have a value

上面代码利用三元运算符,输出相应的提示。

1
var msg = '数字' + n + '是' + (n % 2 === 0 ? '偶数' : '奇数');

上面代码利用三元运算符,在字符串之中插入不同的值。


条件语句
https://huangzunxue998.top/2024/05/10/条件语句/
Author
黄dada
Posted on
May 10, 2024
Licensed under