zoukankan      html  css  js  c++  java
  • WEB前端第二十四课——js流程控制

    1.分支语句

      分支结构的执行是依据一定的执行条件选择路径,而不是严格按照语句出现的物理顺序执行

      分支结构程序设计的关键在于构造合适的分支条件和分析程序流程,根据不同的流程选择适当的分支语句

    2.常用分支语句

      ① if,先判断条件表达式的布尔值,然后根据结果的真伪选择执行不同的语句

        书写格式:if(条件表达式){

              判结果为真时执行语句;

             }

        表达式必须放在小括号内,执行语句必须放在大括号内

        条件表达式后不加分号,如果执行语句只有一句,则大括号可以不写,但建议所有情况都使用大括号

      ② if else,是 if语句的升级版本,如果判断条件表达式结果为真则执行语句1,如果判断条件表达式结果为假则执行语句2

        书写格式:if(条件表达式){

              结果为真时执行语句1;

             }else{

              结果为假时执行语句2;

             }

      ③ if  else if  else,需要对一个变量进行多次条件判断时,可以使用此分支结构,是 if else结构的嵌套形式

        书写格式:if(条件表达式1){

              表达式1结果为真时执行语句1;

             }else if(条件表达式2){

              表达式2结果为真时执行语句2;

             }……

             else{

              前面表达式结果为假时执行语句n;

             }

        else语句不能单独存在,总是向上匹配离它最近的 if 语句

      ④ switch,与 if  else if  else结构表达含义类似

        书写格式:switch(表达式){

              case"情况1":{执行语句1};

                break;

              case"情况2":{执行语句2};

                break;

               … …

              default:{执行语句n}

             }

    3.循环语句

      有循环体和循环终止条件两部分组成

      常用循环语句:

        ① while,包含一个循环条件和一段代码块,事先不确定循环次数,只要条件为真就重复执行代码块,直到条件为假时终止

          语法格式:while(条件表达式){

                条件为真时执行的语句;

                变量增减;

               }

        while循环注意事项:

          由于while循环是先判断循环条件,因此while循环的最少执行次数是 0次

          while循环之所以能够结束,是因为每次循环执行的过程中都会改变循环变量

          执行while循环之前,必须给循环变量设置初始值

          与if语句一样,如果while循环体中只有一条语句,那么大括号可以不加,但不推荐

          while循环结构末尾不需要加分号

          循环条件恒成立的循环被称作死循环

        ② do while,与while循环结构基本相同,不同的是do while循环是先执行循环体再进行条件判断

          语法格式:do{

                执行语句;

               }while(条件表达式)

        ③ for,包括标准 for循环和 快速遍历(增强for)两种,通常意义上的 for循环指的是标准 for循环

    4.标准for循环:

          语法格式:for(表达式1;表达式2;表达式3){

                循环体语句;

               }

          代码示例:

          for(var num=0;num<10;num++){

            console.log(num);

          }

          上述代码试译:

            首先执行表达式1,声明num变量并进行初始化赋值;

            然后执行表达式2进行判断,结果为真则执行循环体,否则跳出循环;

            当表达式2为真,且循环体执行完一次后,执行表达式3,然后重复第二步。

          注意事项:

            for循环表达式1可以不写,如果不写,则需要在循环结构外声明变量并初始化赋值

            for循环表达式2可以不写,如果不写,则循环条件恒成立,为死循环

            for循环表达式3可以不写,如果不写,则需要在循环结构内部为循环变量改变设置条件

            示例:

              var num=0;

              for(;num<10;){

                console.log(num);

                num++;

              }

          归纳:根据以上所述,for 循环的三个条件表达式都可以不写,但括号中的分号不能省略!

    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>斐波那契数列</title>
    </head>
    <body>
    
    <script>
        var num1=1
        var num2=1
        document.write(num1+"<br/>");
        document.write(num2+"<br/>");
        for (var i=1;i<=10;i++){
            var num3=num2+num1;
            num1 = num2;
            num2 = num3;
            document.write(num3+"<br/>")
        }
    </script>
    </body>
    </html>
    

    5.快速遍历(增强for):

          是一种苦熬苏浏览容器内元素的手段,不论容器内有多少元素,一定都能循环一遍

          语法格式:for(var 变量名 in 容器){

                循环体;

               }

          示例:

            var arr=[1,2,3,4,5,6];

            for(var num in arr){

              console.log(arr[num]);

            }

          代码释意:创建一个局部变量 num,从数组 arr逐个取出每个元素下标赋值给 num,并打印这个元素的值

    6.循环的嵌套使用

      循环和条件语句可以进行嵌套使用,从而进行复杂的逻辑处理

      代码示例:

        for(var num=0;num<100;num++){

          if(num%5==0){

            console.log(num);

          }

        }

        for(var i=0;i<10;i++){

          for(var j=0;j<10;j++){

            document.write(i*j);

          }

        }

    7.循环嵌套代码实例:

    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>九九乘法表</title>
    </head>
    <body>
    
        <script>
            for (var i=1;i<10;i++){
                for (var j=1;j<=i;j++){
                    document.write(j+"*"+i+"="+j*i+"&nbsp"+"&nbsp");
                }
                document.write("<br/>")
            }
        </script>
    </body>
    </html>
    
    <title>等腰三角形</title>
    
    //实现方式一
    <script>
        var res="";
        for (var i=1;i<=5;i++){
            var blank="";
            for (var j=1;j<=5-i;j++){
                blank+=" ";
            }
            var star="";
            for (var k=1;k<2*i;k++){
                star+="*";
            }
            res+=blank+star+"
    ";
        }
        console.log(res)
    </script>
    
    //实现方式二
    <script>
        for (var i=1;i<=5;i++){
            for (var j=1;j<=5-i;j++){
                document.write("&nbsp");
            }
            for (var k=1;k<2*i;k++){
                document.write("*");
            }
            document.write("<br/>");
        }
    </script>
    
    //100以内奇数和偶数求和
    <script>
        var sum_even=0;
        var sum_odd=0;
    //for循环
        for (var i=1;i<=100;i++){
            if (i%2==0){
                sum_even+=i;
            }
            if (i%2!=0){
                sum_odd+=i;
            }
        }
        document.write("for循环运算:"+"<br/>");
        document.write(sum_even+"<br/>");
        document.write(sum_odd+"<hr/>");
    
    // while循环
        while (i<=100&& i%2==0){
            sum_even+=i;
        }
        while (i<=100&& i%2!=0){
            sum_odd+=i;
        }
        document.write("while循环运算:"+"<br/>");
        document.write(sum_even+"<br/>");
        document.write(sum_odd);
    </script>
    

    8.break和continue语句

      break语句用于跳出整个循环语句,循环终止不再执行

      continue语句用于终止本轮循环,返回循环头部,继续执行下一轮循环,整个循环不终止

  • 相关阅读:
    架构设计的UML图形思考
    SymmetricDS文档翻译--【Chapter 3. 具体配置(Configuration)[section C]】
    LeetCodeOJ. String to Integer (atoi)
    jquery05 继承
    jquery 04
    jquery constructor(null)
    jquery js解析函数、函数直接调用
    jquery init 关系
    jquery constructor
    jQuery03
  • 原文地址:https://www.cnblogs.com/husa/p/13511104.html
Copyright © 2011-2022 走看看