向JS基础知识进攻 2_js 一条一条执行-CSDN博客

本文链接：https://blog.csdn.net/GJ_straysoul/article/details/128239113

运算符的优先级

在运算符优先级表中越靠上优先级越高，优先计算如果优先级一样则从左往右计算可以通过（）改变优先级
在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var a=1,b=2,c=3;
        alter(b);

        //var result = 1+2*3;
        var result = 1 || 2 && 3;
        console.log("result = "+result);
    </script>
</head>
<body>
    
</body>
</html>

代码块

程序由一条条语句构成语句按照自上而下的顺序一条条执行
在JS中可以使用{}来为语句进行分组
同一个{}内的语句称为一组语句,同一组语句要么都执行，要么都不执行
一个{}内的语句称作一个代码块
代码块后面不写分号
JS中代码块只有分组的作用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    {
        var a = 10;
        alert("hello");
        alter("hello");
        console.log("你好");
        document.write("语句");
    }
</head>
<body>
    
</body>
</html>

流程控制语句

1.条件判断语句

使用条件判断语句可以在执行某个语句之前进行判断，条件成立则执行语句，不成立则不执行

if语句

语法一：

if（条件表达式）
{
语句……
}

    <script>
        var a=10;
        if(a=10)
        alert("1");//执行
        alert("2");//不会执行
        // if语句只能控制紧随其后的语句
        if(a>10)
        {
            alert("1")
            alert("2")
        }
    </script>

语法二：

if（条件表达式）
{
语句……
}
else{语句…}

        if(a>10)
        {
            alert("1");
        }
        else
        {
            alert("2");
        }
        //返回2

语法三：

if（条件表达式）
{
语句……
}
else if（条件表达式）{语句}
else if（条件表达式）{语句}
…

        var a=10;
        if(a>10)
        {
            alert("1");
        }
        else
        {
            alert("2");
        }

        if (a>11) {
            alert("1");
        }
        else if (a>5) {
            alert("2");
        }
        else if(a>2)
        {
            alert("3");
        }
        //返回2，三条件成立但不再执行

练习：
prompt（）可以弹出一个提示框，该提示框会带有有个文本框，用户可以在文本框中输入一段内容，该函数需要一个字符串作为参数，用户输入的内容会作为返回值（string类型），可以定义一个变量来接受该内容

var score=prompt("");

//判断三个数的大小
        var a=+prompt("第1个数：");
        var b=+prompt("第2个数：");
        var c=+prompt("第3个数：");
        if (a<b&&a<c) {
            if (b>c) {
                alert("a"+"b"+"");
            }
            else{
                alert("a"+"b"+"c");
            }
        }
        if (b<a&&b<c) {
            if (a>c) {
                alert("b"+"c"+"a");
            }
            else{
                alert("b"+"a"+"c");
            }
        }
        if (c<a&&c<b) {
            if (a>b) {
                alert("c"+"b"+"a");
            }
            else{
                alert("c"+"a"+"b");
            }
        }

2.条件分支

Switch语句

switch (条件表达式) {
case :
语句
break;
case :
语句
break;
case :
语句
break;
case :
语句
break;
default:
break; }

执行流程：
依次将Switch后的值与case进行全等比较；结果为true则从对应case语句开始执行，当前case后的所有语句都会被执行，false则不执行


        num=2;
        switch (num) {
            case 1:
                console.log("1");
            case 2:
                console.log("2");
            case 3:
                console.log("3");
                // 返回值为23
        
            default:
                break;
        }
   
    ```
    使用break可以退出Switch语句
```javascript
       num=2;
        switch (num) {
            case 1:
                console.log("1");
                break;
            case 2:
                console.log("2");
                break;
            case 3:
                console.log("3");
                break;
                // 返回值为2

3.循环语句

while语句

while（条件表达式）
{
语句
}

先判断再执行
while语句在执行时候，先对条件表达式求值判断，如果值为true，则执行循环体，当条件不满足时候，终止循环。
（注：while先判断后执行，do while先执行后判断，do while保证循环体至少执行一次）

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        /*var n = 1;
        document.write(n++ +"<br />");*/

        while(true)
            {
                alert(n++);

                //判断n是否为10
                if(n == 10);
                break;
            }

        var i = 0;
        while(i < 10)
            {
                alert(i);
                //i++;
                document.write(n++ +"<br />");
            }
    </script>
</head>
<body>
    
</body>
</html>

循环内部可以嵌套其他循环

do…while循环

do {
语句
} while (condition);

先执行再判断
do…whil循环在执行时候会先执行循环体，循环体执行完毕后对条件表达式判定
ture则继续执行循环体
false则结束循环

3.for循环

for (初始化表达式；条件表达式；更新表达式)
{
语句
}

执行流程
1、执行初始化表达式，初始化变量
2、执行条件表达式，判断是否执行循环，值为true则执行循环，值为false，终止循环
3、执行更新表达式，更新表达式执行完毕继续重复流程2

for循环中三个部分都可以省略，也可以写在外部
如果for循环中不写任何表达式，只写两个；则为一个死循环，慎用

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var i = 0;
        while(i < 10)
            {
                alert(i++);
            }

        for(var i = 0; i < 10; i++)
            {
                alert(i);
            }
        </script>
</head>
<body>
    
</body>
</html>

嵌套的for循环

//for循环中三个部分都可以省略，也可以写在外部，如果在for循环中不写任何形式，此时循环式是一个死循环
        for(;;)
        {
            alert("1");
        }

九九乘法表

 <script>

        for (var i = 1; i <= 9 ; i++) {
            for (var j = 1; j <= i ; j++) {
                document.write(i +"*"+ j + "=" + (i*j) +"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp");
            }
            //输出换行
            document.write( "<br>");
        }
    </script>

4.break和continue

break
退出switch或循环语句（不能在if中使用break和continue）
会立即终止离他最近的那个循环
label：循环语句
使用break语句时，可以在break后跟着一个label，这样break会结束指定的循环，而不是最近的

continue
跳过当次循环，默认是对离他最近的循环起作用

5.计时器

console.time(" “);可以用来开启一个计时器，他需要将一个字符串作为参数，这个字符串将会作为计时器的标识
console.timeEnd(” ");用来停止一个计时器，需要一个计时器的名字作为参数

        console.time("test");
        主体内容
        console.timeEnd("test");