博客列表 >JavaScript基本语法-流程控制(IF-Switch)、for循环、while循环

JavaScript基本语法-流程控制(IF-Switch)、for循环、while循环

楚Chen
楚Chen原创
2019年07月16日 17:08:06908浏览

JavaScript流程控制

流程控制-IF

实例

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <script type="text/javascript">
        var x = 1;
        if (x == 1) {
            var s = "今天星期一";
        } else if (x == 2) {
            var s = "今天星期二";
        } else if (x == 3) {
            var s = "今天星期三";
        } else if (x == 4) {
            var s = "今天星期四";
        } else if (x == 5) {
            var s = "今天星期五";
        } else if (x == 6) {
            var s = "今天星期六";
        } else if (x == 7) {
            var s = "今天星期日";
        } else {
            var s = "你的输入有误";
        }
        console.log(s);       
    </script>
</body>

</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

流程控制,if语句单分支
 if (条件判断语句) {
       循环代码
 }

单分支通过条件判断语句,如果结果为true就执行循环体内的代码。返回false就退出循环

分支

 if (条件判断语句) {
       .......
 }else{

    ........

}

双分支通过条件判断语句,如果结果为true就执行第一个段代码。返回false就执行else后面的代码

多分支

 if (条件判断语句) {
       ......
 }else if{

    ........

}else{

    ..........

}

多分支可以有多条条件判断,如果第一个条件返回true,则执行第一段代码。然后退出循环

第一个条件返回false,则继续向下执行第二条条件判断语句........如果所有条件都为false就执行else后面的代码

流程控制-Switch

对于if的多分支语法,也可以使用switch来实现

实例

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <script type="text/javascript">
     
        //使用 switch 重写上面小案例
        switch (true) {
            case x == 1:
                var s = "今天星期一";
                break;
            case x == 2:
                var s = "今天星期二";
                break;
            case x == 3:
                var s = "今天星期三";
                break;
            case x == 4:
                var s = "今天星期四";
                break;
            case x == 5:
                var s = "今天星期五";
                break;
            case x == 6:
                var s = "今天星期六";
                break;
            case x == 7:
                var s = "今天星期日";
                break;
            default:
                var s = "输入错误参数";
                break;
        }
        
        console.log(s);
      
    </script>
</body>

</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

switch(true) {

    case    条件判断;

        执行代码;

        break;    跳出循环

    

    case    条件判断2;

        执行代码;

        break;    跳出循环

    efault:
         如果都返回false要执行的代码;
         break;

}

JavaScript循环

for循环

实例

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <script type="text/javascript">
        //循环
        // For循环
        for ( x ; x <= 7; x++) {
            
            console.log("今天星期"+x+"<br>"+"<hr>");
            
        }  
    </script>
</body>

</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

for循环语句

for (初始化; 循环条件; 更新条件){

循环体

}

while循环

实例

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <script type="text/javascript">
      
        //使用 While 循环重写上面小案例
        x = 1;
        while ( x<=7) {
            console.log("今天星期"+x+"<br>"+"<br>");
            x++;
        }       
    </script>
</body>

</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

while循环语句

while (条件判断) {

    执行代码

i++;    // 更新条件

}



声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议