JavaScript 3—语句

代码块

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
        /*
           我们的程序是由一条一条语句构成的
            语句是按照自，上向下的顺序一-条一条执行的
            在IS中可以使用{ }来为语句进行分组,
                同一个{}中的语句我们称为是一组语句，
                它们要么都执行，要么都不执行，
                一个{ }中的语句我们也称为叫一个代码块
                在代码块的后边就不用再编写;了

            JS中的代码块，只具有分组的的作用，没有其他的用途
        */
        {
            alert("hello");
            console.log("你好");
            document.write("语句");
        }
    </script>
</head>

<body>
</body>

</html>

 if语句

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
        /*
           我们的程序是由一条一条语句构成的
            语句是按照自，上向下的顺序一-条一条执行的
            在IS中可以使用{ }来为语句进行分组,
                同一个{}中的语句我们称为是一组语句，
                它们要么都执行，要么都不执行，
                一个{ }中的语句我们也称为叫一个代码块
                在代码块的后边就不用再编写;了
        */
        {
            alert("hello");
            console.log("你好");
            document.write("语句");
        }
        /*    JS中的代码块，只具有分组的的作用，没有其他的用途
            JS中的程序是从上到下一行一行执行的
            通过流程控制语句可以控制程序执行流程，
                使程序可以根据- -定的条件来选择执行
            语句的分类:
                1.条件判断语句
                2.条件分支语句
                3.循环语句

            使用条件判断语句可以在执行某个语句之前进行判断，
            如果条件成立才会执行语句，条件不成立则语句不执行。
            if语句
                语法一:
                if(条件表达式)
                    语句
                if语句在执行时，会先对条件表达式进行求值判断，
                如果条件表达式的值为true,则执行if后的语句，
                如果条件表达式的值为false,则不会执行if后的语句。
                    if语句只能控制紧随其后的那个语句，
                        如果希望if语句可以控制多条语句,
                        可以将这些语句统一放到代码块中
                    if语句后的代码块不是必须的，但是在开发中尽量写上代码块，即使if后只有一条语句
                语法二:
                    if(条件表达式){
                        语句.. .
                    }else{
                        语句.. .
                    }
                    if...else.. .语句
                        当该语句执行时，会先对if后的条件表达式进行求值判断，
                            如果该值为true,则执行if后的语句
                            如果该值为false,则执行else后的语句

                语法三:
                    if(条件表达式){
                        语句...
                    }else if(条件表达式){
                        语句...
                    }else if(条件表达式){
                        语句...
                    }else{
                        语句...
                    }
                    if.. .else if.. .else 
                        当该语句执行时，会从上到下依次对条件表达式进行求值判断
                            如果值为true,则执行当前语句。
                            如果佰为false,则蛛续向下判断
                        如果所有的条件都不满足，则执行最后一个else后的语句
                    该语句中，只会有一个代码块被执行，一旦代码块执行了，则直接结束语句

        */
        var a = 11;
        if (a > 10) {
            alert("a比10大~~~~");
            alert("谁也管不了我~~~");
        }
        if (a >= 10 && a <= 20) {
            alert("a大于10且a小于等于20");
        }

        var age = 50;
        if (age >= 60) {
            alert("你已经退休了~~");
        } else {
            alert("你还没退休~~~");
        }

        /*
            prompt()可以弹出一个提示框，该提示框中会带有一个文本框，
            用户可以在文本框中输入一段内容，该函数需要-一个字 符串作为参数，
            该字符串将会作为提示框的提示文字

            用户输入的内容将会作为函数的返回值返回，可以定义一个变量来接收该内容
            prompt()函数的返回值是String类型的
        */

        age = +prompt("请输入小明的年龄：");
        if (age > 100) {
            alert("活着挺没意思的~~");
        } else if (age > 80) {
            alert("你也老大不小的了~~");
        } else if (age > 60) {
            alert("你也退休了~~");
        } else if (age > 30) {
            alert("你已经中年了~~");
        } else {
            alert("你还是个小孩~~");
        }
    </script>
</head>

<body>
</body>

</html>

条件分支语句

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
        /*
            条件分支语句也叫switch语句
            语法:
                switch(条件表达式){
                    case 表达式:
                        语句...
                        break;
                    case 表达式:
                        语句...
                        break;
                    case 表达式:
                        语句...
                        break;
                    case 表达式:
                        语句...
                        break;
                    case 表达式:
                        语句...
                        break;
                }
            执行流程：
                switch...case...语句
                在执行时会一次将case后的表达式的值和switch后的条件表达式的值进行全等比较
                    如果比较结果为true,则从当前case处开始执行代码。
                        当前case后的所有的代码都会执行，我们可以在case的后边跟着一个break关键字，
                        这样可以确保只会执行当前case后的语句，而不会执行其他的case
                    如果比较结果为false,则继续向下比较
                        如果所有的比较结果都为false,则只执行default后的语句
        */

        //根据num的值，输出对应的中文

        switch (num) {
            case 1:
                console.log("一");
                //使用break可以来退出switch语句
                break;
            case 2:
                console.log("二");
                break;
            case 3:
                console.log("三");
                break;
            default:
                console.log("非法数字");
                break;
        }

        var score = prompt("请输入你的成绩");
        switch (perseInt(score / 10)) {
            case 6:
                console.log("及格了");
                break;
            case 7:
                console.log("嗯");
                break;
            case 8:
                console.log("还好");
                break;
            default:
                console.log("好");
                break;
        }

        switch (true) {
            case score >= 80:
                console.log("好");
                break;
            case score >= 70:
                console.log("ok");
                break;
            case score >= 60:
                console.log("及格了");
                break;
            default:
                console.log("你完了");
                break;
        }
    </script>
</head>

<body>
</body>

</html>

 while循环语句

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
        /*
            向页面中输出连续的数字
        */
        // document.write(1 + "<br />");
        // document.write(2 + "<br />");
        // document.write(3 + "<br />");
        // document.write(4 + "<br />");

        /*
            循环语句:
                通过循环语句可以反复的执行一段代码多次

            while循环
                语法:
                    while(条件表达式){
                        语句...
                    }
            while语句在执行时，
                先对条件表达式进行求值判断，
                    如果值为true,则执行循环体，
                        循环体执行完毕以后，继续对表达式进行判断
                        如果为true,则继续执行循环体，以此类推
                    如果值为false,则终止循环

            do.. . while循环
            语法:
            do{
                语句...
            }while(条件表达式)
            执行流程:
                do...while语句在执行时，会先执行循环体，
                    循环体执行完毕以后，在对while后的条件表达式进行判断，
                    如果结果为true,则继续执行循环体，执行完毕继续判断以此类推
                    如果结果为false,则终止循环

            实际上这两个语句功能类似，不同的是while是先判断后执行，
                而do...while会先执行后判断
            do...while可以保证循环体至少执行一次，
                而while不能

        */

        //向这种将条件表达式写死为true的循环，叫做死循环
        //该循环不会停止，除非浏览器关闭，死循环在开发中慎用
        //可以使用break,来终止循环

        while (true) {
            alert(n++);
            //判断n是否是10
            if (n
                == 10) {
                //退出循环
                break;
            }

        }

        //创建-一个循环，往往需要三个步骤
        //1.创初始化一个变量
        var i = 0;
        //2. 在循环中设置一个条件表达式
        while (i < 10) {
            //3.定义一个更新表达式，每次更新初始化变量
            document.write(i++ + "<br />");
        }

        do {
            document.write(i++ + "<br />");
        } while (i <= 5000)

    </script>
</head>

<body>
</body>

</html>

 for语句

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">

        /*
            for语句，也是一个循环语句，也称为for循环
                在for循环中，为我们提供了专门的位置用来放三个表达式:
                    1.初始化表达式
                    2.条件表达式
                    3.更新表达式
            for循环的语法:
                for(①初始化表达式;②条件表达式;④更新表达式){
                    ③语句...
                }

            for循环的执行流程:
                ①执行初始化表达式，初始化变量(初始化限达式只会执行一次)
                ②执行条件表达式，判断是否执行循环。
                    如果为true,则执行循环③
                    如果为false,终止循环
                ④执行更新表达式，更新表达式执行完毕继续重复②

        */

        //创建一个执行10次的while循环
        //初始化表达式
        /*var i = 0;
        //创建一个循环，定义条件表达式
        while(i < 10){
            //设置更新表达式
            alert(i++);
        }*/

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

        /*
            for循环中的三个部分都可以省略， 也可以写在外部
                如果在for循环中不写任何的表达式，只写两个;
                此时循环是一个死循环会一直执行，慎用


        */
        for (; ;) {
            alert("hello");
        }


        //获取i的百位十位个位的数字
        //获取百位数字
        var bai = parseInt(i / 100);
        //获取十位的数字
        var shi = parseInt((i - bai * 100) / 10);
        //获取个位数字
        var ge = i % 10;

    </script>
</head>

<body>
</body>

</html>

 判断是不是质数

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
        /*
            在页面中接收一个用户输入的数字，并判断该数是否是质数。
            质数:只能被1和它自身整除的数，1不是质数也不是合数，质数必须是大于1的自然数。
        */
        var num = prompt("请输入一个大于1的整数:");
        //判断这个值是否合法
        if (num <= 1) {
            alert("该值不合法! ");
        } else {
            //创建一个变量来保存当前的数的状态
            //默认当前num是质数
            var flag = true;

            //判断num是否是质数
            //获取2- num之间的数
            for (var i = 2; i < num; i++) {
                //console.log(i);
                //判断num是否能被i整除
                if (num % i == 0) {
                    //如果num能被i整除，则说明num一定不是质数
                    //设置flag为false
                    flag = false;
                }
            }
            //如果num是质数则输出
            if (flag) {
                alert(num + "是质数! ! ! ");
            } else {
                alert("这个不是质数")
            }
        }


        console.time("test");
        //打印2-10000之间所有的质数
        for (var i = 2; i <= 10000; i++) {
            var flag = true;
            //可以通过Math.sqrt()对一个数进行开方
            for (var j = 2; j <= Math.sqrt(i); j++) {
                if (i % j == 0) {
                    //如果进入判断则证明i不是质数，修改flag值为false
                    flag = false;
                    //一旦进入判断，则证明i不可能是质数了，此时循环再执行已经没有任何意义
                    //使用break来结束循环
                    break;
                    //不加break 215ms
                    //加break 25ms
                    //修改j<=后2.6ms
                }
            }
            //如果是质数，则打印i的值
            if (flag) {
                console.log(i);
            }
        }
        console.timeEnd("test");
    </script>
</head>

<body>
</body>

</html>

 

 for循环嵌套

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
        /*
           通过程序，在页面中输出如下的图形:
            *
            **
            *** 
            ****
            *****
        */
        //通过一个for循环来输出图形
        //这个for循环执行几次，图形的高度就是多少
        //它可以用来控制图形的高度
        for (var i = 0; i < 5; i++) {
            /*
                在循环的内部再创建-一个循环，用来控制图形的宽度
                目前我们的外部的for循环执行1次，内部的就会执行5次
                内层循环可以来决定图形的宽度，执行几次图形的宽度就是多少
            */
            for (var j = 0; j <= i; j++) {
                document.write("*");
            }
            //输出一个换行
            document.write("<br />");
        }

        /*
            1.打印99乘法表
            1*1=1
            1*2=2 2*2=4
            1*3=3 2*3=6 3*3=9
            1*4=4 2*4=8 3*4=12 4*4=16
                            ....9*9=81
        */
        for (var i = 1; i <= 9; i++) {
            //创建-一个内层循环来控制图形的宽度
            for (var j = 1; j <= i; j++) {
                document.write("<span>" + j + "*" + i + "=" + i * j + "</span>")
            }
            //输出一个换行
            document.write("<br />");
        }

    </script>

    <style type="text/css">
        body{
            width: 2000px;
        }
        span{
            display: inline-block;
            width: 80px;
        }
    </style>
</head>

<body>
</body>

</html>

 break和continue

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
        /*
            break关键字可以用来退出switch或循环语句
                不能在if语句中使用break和continue
            break关键字，会立即终止离他最近的那个循环语句
        */
        /*
            for(var i=0 ; i<5 ; i++){
                console.1og(i);
                if(i == 2){
                    break;
                }
            }
        */
        /*
            可以为循环语句创建一个label, 来标识当前的循环
                label:循环语句
            使用break语句时，可以在break后跟着一个label,
            这样break将会结束指定的循环，而不是最近的
        */
        outer:
        for (var i = 0; i < 5; i++) {
            console.log("@外层循环" + i);
            for (var j = 0; j < 5; j++) {
                break outer;
                console.log("内层循环:" + j);
            }
        }

        /*
            continue关键字可以用来跳过当次循环
            同样continue也是默认只会对离他最近的循环循环起作用

        */

        //测试如下的程序的性能
        //在程序执行前，开启计时器
        //console. time ( "计时器的名字" )可以用来开启一个计时器
        //它需要一个字符串作为参数，这个字符串将会作为计时器的标识
        console.time("test");
        out:
        for (var i = 0; i < 5; i++) {
            for (var j = 0; j < 5; j++) {
                console.log("-->" + j);
                continue out;
            }
        }
        //终止计时器
        //console.timeEnd( )用来停止-一个计时器，需要一个计时器的名字作为参数
        console.timeEnd("test");

    </script>

    <style type="text/css">
    </style>
</head>

<body>
</body>

</html>

 

posted @ 2020-07-23 19:40  我等着你  阅读(148)  评论(0)    收藏  举报