WEB前端

Javascript流程控制if...else if

位置:首页 > WEB前端 > js教程,2018-01-09 11:59
1.条件语句  (1)if(exp)执行一句代码  (2)if(exp){执行代码段;}  (3)if(exp){exp为true执行代码段}else{exp为

1.条件语句

  (1)if(exp)执行一句代码

  (2)if(exp){执行代码段;}

  (3)if(exp){exp为true执行代码段}else{exp为false执行的代码段}

  (4)if...else if...

  (5)if嵌套

2.循环语句

  (1)for 循环

  (2)while 循环

  (3)do/while循环

3.特殊循环控制

  (1)break 终止循环

  (2)continue 跳过循环

下面就是具体详情:

  for循环

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <h3>for循环</h3>
    <p>for(exp1;exp2;exp3;){循环体;}</p>
    <p>exp1:无条件执行第一个语句</p>
    <p>exp2:判断是欧服可以执行循环体的条件</p>
    <p>exp3:做增量的操作</p>
    <script>
        for(var i=0;i<4;i++){
            document.write(i+'hello world <br />')
        }
        // 循环i++,i循环三次,每次输出第几次+hello world
    </script>
    <p>通过break结束循环</p>
    <script>
        for(var i=0;i<=6;i++){
            if(i>5){
                break;
            }
            document.write(i+'<br/>');
        }//循环for语句每次输出1个i值,当i>5时停止输出
    </script>
    <p>通过continue跳过档次循环</p>
    <script>
        for(var i=1;i<=6;i++){
            if(i==5){
                continue;
            }
            document.write(i+'<br />')
        }//循环for语句,每次输出1个i值,的那个i=5时跳过本次循环进入下次循环。
    </script>
</body>
</html>

   for循环嵌套

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <h3>for循环嵌套</h3>
    <script>
        for(var i=1;i<=3;i++){
            for (var k=1;k<=2;k++){
                document.write(k);
            }
            document.write(i+'<br>');
        }
    </script>
</body>
</html>

  条件语句

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <h3>条件语句</h3>
    <p>假如3>=11 输出a;否则输出b</p>
    <script>
        if(3>=11){
            document.write('a');
        }else{
            document.write('b');
        }
    </script>
    <p>定义a=1,判断a是否全等于2,若全等则输出2;若不全等则判断a是否全等于3,若全等则输出3;若不全等则判断a是否全等于1,若全等则输出1</p>
    <script>
        var a=1;
        if(a==2){
            document.write(2);
        }else if(a==3){
            document.write(3);
        }else if(a==1){
            document.write(1);
        }
    </script>
</body>
</html>

  switch循环

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <h3>switch循环</h3>
    <p>switch循环若是没有找到指定值则一直比较,当找到指定值是执行后边所有代码,所以在swith循环中每个值的代码段最后要写break</p>
    <p>没加break前</p>
    <script>
        var i=3;
        switch(i){
            case 1:document.write('a<br />');
            case 2:document.write('b<br />');
            case 3:document.write('c<br />');
            case 4:document.write('d<br />');
        }//因为我们在这里没有加入break所以说当找到i=3时后执行后边所有代码
    </script>
    <p>加break后</p>
    <script>
        switch(i){
            case 1:document.write('a<br />');break;
            case 2:document.write('b<br />');break;
            case 3:document.write('c<br />');break;
            case 4:document.write('d<br />');break;
        }
    </script>
</body>
</html>

  while循环

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <h3>while循环</h3>
    <script>
        var i=0;
        while(i<=5){
            i++;
            document.write(i+'<br />');
        }//若i<5则执行i++并输出i值
    </script>
</body>
</html>

  do/while循环

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <h3>do/while循环</h3>
    <script>
        var x=0;
        do{
            x++;
            document.write('第'+x+'次X的值为:'+x+'<br>')
        }
        while (x<4);
        document.write('最终X的值为:'+x+'<br />')
        //当x<4时执行每次输出第几次的x的值,
    </script>
</body>
</html>

TAGS:javascriptjavascript入门javascript流程控制

猜你喜欢

NewHot