JavaScript-语言基础（语句）

一、if 语句

if 括号中的条件，可以是任何表达式，并且求值结果不一定是布尔值。ECMAScript 会自动调用 Boolean() 函数将这个表达式的值转换为布尔值。

1.1 if

语法：

//条件成立执行代码，否则什么也不做
if (条件表达式) {
	// 条件成立执行的代码语句
}

if 后面只有一个语句时，花括号可以省略

 if(3 > 1) console.log('正确');

1.2 if else

语法：

// 条件成立执行 if 里面的代码，否则执行 false 里面的代码
if (条件表达式) {
	// 如果条件成立执行的代码
} else {
	// 否则执行的代码
}

省略花括号写法

if(3 < 1) console.log('正确'); 
else {console.log('错误');}

1.3 if 、else if

语法：

// 适用于检查多重条件
if (条件表达式1) {
	语句1;
} else if (条件表达式2) {
	语句2;
} else if (条件表达式3) {
	语句3
	...
} else {
	//上述条件都不成立时执行的代码
}

省略花括号的写法

if (3 < 1) console.log('a'); 
else if(3 === 1) console.log('b'); 
else console.log('c');

二、do-while 语句

先执行一次代码块，然后对条件表达式进行判断，如果条件为真，就会重复执行循环体，否则退出循环

语法：

do {
	//循环代码，条件表达式为 true 时重复执行循环体代码
} while (条件表达式)

let i  = 0;
do {
     i++
} while ( i < 10 )
console.log(i); // 10

注意：

• 先再执行循环体，再判断，do-while 循环语句至少会执行一次循环体代码

三、while 语句

在条件表达式为真的前提下，循环执行指定的一段代码，直到表达式不为真时结束循环

语法：

while (条件表达式式) {
	// 循环体代码
}

let j = 0;
while ( j < 10) {
   j++
}
console.log(j); // 10

//死循环，会无限次输出，不要轻易尝试，否则浏览器会崩溃
while (10) {
console.log(123);
}

注意：

• 使用 while 循环时一定要注意，它必须要有退出条件，否则会成为死循环
• while 循环和 for 循环的不同之处在于 while 循环可以做较为复杂的条件判断，比如判断用户名和密码

四、for 语句

for 循环主要用于把某些代码循环若干次，通常跟计数有关系

语法：

for (初始化变量; 条件表达式; 循环后表达式) {
	// 循环体
}

for(let i = 0; i < 3; i++) {
    console.log(i);
}
// 0,1,2
console.log(i); // i is not defined

• 无法通过 while 循环实现的逻辑，同样也无法使用 for 循环来实现
• 初始化、条件表达式、循环后表达式都是不必须的

for (;;) { //无穷循环
	// 循环体
}

• 如果只包含条件表达式，那么 for 循环实际上就变成了 while 循环

let count = 10;
let i = 10;
for (; i < count) {
	console.log(i);
	i++;
}

五、拓展：双重 for 循环

语法：

for (外循环的初始; 外循环的条件; 外循环的操作表达式) {
    for (内循环的初始; 内循环的条件; 内循环的操作表达式) {  
       需执行的代码;
   }
}

例子：

let star = '';
for (let j = 1; j <= 5; j++) {
    for (let i = 1; i <= 5; i++) {
        star += '☆'
    }
    // 每次满 5 个星星 就 加一次换行
    star += '\n'
}
// ☆☆☆☆☆
// ☆☆☆☆☆
// ☆☆☆☆☆
// ☆☆☆☆☆
// ☆☆☆☆☆

六、for-in 语句

用于枚举（遍历）对象中的非符号键属性

for-in 循环主要是为遍历对象而设计的，不适用于遍历数组。

一种解决方法是，使用 Object.keys(obj) 方法将对象的键名生成一个数组，然后再用 for-of 遍历这个数组。

语法：

for (变量 in 对象名字) {
    // 在此执行代码
}

例子：

语法中的变量是自定义的，它需要符合命名规范，通常我们会将这个变量写为 k 或者 key

以下代码出现的 const 是非必需的，只是推荐使用 const

for (const k in obj) {
    console.log(k);      // 这里的 k 是属性名
    console.log(obj[k]); // 这里的 obj[k] 是属性值
}

循环显示 BOM 对象的 window 的所有属性

for (const i in window) {
	console.log(i)
}

• ECMAScript 中对象的属性是无序的，所以不能保证返回对象属性的顺序
• 如果要循环的是 null 或 undefined，则不会执行循环体

七、for-of 语句

for-of 可以使用的范围包括数组、Set 和 Map 结构、某些类似数组的对象（比如arguments对象、DOM NodeList 对象）、Generator 对象，以及字符串

for (const el of [2,4,6,8]){
    console.log(el);
} // 2，4，6，8

八、标签语句

语法：

label: statement

例子：

start: for (let i = 0; i < 10; i++){
	console.log(i);
}

• 在上述例子中，start 就是一个标签，可以在后面通过 break 或 continue 语句引用

九、break 和 continue 语句

• break 语句用于立即跳出循环（循环结束）
• continue 语句用于立即跳出本次循环，继续执行下一次循环

for (let i = 1; i <= 5; i++){
    if(i === 3) {
        console.log('找到啦');
        break;
    }
    console.log(i);
} 
//打印结果：1、2、'找到啦'

for (let i = 1; i <= 5; i++){
    if(i === 3) {
        console.log('找到啦');
        continue;
    }
    console.log(i);
} 
//打印结果：1、2、'找到啦'、4、5

• break 和 continue 语句都可以与标签语句一起使用，返回代码中特定位置，通常用于循环嵌套中

使用 break

let num  = 0;

outermost:
for (let i = 0; i < 10; i++){
    for(let j = 0; j < 10; j++){
        if(i == 5 && j == 5) {
            break outermost;
        }
        num++;
    }
}
console.log(num); // 55

解析：
1、outermost 标签标识的是第一个 for 语句
2、添加标签，不仅让 break 退出使用（变量 j 的）内部循环，也会退出使用（变量 i 的）外部循环。
3、当执行到 i 和 j 都等于 5 时，循环停止，此时 num 值为 55

使用 continue

let num  = 0;

outermost:
for (let i = 0; i < 10; i++){
    for(let j = 0; j < 10; j++){
        if(i == 5 && j == 5) {
            continue outermost;
        }
        num++;
    }
}
console.log(num); // 95

解析：当 i 和 j 都等于 5 时，执行 continue ，跳到外部循环继续执行，导致内部循环少执行了 5 次

十、with 语句（不推荐）

with 的主要用途是将代码作用域设置为特定的对象，严格模式下不允许使用，否则报错

使用 with 语句的主要场景是针对一个对象反复操作

let a = location.search.substring(1);
let b = location.hostname
let c = location.href

//使用 with 可以写成：

with(location) {
let a = search.substring(1);
let b = hostname
let c = href
}

十一、switch 语句

用于基于不同的条件来执行不同的代码。当要针对变量设置一系列的特定值的选项时，就可以使用 switch

语法：

switch( 表达式 ){ 
    case value1:
        // 表达式 等于 value1 时要执行的代码
        break;
    case value2:
        // 表达式 等于 value2 时要执行的代码
        break;
    default:
        // 表达式 不等于任何一个 value 时要执行的代码
}

例子：

let num = 25;
switch (true) {
    case num < 0:
        console.log('a');
        break;
    case num >= 0 && num <= 10:
        console.log('b');
        break;
     case num >= 0 && num <= 30:
        console.log('c');
        break;
    default: 
        console.log('d');
}
// 结果： c

特点：

• switch 语句可以使用所有数据类型
• switch 语句在比较每个条件的值时会使用全等操作符（===）
• 如果 case 中没有 break，则继续执行下一个 case里面的语句

switch 语句和 if else if 语句的区别

• 一般情况下，它们两个语句可以相互替换
• switch 语句通常处理 case 为比较确定值的情况， 而 if else if 语句更加灵活，常用于范围判断(大于、等于某个范围)
• switch 语句进行条件判断后直接执行到程序的条件语句，效率更高。而 if else if 语句有几种条件，就得判断多少次
• 当分支比较少时， if else if 语句的执行效率比 switch 语句高
• 当分支比较多时，switch 语句的执行效率比较高，而且结构更清晰