前端 js中 if 语句、for循环、switch语句_前端switch循环

程序结构

1.基本结构(顺序执行)
2.分支结构(分支语句)
3.循环结构(循环语句)

分支语句

if(判断条件){
只有当if中的判断条件为true的时候，{ } 中的代码才能被执行，如果判断条件不为true，
则跳过 { } 中的代码，程序继续往下执行
}
if 后面 () 中的判断条件，不管里面的表达式有多复杂，返回的值永远只有 true 或 false

if(){
如果判断条件 为true，则执行这里的代码
}else(){
如果判断条件 不为true，则执行else中的代码
}

if 可以单独使用，else 必须结合 if 一起使用，else指的是除了满足if条件之外的所有条件

注意:
1.当你书写判断条件的时候，注意等于是 == ，不是 = ， 一个 = 是赋值
2.0 ‘’ null undefined 如果写在判断条件中，都被解析为false
非0 非’’ 非null 非undefined 如果写在判断条件中，都被解析为true

let num = 0||6;
console.log(num);//6
if(0||6 && 0){
    console.log('涂山璟');
}else{
    console.log('相柳');
};
输出为相柳

let num1 = 20;
if(num>100){
    console.log('20>100');
}else{
    console.log('20<100');
};//输出为20<100

//写成=的情况
let a = 10;
if(a=20){ //一个=是赋值 不是比较
    console.log(a);
}//20
if(''){//中间没有空格，输出值为空
    console.log('南村群童欺我老无力');
}
if(!0){
    console.log('南村群童欺我老无力');
}//输出为南村群童欺我老无力
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

if 语句练习

分支语句的级联语句
if(判断条件){

}else if(判断条件){

}else{

}
在使用if 语句的时候，else 的范围有时候会比较大，因此可以使用else if 对具体的情况进行细分,else if 可以根据情况设置多个

判断闰年的条件
1.能被4整除，不能被100整除
2.能被400整除
body里面的内容

练习3
数据1:<input type="number" id="num1" value=""><br>
数据2:<input type="number" id="num2" value=""><br>
<button id="bijiao" value="">比较大小</button>
<hr>

练习4
输入年份：<input type="number" id="year">
<button id="btn">查看是否是闰年</button>
1
2
3
4
5
6
7
8
9

body外的内容

练习1
let score =80;
if(score==100){
    console.log('奖励一个对象');
}else if(score>=90){
    console.log('优秀');
}else if(score>=80){
    console.log('良好');
}else if(score>=70){
    console.log('中等');
}
else if(score>=60){
    console.log('及格');
}
else{
    console.log('开除学籍');
}

练习2
if(3>4){
  console.log('周末出去玩');
}else{
  console.log('周末不出去玩');
}
3>4 ? console.log('周末出去玩') : console.log('周末不出去玩');

练习3
//判断数据1 数据2 谁大
let bijiao = document.getElementById('bijiao');
let num1 = document.getElementById('num1');
let num2 = document.getElementById('num2');
bijiao.onclick = function(){
    let k1 = num1.value-0;
    let k2 = num2.value-0;
    if(k1>k2){
        alert(k1+'的值大于'+k2);
    }else if(k1==k2){
        alert(k1+'的值等于'+k2);
    }
    else{
        alert(k1+'的值小于'+k2);
    };
};

练习4
// 判断是否闰年
let btn = document.getElementById('btn');
let year = document.getElementById('year');
btn.onclick = function(){
  let num = year.value-0;
  if(num%4==0 && num%100!=0 || num%400==0 ){
       alert(num+'是闰年')
   }
   else{
       alert(num+'不是闰年')
   }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57

js中的循环

1.for 循环
2.while
3.do-while

for循环

for(循环变量的初始值; 循环条件; 循环变量的增值){
循环体，就是循环要执行的代码
}
对循环条件的理解，是变量满足循环条件的时候，才会执行 循环体 中的代码
只有循环结束， 循环后面的代码才能执行

执行过程

1.首先判断循环变量的初始值，是否满足循环条件
2.如果满足循环条件，则执行循环体中的代码
3.循环体中代码执行完毕，然后执行循环变量的增值操作
4.判断循环变量的当前值，是否满足循环条件
5.在下一次循环中，一次执行 2 3 4 步骤
6.直到循环变量的当前值 不满足 循环条件，跳出当前循环

continue 当在循环体中执行 continue 之后，他后面的所有代码都不执行，直接跳出当前循环，执行下一次循环

break 当在循环体中执行break之后，直接终止当前for循环

let i;
for(i=0;i<5;i++){
   console.log(i);
}
console.log('世上无难事只怕有心人'+i);

//求1-100 的偶数和，包含1 和100
let sum=0;
for(let a = 0; a<=100; a+=2){
   sum +=a;
}
console.log(sum);
//1-100 的偶数和
let sum1=0;
for(let n=1;n<=100;n++){
   if(n%2==0){
       sum1+=n;
   }
}
console.log(sum1);

//1-100中，所有3的倍数
let sum3=0;
for(let n=1;n<=100;n++){
   if(n%3==0){
       sum3+=n;
   }
}
console.log(sum3);

//continue
for (let m=0 ;m<5;m++){
   if (m%2==0) {
       continue;//跳出本次循环 进行下次循环
   };
   console.log(m);
};
//break
for (let m = 0; m <10; m++){
   if (m%3==0) {
       break; //终止当前for循环  
   };
};
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43

switch 语句

特点
默认贯穿整个结构，可以使用关键字 break 阻止贯穿
break 的作用是阻断当前结构语句，可以阻断switch,也可以阻断循环

let count = 70;
switch (count) {
 case 30:
     console.log('天涯何处觅知音');
     break; //阻断switch 语句，跳出switch
 case 170:
     console.log('一曲肝肠断');
     break;
 //如果上面的条件都不能满足，则会执行default中的代码
 default:
     console.log('天涯何处无芳草+default');
     break;
}
输出为：天涯何处无芳草+default

let num = 1;
switch (num) {
 case 1:
     console.log('当前是1');
     num++
     // break;
 case 2:
 console.log('当前是2');
     num++;
     break;
 default:
     num--;
     console.log('当前是default');
     break;
}
console.log(num);
运行结果是
当前是1
当前是2
3
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35