JavaScript基本语法 -- 条件语句 & 循环语句

Posted 2020-10-23 collywobble

条件语句

条件语句（Conditional statement）是javascript里面的基本结构之一，程序根据表达式的真假决定执行或者跳过某个分支，于是，条件语句有时候也可以称为“分支语句”

1. if & else if & else

基本写法如下：

if (表达式1) {         // 如果表达式1为真，执行代码块1
    代码块1
} else if (表达式2) {  // 如果表达式2为真，执行代码块2
    代码块2
} else {              // 否则，执行代码块3
    代码块3
}

 

举个栗子：

var score = 78;
if (score >= 90) {
    alert("成绩：优");
} else if(score >= 80) {
    alert("成绩：良");
} else if(score >= 70) {
    alert("成绩：中");
} else if(score >= 60) {
    alert("成绩：差");
} else {
    alert("成绩：不及格");
}

// 弹出结果：“成绩：中”

2. switch

上面的if & else if & else逻辑看着还是有点混乱，而且要写多个表达式，结构并不是很清晰明了。于是，有了switch语句

基本写法如下：

switch(n) {
    case 1:      // 如果n==1，执行代码块1
        代码块1;
        break;
    case 2:      // 如果n==2，执行代码块2
        代码块2;
        break;  
    case 3:      // 如果n==3，执行代码块3
        代码块3;
        break;
    default:     // 如果n都不等于以上情况，执行代码块n
        代码块n;
        break;
}

举个栗子：

var day = 4;
switch (day) {
    case 0:
        alert("星期日");
        break;
    case 1:
        alert("星期一");
        break;
    case 2:
        alert("星期二");
        break;
    case 3:
        alert("星期三");
        break;
    case 4:
        alert("星期四");
        break;
    case 5:
        alert("星期五");
        break;
    default:
        alert("星期六");
        break;
}

// 弹出结果：“星期四”

 

循环语句

同样的，循环语句（looping statement）也是JavaScript的基本结构之一，这种结构可以重复执行一段代码直至到给定的条件不成立。

JavaScript有4种循环语句：while & do/while & for & for...in

每个循环结构都有略微的不同，要注意区分，如果可以事先确定循环次数的，用for循环，否则，考虑用while 或者 do/while

其中 while 和 do/while 又有稍稍不同，while循环是先判断后执行，而do/while循环是先执行后判断。因此，do/while是至少会执行一次代码，不管条件成立与否。

PS：while结尾处不必添加分号，do/while在结尾处需要添加分号

还是举个栗子说明吧

求和：1+2+3+...+100

1. while

// while 循环
var sum1 = 0;
var j = 1;
while (j <= 100) {
    sum1 = sum1 + j;
    j++;
}
alert("1 + 2 + 3 + ... + 100 = " + sum1);  // 5050

2. do/while

// do while 循环
var sum2 = 0;
var k = 1;
do {
    sum2 = sum2 + k;
    k++;
} while(k <= 100);

alert("1 + 2 + 3 + ... + 100 = " + sum2);  // 5050

3. for

// for 循环
var sum3 = 0;
for (let i = 1; i <= 100; i++) {
    sum3 = sum3 + i;
}

alert("1 + 2 + 3 + ... + 100 = " + sum3);  // 5050

4. for...in

//for ... in遍历数组元素
var arr = [1,2,3,4,5,6,7,8,9,10];
for (var i in arr) {
    console.log(arr[i]);
}

//输出数组元素：1,2,3,4,5,6,7,8,9,10

 

其中，for/in 通常用来遍历对象成员属性

//for ... in遍历数组索引
for (var key in arr) {
    console.log(key);
}

// 输出数组索引(数组对象的属性)：0,1,2,3,4,5,6,7,8,9