JS基础第三天

一、算术运算符

1.算术运算符有：+ 、- 、* 、/、%

% 表示取模求余数除法运算获得除法元素后，剩下余数为整数

2.如果一行内有多种运算符时，有括号先算括号，再乘除后加减

3.注意：

圆周率π代码写法：Math.PI 圆面积计算：Math.PI *r *r

二、赋值运算符

对变量进行赋值的运算符

1 .num=num+1 ==> num+=1

2.赋值运算符有：+= 、-= 、*= 、/= 、%=

3.执行过程：将等号右边赋值给予左边，要求左边必须是一个变量

let num=10;
num+=3//num=10+3
console.log(num)//输出为13

<!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>
</head>
<body>
    <script>
        let num=10;
        /* num+=3;
        console.log(num); */ //输出为13
        
        /* num-=4;
        console.log(num); */ //输出为6

        /* num*=3;
        console.log(num);  */ //输出为30

       /*  num/=2;
        console.log(num); */ //输出为5

        num%=3;
        console.log(num); //输出为1
        //求10/3的余数  10/3=3...1
    </script>
</body>
</html>

1648394010303

三、一元运算符(难点)

1.分为:自增、自减

2.自增：符号++ 只能加1 ；

自减：符号-- 只能减1 ；

3.注意：只能加减1

4.自增分为两种：前置自增、后置自增（与自减一样）

// let num =1 ;
      // // ++num;
      // // num++;
      // // 1 都可以理解为  num = num + 1 
      // console.log(num); 输出为2

前置自增：前置自增先自加，再使用+后面的(口诀：++在前先加)

let a=1;
        console.log(++a + 2);//输出为4
        //执行顺序： 先算++a=2 再算2+2=4

 // //  难点
      // let i = 1;
      // // console.log(++i + 2); // 4

      // // 先自加  再使用
      // i = i + 1;
      // console.log(i + 2);

后置自增：先后加+后面的数字再使用++(口诀：++在后后加)

let s=1;
        console.log(s++ + 2);//输出为3  先s+2（这是输出(s++ + 2)的结果）
        console.log(s)//输出为2 ）（这是s的输出结果）

// // 难点
      // let i = 1;
      // console.log(i++ + 2); // 3

      // // 1 先执行
      // console.log(i + 2); // 3
      // // 2 使用是后置自增
      // i = i + 1;

      // console.log(i); // 2

注意：

// let i = 1;

      // console.log(i++);

      // console.log(i); // 2

      // console.log(++i); // 前置 先加加 再计算结果
      // // i = i + 1; // i = 3
      // // console.log(i);

2.在工作中，基本都是 i++ 或者 ++i 独立使用

3.自减（与自增一样）

 //console.log(--i); //  4

        //console.log(i--); //  打印的结果是 4

       // console.log(i); // 3

四、比较运算符

1.数据间的比较

作用：比较两个数据大小、是否相等

1648657344116

注意：

= 是赋值
== （等于）只会判断数值是否相等，不会判断类型是否一样
=== （全等于）即判断数值是否相等，也判断类型是否一样（开发中最常用）
！== （全部不等）数值，类型都不等
比较运算符返回的结果只有两个： true / false

2.字符串比较

1.字符串的比较是比较字符对应的ASCII表

1648806506155

2.如果拿字符串比较大小，判断标准是：

先参照ASCII对应的字符串的对应的数字，再做两者的比较，得出的结果是布尔类型（true / false）

3.注意：

NAN不等于任何值，包括自己本省
尽量不要比较小数，小数有精度问题
不同类型之间比较会发生隐式转换

五、逻辑运算符

1.逻辑运算符运用

符号	名称	日常读法	特点	口诀
&&	逻辑与	并且	符号两边都为true结果才为true	一假则假
\|\|	逻辑或	或者	符号两边有一个true就位true	一真则真
！	逻辑非	取反	true变false false变true

2.短路运算

1.短路：只存在于&&和||中，当满足一定条件会让右边代码不执行

符号	短路条件
&&	左边为false就短路
\|\|	左边为true就短路

2.原因：通过左边的结果就能得出整个式子的结果，因此没必要在判断右边

3.运算结果：无论 && 还是 || ，运算结果都是最后被执行的表达式值，一般用在变量赋值

let rain=true
rain && console.log('去吃饭')//输出结果为去吃饭

1648804647206

4.注意：

undefined，如果转换成布尔类型，都为false
有哪些值输出为false：undefined、null、0、''（空字符串）、false、NaN

六、语法

1.表达式和语句的区别

表达式：表达式是一组代码的集合，JavaScript解释器会将其计算出一个结果比如：x=7 3+4 num++

语句：js 整句或命令，js 语句是以分号结束（可以省略）比如：if语句、for循环语句

小结：

1648805697553

2.程序三大流程控制语句

1.顺序结构：按照顺序执行代码

2.分支结构：根据条件执行代码

3.循环结构：某段代码重复执行

1648805854983

3.分支语句

分支语句包括：if分支语句、三元运算符

if语句

if语句有三种使用：单分支、双分支、多分支

一、if语句的使用语法（单分支）：

if(条件){
满足条件要执行的代码
}

1648806130504

1.括号内的条件为true时，进入大括号里执行代码

2.小括号内的结果若不是布尔类型时，会发生隐式转换转为布尔类型

二、双分支if语句

语法：

if(条件){
满足条件要执行的代码
}else{
不满足条件要执行的代码
}

1648806941451

三、多分支if语句

语法：

if(条件1){
代码1
}else if(条件2){
代码2
}else if(条件3){
代码3
}（中间还可以插入n个else if）else{
以上都不满足再执行的代码
}

释义：

先判断条件1，若满足条件1就执行代码1，其他不执行
若不满足则向下判断条件2，满足条件2执行代码2，其他不执行
若依然不满足继续往下判断，依次类推
若以上条件都不满足，执行else里的代码n
注：可以写N个条件

三元运算符

符号：？与：配合使用

语法：

条件 ？ 满足条件要执行的代码 ：不满足条件要执行的代码

1648808190626

一般都是用来取值的

七、循环结构

1.断点调试

谷歌浏览器打开调试页面

按F12打开开发者工具
点到源代码一栏
选择代码文件

点断：在某句代码上加的标记就叫断点，当程序执行到这句有标记的代码时会暂停下来

1648820920693

2.while循环

循环：重复执行某段代码，而 while : 在…. 期间

1.while 循环语法：

while(循环条件){
	要重复执行的代码（循环体）
}

1648821335049

释义：

跟if语句很像，都要满足小括号里的条件为true才会进入执行代码
while大括号里代码执行完毕后不会跳出，而是继续回到小括号里判断条件是否满足，若满足又执行大括号里的代码，然后再回到小括号判断条件，直到括号内条件不满足，即跳出

2.while 循环注意事项：

循环的本质就是以某个变量为起始值，然后不断产生变化量，慢慢靠近终止条件的过程。

所以，循环要具备三个条件：

变量起始值
终止条件（没有终止条件，循环会一直执行，造成死循环）
变量变化量（用自增或者自减）

1648821725416

八、案例

1.1—100的总和

分析：

利用 i ，正因为i和数字对应
声明累加和的变量sum
每一次都把i放进sum里面

let i=1
        let sum=0//求和
        while(i <= 100){
            sum+=i//等于 sum=sum+i 此时在变化 sum也在变化 做加法
            i++
        }
        console.log(sum)

2.1—100的偶数总和

分析：

何为偶数，就是余数为0的数就是偶数
与求1—100的总和一样，只不过多加一个if语句

 let i=1
        let sum=0
        while(i <= 100){
            if(i % 2 === 0){ //算出100内的偶数 输出到i
                //console.log(i)
                sum+=i//sum=sum+1
            }
            i++                
        }
        console.log(sum)

2.ATM案例

分析：

循环的时候，需要反复提示输入框，所以提示框写到循环里面
退出的条件是用户输入了 4（即输入非4 就循环弹窗）
令一个变量input 输入用户想要输入的数据
提前准备一个金额预先存储一个数额
取钱则是减法操作，存钱则是加法操作，查看余额则是直接显示金额

<script>
        let input;
        let money=0
        while(input !== 4){
            input= +prompt(`请输入您的操作：
            1.取款
            2.存款
            3.查看余额
            4.退出
            `);
            if(input === 1){
                num1= +prompt('请输入您要取款的金额')
                money-=num1
               }else if(input === 2){
                num2=+prompt('请输入您要取款的金额')
                money+=num2
            }else if(input === 3){
                alert('您的余额为'+ money)
            }else if(input === 4){
                console.log('退出')            
            }           
        }


    </script>