0008. 条件语句 - if 结构
- 1. 🎯 本节内容
- 2. 🫧 评价
- 3. 📒 条件语句 - if 结构
- 4. 💻 demos.1 - if 结构简写形式
- 5. 💻 demos.2 - if 加大括号
- 6. 💻 demos.3 - 区分赋值和比较
1. 🎯 本节内容
- 掌握 if 语句的使用
2. 🫧 评价
- 笔记中除了介绍 if 语句的基本用法之外,还涉及到了一些和布尔运算、类型转换相关的知识点,这些也非常重要,详情会在其他笔记中介绍。
3. 📒 条件语句 - if 结构
if结构先判断一个表达式的布尔值,然后根据布尔值的真伪,执行不同的语句。- 所谓布尔值,指的是 JavaScript 的两个特殊值,
true表示“真”,false表示“伪”。
javascript
// 简写形式
if (条件表达式) 语句
// 或者
if (条件表达式) {
// 语句
}
// 这是 if 结构的基本形式。
// 需要注意的是,条件表达式必须放在圆括号中,表示对表达式求值。
// 如果表达式的求值结果为 true,就执行紧跟在后面的语句;
// 如果结果为 false,则跳过紧跟在后面的语句。1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
4. 💻 demos.1 - if 结构简写形式
js
var x1 = 1, x2 = 2
if (x1 === 2) x1 = x1 + 1
// 表示当 x1 等于 2 时,才会将其值加上 1。
if (x2 === 2) x2 = x2 + 1
// 表示当 x2 等于 2 时,才会将其值加上 1。
console.log(x1) // 1
console.log(x2) // 3
// 上述这种 if 的写法
// 要求条件表达式后面只能有一个语句1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
5. 💻 demos.2 - if 加大括号
js
var x1 = 1,
x2 = 2
if (x1 === 2) {
x1 = x1 + 1
// 这里还能插入其他语句
}
if (x2 === 2) {
x2 = x2 + 1
// 这里还能插入其他语句
}
console.log(x1) // 1
console.log(x2) // 3
// 如果想执行多个语句,必须在 if 的条件判断之后,加上大括号,表示代码块。
// 多个语句合并成一个语句块。
// 为了方便插入语句,通常都会在 if 语句中使用这种大括号的写法。1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
6. 💻 demos.3 - 区分赋值和比较
js
var x = 1
var y = 2
if ((x = y)) {
// 这一步是在执行赋值操作,而非比较运算。
console.log(x) // 2
}
// 上面代码的原意可能是:当 x 等于 y 的时候,才执行相关语句。
// 但是,不小心将严格相等运算符写成赋值表达式,结果变成了将 y 赋值给变量 x,再判断变量 x 的值(等于 2)的布尔值(结果为 true)。
// 这种错误可以正常生成一个布尔值,因而不会报错。
// 一些补充说明:
// 1. if 后面的表达式之中,不要混淆赋值表达式(=)、严格相等运算符(===)和相等运算符(==)。赋值表达式不具有比较作用。
// 2. 在比较相等的时候,优先使用“严格相等运算符”(===)。至于为什么优先采用“严格相等运算符”(===),而不是“相等运算符”(==),请参考和 “运算符” 相关的笔记。
// 3. 该示例中的 2 转为布尔值为 true,这涉及到隐式类型转换的相关知识点,请参考跟 “数据类型” 相关的笔记。1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
2
3
4
5
6
7
8
9
10
11
12
13
14
15