JavaScript基础&实战知识点记录及个人理解2

最新推荐文章于 2024-06-10 22:18:41 发布

Verfall975

最新推荐文章于 2024-06-10 22:18:41 发布

阅读量157

点赞数

文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/qq_72453861/article/details/128175224

版权

JavaScript基础&实战知识点记录（26-45集）

第二十六集-运算符的优先级
第二十七集-代码块
第二十八、二十九、三十、三十一、三十二集-if语句
第三十三、三十四集-条件分支语句
- 练习
第三十五集-while循环
- 练习
第三十六-四十三集-for循环
第四十四、四十五集-break和continue
- 质数练习的改进

第二十六集-运算符的优先级

,运算符：使用,可以分割多个语句，一般可以在声明多个变量时使用,（使用,运算符同时声明多个变量并赋值）；在表中越靠上优先级越高，如果优先级一样，则从左往右计算；可以用()改变优先级
JS中运算符也有优先级：先乘除，后加减；

第二十七集-代码块

语句statement，从上至下一条一条执行，在JS中可以用{}进行分组，要么都执行，要么都不执行，一个{}中的语句我们也称为叫一个代码块，在代码块的后面不用编写;了
JS中的代码块只有分组的作用，没有其他的用途

第二十八、二十九、三十、三十一、三十二集-if语句

JS中的程序是从上到下一行一行执行的
通过流程控制语句可以控制程序执行流程，使程序可以根据一定的条件来选择执行：条件判断语句，条件分支语句，循环语句
使用条件判断语句可以在执行某个语句之前进行判断
如果条件成立才会执行语句，条件不成立则语句不执行
if语句在执行时，会先对条件表达式进行求值判断
如果条件表达式的值为true，则执行if后的语句；如果条件表达式的值为false，则不会执行if后的语句
if语句只能控制紧随其后的那个语句，如果希望if语句可以控制多条语句，可以将这些语句统一放到代码块中
if…else…语句：当该语句执行时，会先对if后的条件表达式进行求值判断，如果该值为true，则执行if后的语句，如果该值为false，则执行else后的语句
if…else if…else…语句：当该语句执行时，会从上到下依次对条件表达式进行求值判断，如果值为true，则会执行当前语句；如果值为false，则继续向下判断
prompt()：可以弹出一个带文本框的提示框，用户可以在文本框中输入一段内容，该函数需要一个字符串作为参考，该字符串将会成为提示框的提示文字，用户输入的内容将会作为函数的返回值返回，可以定义一个变量来接收该内容

练习1

<!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 type="text/javascript">
    var score=prompt("请输入小明的成绩(0~100)：");
    if(score>=100||score<=0||isNaN(score)){
        alert("不合规成绩")
    }
        else{
        if(score==100){
    alert("奖励一台BMW");
        }
        else if(score>=80){
    alert("奖励一台iphone15s");
        }
        else if(score>=60){
    alert("奖励一本参考书");
        }
        else{
    alert("什么奖励也没有");
        };
    }
    </script>
</head>
<body>

</body>
</html>

练习2

<!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 type="text/javascript">
        var height=prompt("请输入你的身高(cm)");
        var money=prompt("请输入你的财富(万)");
        var face=prompt("请输入你的颜值(PX)");
        if(height>180 && money>1000 && face>500){
            alert("我一定要嫁给他");
        }
        else if(height>180 || money>1000 || face>500){
            alert("嫁吧，比上不足比下有余");
        }
        else{
            alert("不嫁");
        };
    </script>
</head>
<body>

</body>
</html>

练习3

<!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 type="text/javascript">
        var num1 = +prompt("请输入第一个数：");
        var num2 = +prompt("请输入第二个数：");
        var num3 = +prompt("请输入第三个数：");
        if(num1 < num2 && num1 < num3){
            if(num2 < num3){
                alert(num1+","num2+","num3);
            }else{
                alert(num1+","num3+","num2);
            }
        }else if(num2 < num1 && num2 < num3){
            if(num1 < num3){
                alert(num2+","num1+","num3);
            }else{
                alert(num2+","num3+","num1);
            }
        }
        else{
            if(num1 < num2){
                alert(num3+","num1+","num2);
            }else{
                alert(num3+","num2+","num1);
            }
        };
    </script>
</head>
<body>

</body>
</html>

第三十三、三十四集-条件分支语句

执行流程：switch…case…语句，在执行时会依次将case后的表达式的值和switch后的条件表达式的值进行全等比较，如果比较结果为true，则从当前case处开始执行代码；如果比较结果为false，则继续向下比较，使用break可以来退出switc语句。
我们可以在case后面跟着一个break关键字，这样可以确保只会执行当前case后的语句，而不会执行其他的case
如果所有的比较结果都为false，则只执行default后的语句
使用if可以实现switch的功能，使用switch也可一实现if的功能

练习

<!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 type="text/javascript">
    /*var score=60;
    switch(parseint(score/10)){
        case 10:
        case 9:
        case 8:
        case 7:
        case 6:
            console.log("合格");
            break;
        default:
            console.log("不合格");
            break;
    }*/
    switch(true){
        case score >= 60;
            console.log("合格");
            break;
            default:
            console.log("不合格");
            break;
    }
    </script>
</head>
<body>

</body>
</html>

第三十五集-while循环

循环语句：通过循环语句可以反复的执行一段代码多次
while语句在执行是，先对条件表达式进行求值判断，如果值为true，则执行循环体，循环体执行完毕之后，继续对表达式进行判断，如果为true，则继续执行循环体，以此类推，如果值为false，则终止循环，可以使用break来终止循环
将条件表达式写死为true的循环，叫做死循环，这种循环不会停止，除非浏览器关闭，死循环在开发中慎用
创建一个循环，往往需要三个步骤：a.创初始化一个变量；b.在循环中设置一个条件表达式;c.定义一个更新表达式，每次更新初始化变量;
do…while循环执行流程：语句在执行时，会先执行循环体，循环体执行完毕以后，再对while后的条件表达式进行判断，如果为true，则继续执行循环体，如果值为false，则终止循环
两个语句功能类似，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 type="text/javascript">
        var money=1000;
        var count=0;
        while(money<5000){
            money*1.05;
            count++;
        }
    </script>
</head>
<body>

</body>
</html>

第三十六-四十三集-for循环

for循环中，为我们提供了专门的位置用来放三个表达式：a.初始化表达式；b.条件表达式；c.更新表达式
执行初始化表达式，初始化变量；执行条件表达式，判断是否循环，为true则执行循环，为false终止循环；执行更新表达式，更新表达式执行完毕继续重复
for循环中的三个部分都可以省略，也可以写在外面，可以不写任何表达式，只写两个，循环是一个死循环，会一直执行下去，慎用

练习1

<!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 type="text/javascript">
        for(var i=1;i<=100;i++){
            if(i%2 !=0){
                console.log(i);
            }
        }
    </script>
</head>
<body>

</body>
</html>

练习2

<!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 type="text/javascript">
        var sum=0;
        var count=0;
        for(var i=1;i<=100;i++){
            if(i%7 == 0){
                sum+=i;
                count++;
            }
        }
    </script>
</head>
<body>

</body>
</html>

练习3

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript">
        for(var i=100;i<1000;i++);
        var bai=parseInt(i/100);
        var shi=parseInt((i-bai*100)/10);
        var ge=i%10;
        if(bai*bai*bai+shi*shi*shi+ge*ge*ge==i){
        console.log(i);
        }
    </script>
</head>
<body>

</body>
</html>

质数练习

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript">
        var num=prompt("请输入一个大于一的整数");
        if(num<=1){
            alert("该值不合法！");
        }else{
        var flag=true;
        for(var i=2;i<num;i++){
            if(num % i == 0){
                flag=false;
            }
        }
        if(flag){
            alert(num+"是质数");
        }
        }

    </script>
</head>
<body>

</body>
</html>

嵌套的for循环

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript">
        for(var i=0;i<5;i++){
            for(var j=0;j<i+1;j++){
                document.write("*");
            }
            document.write("<br/>");
        }
    </script>
</head>
<body>

</body>
</html>

九九乘法表

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript">
        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>
        body{width:2000px;}
        span{display:inline-block;width:80px;}
    </style>
</head>
<body>

</body>
</html>

第四十四、四十五集-break和continue

break可以用来退出switch或循环语句，不能在if语句中使用break和continue，break语句会立刻终止离他最近的那个循环语句
可以为循环语句创建一个label，用来标识当前的循环(label：循环语句)；
使用break语句时，可以在break后跟着一个label，这样break就会结束指定的循环，而不是最近的
continue可以用来跳过当次循环，continue会离他最近的那个循环起作用
console.timeEnd()用来终止一个计时器，需要一个计时器的名字作为参数

质数练习的改进

可以通过Math.sqrt()对一个数进行开方

    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript">
        var num=prompt("请输入一个大于一的整数");
        if(num<=1){
            alert("该值不合法！");
        }else{
        var flag=true;
        for(var i=2;i<Math.sqrt(num);i++){
            if(num % i == 0){
                flag=false;
                break;
            }
        }
        if(flag){
            alert(num+"是质数");
        }
        }

    </script>
</head>
<body>