JS基础---流程控制

运算符

算术运算符

1. 常见的运算符：+ ：求和， - ：求差，*** ：求积**，/ ：求积 ，%：求积，开发中经常作为某个数字是否被整除

2. 如果一行内出现了多个算术运算符，先乘除后加减，如果有括号就先算括号，实际开发工作中我们建议按照自己的想法来加括号，以方便我们自己更好的区分先后顺序

3. 优先级顺序：先乘除取余，后加减，有小括号先算小括号里面的

赋值运算符

赋值运算符：对变量进行赋值的运算符，使用这些运算符可以在对变量赋值时进行快速操作

    <script>

        // let age = 30 
        // 赋值运算符的执行过程：先计算右边赋值=后面的结果，再赋值给左边的变量
        // 重新赋值后
        // age = age + 20;
        // 简易写法
        // age += 20;
        // console.log(age);

        let num = 22
        num += 22
        console.log(num);

    </script>

一元运算符

让变量的值做自增运算

​ 用法：

​ 前置自增：先自加再使用（记忆口诀：++在前 先加）

​ 后置自增：先使用再自加（记忆口诀：++在后 后加）

    <script>

        let num = 6

        // num++  等同于 num+=1

        // num--   //等同于 num-=1

        console.log(num++ + 9 + ++num); // 输出值为23

        // 第一个 num++ 后增，所以原值不变，第二个 ++num 因为第一个为后增，所以第一个的值附加在 ++num 上面，同时   ++num做自增加1
    </script>

比较运算符

1. 介绍

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

2. 使用

   比较结果为boolean类型，即只会得到true或false

3. 细节

   • 一般都是对数字做比较，对于字符串做比较，更多是判断两者是否相等
   • 如果拿字符串去大小的比较，判断的标准是，先把字符串隐式转换成number类型，再据数字做大小比较
   • 尽量不要比较小数，因为小数会有精度问题
   • 开发中，如果进行准确的比较的话，我们更喜欢 === 或者 !==

逻辑运算符

1. 介绍

   用来解决多重条件判断

2. 使用

       <script>
   
           // 逻辑与
           // && 并且 一假则为假   一个为假就为假，全部为真才为真
           console.log(4 < 5 && 4 < 3); //false
           // 逻辑或
           // || 或者 一真则为真   一个为真就为真，全部为假才为假
           console.log(5 < 6 || 6 < 5); //true
           // 逻辑非
           // ! 取反 亦真亦假
           console.log(!(4 > 3)); //false
       </script>
   

3. 短路

   • 短路：只存在于 && 和 || 中，当满足一定条件会让右边代码不执行
   • 原因：通过左边能得到整个式子的结果，因此没必要再判断右边

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

   逻辑与：一个为假就为假，全部为真才为真
   
      &&：如果第一个表达式为假，直接返回false，因为第一个值已经返回了，所以不会再执行。若第一个值为真，才会继续往下执行
      
   逻辑或：一个为真就真，全部为假才为假
   
      ||：如果第一个值为真，直接返回第一个值，后面的不再去执行。如果第一个为假，则继续往下执行
   
   感觉 “与假或真” 比这个还好记些，不过还是要知道非与或各自的特点才行
   

运算符优先级

优先级	运算符	顺序
1	小括号	()
2	一元运算符	++ -- !
3	算术运算符	先 / % 后 + -*
4	关系运算符	> >= < <=
5	相等运算符	== != === !==
6	逻辑运算符	先&& 后 ||
7	赋值运算符	=
8	逗号运算符	,

语句

表达式和语句

1. 表达式：表达式是一组代码的集合，JavaScript解释器会将其计算出一个结果

2. 语句：js 整句或命令，js 语句是以分号结束（可以省略）

3. 区别：

   表达式：计算出一个值，例如：3+5 x = 7

   语句：用来自行以使某件事发生(做什么事)，例如：弹出对话框 alert() 控制台 console.log()

分支语句

1. if语句

   三种使用分类：

   单分支

       <script>
   
           let num = prompt('请输入你的分数')
   
           if(num >= 700){
               alert('恭喜考入黑马程序员')
           }
   
           // 如果处理代码只有一句，那么可以省略{}
           if(num >= 700) alert('恭喜考入黑马程序员')
   
       </script>
   

   双分支

       <script>
           let year = prompt('请输入工龄')
   
           if(year >= 2 ){
               alert('恭喜你获得年终奖金2000')
           }else {
               alert('很遗憾你没有年终奖')
           }
   
   
           // 案例练习
           // let year = prompt('请输入工龄')
   
           // if((year % 4 === 0 && year % 100 !== 0) || year % 400 === 0){
           //     alert('润年')
           // }else{
           //     alert('平年')
           // }
   	</script>
   

   多分支

       <script>
           // 0-6  凌晨好
           // 6-12   早上好
           // 12-18  下午好
           // 18-24  晚上好
   
           // let time = prompt('请输入小时值')
           // if(time >= 0 && time < 6){
           //     alert('凌晨好')
           // }else if(time >= 6 && time < 12){
           //     alert('早上好')
           // }else if(time >= 12 && time < 18){
           //     alert('下午好')
           // }else {
           //     alert('晚上好')
           // }
               
           let day = +prompt('请输入今天是星期几')
   
           if(day === 1){
              console.log('肯德基');
           }else if(day === 2){
              console.log('必胜客');
           }else if(day === 3){
              console.log('麦当劳');
           }else if(day === 4 ){
              console.log('华莱士');
           }else if(day === 5 ){
              console.log('猪脚饭');
           }else if(day === 6){
              console.log('沙县VIP套餐');
           }else {
              console.log('西北风豪华套餐');
           }
       </script>
   

   注：if语句的代码执行顺序是自上而下的哦，具体释义如下：

   • 先判断条件1，若满足条件1就执行代码1，其他不执行

   • 若不满足则向下判断条件2，满足条件2执行代码2，其他不执行

   • 若依然不满足继续往下判断，依次类推

2. 三元运算符

   是比 if 双分支 更简单的写法，有时候也叫做三元表达式，配合 ? 与 : 使用

   <script>
           条件 ? 满足条件执行代码 : 不满足条件执行代码
       </script>
   

循环语句

1. 断点调试
   • 作用：学习时可以帮助更好的理解代码运行，工作时可以更快找到bug
   • 浏览器打开调试界面，按F12打开开发者工具，点到sources一栏，选择代码文件
2. while循环
   • 重复执行某段代码， 而 while : 在…. 期间，跟if语句很像，都要满足小括号里的条件为true才会进入执行代码
   • while循环三要素：
     1. 变量起始值
     2. 终止条件（没有终止条件，循环会一直执行，造成死循环）
     3. 变量变化量（视情况而定）