JS的分支语句和循环语句

10、JS的分支语句

分支语句：
 * 根据我们设置好的条件!!!  然后来决定执行那些代码
 * 

①.if 分支语句

     语法：
     *   if(条件) {满足条件的时候执行的代码，如果不满足，这里边的代码永远不执行}
     *    条件最终会返回一个布尔值，如果为真，那么会执行对应的代码
     *                            如果为假，那么不会执行
 ```js
      // if 分支语句的基本写法
      var a = 1
      // if(条件){要执行的代码}
      if (a === 1) {//如果a === 1这个条件成立,那么会执行打印1
          console.log(1)
      }
      if (a === 2) {//如果a === 2这个条件成立,那么会执行打印2
          console.log(1)
      }
      // if...else...的嵌套写法
      var a = 100
      if(a === 1) {
          console.log(1)
      } else if(a === 2) {
          console.log(2)
      } else {
          console.log('a 不等于 1或者2')
      }
   /**
     * 运行流程：
     *    首先判断α是否等于1，如果满足条件，直接打印1,并结束这个分支
     * 
     *    如果不满足，会进入下一个分支的判断，判断a是否等于2，如果满足条件，直接打印2，并结束这个分支
     * 
     *    最后结尾的else分支 只会在前边所有的条件都不满足的时候 才会执行，前边如果有一个条件成立，那么 else 就不会执行
     * */ 
 ```

if分支的课堂练习

    // 1. 判断一个正整数, 是不是偶数, 如果是偶数, 在控制台打印 "偶数", 否则在控制台打印 "不是偶数"
    // 偶数的特点:能够被⒉整除，也就是说一个数字取余 2 如果正好等于0，那么就是偶数
    var num = 12
    if(num % 2 === 0) {
      console.log('偶数')
    }else {
      console.log('不是偶数')
    }

    // 2.判断一个数字是否在某一个区间，例子:判断数字是否在10~20之间
    var a = 12
    if (10 <= a && a <= 20) {
      console.log('数字在10~20之间')
    } else {
      console.log('数字不在10~20之间')
    }
    console.log(10<=9<=20)
    console.log(10<=9) //false
    console.log(false<=20) //首先将false 转换为数字(也就是0)，然后和20做比较
    console.log(true);//得到一个布尔值

    // 3.根据成绩(0~100)在控制台输出不同的内容
    var num = 62

    if(num >= 90) {
      console.log('优秀');
    }else if (num >= 80) {
      console.log('中等')
    }else if (num >= 70) {
      console.log('及格')
    }else if (num >= 60) {
      console.log('要努力')
    }else {
      console.log('你危险了')
    }

    // 4.判断一个年份是不是闰年  闰年的条件: 1. 4年一闰，百年不闰 2. 四百年补一闰

    var num = 2023
    if (num % 4 === 0 && num % 100 !== 0 || num % 400 === 0) {
      console.log('是闰年')
    } else {
      console.log('不是闰年')
    }

②.switch 分支语句

和if 相同 ，也属于条件分支语句
 * if(要判断的变量) {
 *     想要执行的代码
 * }
 * 
 * switch (要判断的变量) {
 *    case 情况1:
 *        情况1要执行的代码
 *        break;
 *    case 情况2:
 *        情况2要执行的代码
 *        break;
 * }
 * 
 * 判断逻辑：判断的变量 是否 ===case上说明的情况
 * 
 * 注意：switch...case 在判断时，执行时全等，也就是 === 所以数据类型不同时，也不会正确执行
 ```js
 var a = 100
 switch (a) {
  case 1:
    console.log('如果我执行，说明 a === 1')
    break;
  case 10:
    console.log('如果我执行，说明 a === 10')
    break;
  case 100:
    console.log('如果我执行，说明 a === 100')
    break;
  default:
    console.log('上述情况都不满足的时候，我会执行')
 }
 ```

③.switch穿透语法

switch 在书写的时候 如果不写break 会出现穿透现象
 * 
 * 穿透现象: 
 *     找到第一个满足的case的时候，开始执行这个代码
 *     执行完毕如果没有break 会继续执行下一个case
 *     直到 遇到一个break 或者 分支语句全部执行完毕
 ```js
 var a = 100
 switch (a) {
  case 1:
    console.log('case 1 执行')
    // break;
  case 10:
    console.log('case 10 执行')
    // break;
  case 20:
    console.log('case 20 执行')
    // break;
  case 30:
    console.log('case 30 执行')
    // break;
  case 40:
    console.log('case 40 执行')
    // break;
  case 100:
    console.log('case 100 执行')
    break;
  default:
    console.log('上述情况都不满足的时候，我会执行')
 }
 ```
 ```js
 /**
 * 穿透语法
 *      根据月份，输出相应的天数 (2月按照28天)
 * */ 
 var month = 11
 switch (month){
  case 1:
  case 3:
  case 5:
  case 7:
  case 8:
  case 10:
  case 12:
    console.log('有31天')
    break

  case 4:
  case 6:
  case 9:
  case 11:
    console.log('有30天')
    break
    
  case 2:
    console.log('2月有28天')
    break
 }
 ```

switch课堂练习

    /**
     * 课堂练习
     *      根据成绩(0~100)冉控制台输出对应的成绩
     * */ 

     var num = 67
    //  求十位上的数字 (parseInt)
    // parseInt只能忽略掉小数点以后的所有内容
    // 如果我们想要只留下十位上的数字 那就应该想办法让这个数字多一个小数点

     switch (parseInt(num/10)) {
      case 10:
        console.log('完美')
        break
      case 9:
        console.log('优秀')
        break
      case 8:
        console.log('中等')
        break
      case 7:
        console.log('及格')
        break
      case 6:
        console.log('要努力')
        break
      case 5:
        console.log('你危险了')
        break
     }

11、三元表达式

/**
 * 三元表达式
 *     别名：三目表达式 三目运算符 三月 问号冒号表达式
 * 
 *     语法： 条件 ?条件为真时，执行的代码 : 条件为假时，执行的代码
 * 
 *      意义：对if分支语句做一个简化操作
 *
 *      注意：不管条件真还是假的代码!! 都只能写一行
*/
```js
    var a = 100
    a > 1 ? console.log('如果我输出了，说明 a 的值 大于 1'):console.log('如果我输出了，说明 a 的值小于 1')
    //  利用三元表达式给变量赋值
    var num = 1 //约定，如果num ===1那么代表为男性如果,num !== 1那么代表为女性
    var gender = num === 1 ?'男':'女'
    console.log(gender)
```

12、while循环语句

①.while循环语句

意义：帮助我们去执行 重复的代码
 * 
 *    什么是循环语句
 *          根据给出的某些条件，重复执行一段代码
 * 
 *     循环语句
 *        1.初始化
 *        2.条件判断
 *        3.要执行的代码
 *        4.改变自身(改变初始化的内容)
 * 
 *    while 循环
 *          语法： while (条件) {满足条件时执行的代码}
 ```js
     //  需求，想让这个代码执行1000次  console.log(1)
     var num = 0 //1.初始化
     while (num < 1000) { //2.小括号内的是 条件判断
         console.log(1)//3.要执行的代码
         num++  //4.改变自身
     }
 ```

②.while循环的课堂练习

 ```js
     // 1. 求 1 ~ 100 之间的 所有数字相加的和
     var num = 1//1.初始化
     var sum = 0//用于存储1~100之间所有数字相加的和
     while (num <= 100) {//条件判断
         // console.log(num)//执行代码
         sum = sum + num//sum += num
         num++//4.改变自身
     }
     console.log(sum)//5050
 ```

13、循环语句练习

```js
// 1. 用户输入年份和月份, 判断当月有几天
/**
 * 核心
 *    1.有用户输入年份和月份
 *    2.判断当月有几天 (2月的时候还需要判断当年是否为闰年)
 *      闰年的条件1:4年一润 百年不润
 *            条件2:四百年补一润
 * */ 
var year = prompt('请输入年份') - 0
var month = prompt('请输入月份') - 0//- 0 的目的将月份转换成数值
switch (month){
  case 1:
  case 3:
  case 5:
  case 7:
  case 8:
  case 10:
  case 12:
    console.log('有31天')
    break;

  case 4:
  case 6:
  case 9:
  case 11:
    console.log('有30天')
    break;
    
  case 2:
    // 如果输入的是2月需要先判断闰年
  year % 4 === 0 && year % 100 !== 0 || year % 400 === 0?console.log('因为',year,'是闰年,所以2月有29天'):console.log('因为',year,'不是闰年,所以2月有28天')
  break;
 }
```
```js
// 2. 求 1~100之间 所有3的倍数的和
/**
 * 核心
 *    1.找出1-100之间所有的数字
 *    2.找出1-100之间3的倍数的数字
 *    3.将所有3的倍数的数字求和
 * */ 
var num = 1//1.初始化1-100
var sum = 0
while(num <= 100) {//2.条件
  // 找出了所有3的倍数的数字
  if(num % 3 === 0) {//3的倍数的条件
    // console.log(num)//3.执行代码
    sum = sum + num
  }// sum = sum + (num % 3 ===0 ? num : 0)
  num++//4.改变自身
}
console.log('所有3的倍数的和为:'+sum)//1683
```

14、do...while循环

①.do...while循环
    是一个类似 while 的循环语句
 * 
 * while循环在开始的时候，会先判断条件是否成立 然后决定是否执行
 * do..while 循环在开始第一次的时候，不会判断条件，也就是说，不管条件成功与失败，第一次都会执行

 var num = 10
 do{
  console.log(num)
  num--
 }while(num < 5)
/**
 * do. . .whiLe循环的时候，第一次的时候不会管这个条件是否成立，他一定会执行一次
 * */  
 ②.do...while循环练习
 ```js
     /**
     * 需求:用户输入密码，密码正确，正常向下执行，密码错误，让用户重新输入密码
     * */ 
     
     /**
     * 流程:用户打开页面,输入一段密码
         由程序检测，如果密码正确，那么继续向下执行
         如果密码不正确，那么让用户重新输入密码
     * */  
     var password;
     do {
         password = prompt('请输入您的密码')
     }while(password !== '12345')
     //如果password != 12345 那么继续执行循环，如果密码正好是‘12345’那么停止循环
 ```

15、for 循环

for 循环
 *      也是 循环语句的一种，但是 语法上和另外两个不同！
 *      语法：for (1.初始化 2.条件 3.改变自身){4.循环要执行的代码}
 *      目前for循环的使用场景来看，要稍微多一点，但不代表可以完全替代 while 循环或者do...while循环
 ```js
     // 用for循环重构
     for(var n = 0; n < 3; n++) {
         console.log(n)
     }
 ```
 ②.for循环练习
 ```js
     /**
     * 1.求1~100之间的所有的和
     * */ 
     /**
     * 核心
     *    1.求出1~100之间所有的数字
     *    2.求出所有数字的和
     * */  
     var sum = 0
     for (var i = 1; i <= 100; i++) {
         sum += i
     }
     console.log(sum)
     
     //  2.求1~100之间的所有偶数的和
     /**
     * 核心
     *    1.先打印1-100内所有数字
     *    2.打印1-100内的偶数
     *    3.打印1-100内所有偶数的和
     * */ 
     var sum = 0
     for (var i = 1; i <= 100; i++) {
         if(i % 2 ===0 ){
             // console.log(i)
             sum += i
         }
     }
     console.log(sum)
     
     // 3.课后练习：求出1000-2022之间的所有闰年，输出在页面
     /**
     * 核心内容
     *      1.打印出1000-2022年的年份
     *      2.算出闰年
     *      3.打印出所有闰年
     * */
     for (var year = 1000; year <= 2022; year++){
         // console.log(year)
         if(year % 4 === 0 || year % 100 === 0 || year % 400 ===0){
             console.log(year,'是闰年')
         }
     }
     
     /**
     * 4.求 水仙花
     *        有一个三位数(100~999) 各个位置上的数字的三次方的和 正好等于自身
     *        那么说明这个数字就是水仙花数
     * */ 
     
     /**
     * 核心内容
     *      1.找出所有的三位数
     *      2.找出符合条件的数字
     *        条件：各个位置上的数字的三次方的和 正好等于自身
     * 
     *        2.1 先计算各个位置上的数字的值是什么，也就是想办法拿到各位 十位 百位上的数
     *        2.2 计算 三个位置上的数字 的三次方和
     *        2.3判断三次方的和是否等于自身
     * */  
     
     for(var i = 100; i <= 999; i++){
         // console.log(i)
         // 根据水仙花数的规则，找出符合条件的数字
         // 先计算各个位置上的数字的值是什么，也就是想办法拿到个位十位百位的值
         /**
         * 就拿123为例
         *  拿到百位数 先缩小100倍，然后用parseInt忽略掉小数点后的数字,就只留下百位上的数字了
         *  拿到十位数 先缩小10倍，然后取余10，得到的数字 通过perseInt取整后，就只留下十位上的数字了
         *  拿到个位数 直接取余10，就留下了十位数字了
         * */ 
         
         var baiW = parseInt(i / 100)
         var shiW = parseInt(i / 10 % 10)
         var geW = i % 10
         
         // 计算三个位置上的数字的三次方的和
         var sum = Math.pow(baiW,3)+Math.pow(shiW,3)+Math.pow(geW,3);// var sum = baiW * baiW *baiW + shiW * shiW * shiW + geW * geW * geW
         if(sum === i){
             console.log(i,'是一个水仙花数')
         }
     }

// JS求 3次方的简写 Math.pow(底数,指数)
 ```

16、流程控制语句

* 通过两个关键字，可以起到控制循环的一个作用，这就是流程控制
 * 
 *    1. break(结束掉整个循环，不管循环后边还有几轮)
 *      今天早上我买了五个包子，然后呢我吃了3包子，这个时候我吃饱了，我吃不下去了 此时我就结束掉了吃包子这件事，也就是说第四个和第五个包子我就不吃了
 ```js
     for(var i = 1; i <= 5; i++) {
         console.log('我吃了一个包子')
         if(i === 3) {
             break //当循环执行到i === 3的时候，此时这个if判断的条件成立，开始执行内部代码，也就是执行 break 结束整个循环
         }
     }
 ```
 *    2.continue（跳出当前这一轮循环，直接开始下一轮循环)
 *      今天早上我买了五个包子，然后呢我在吃第三个包子的时候，这个时候，第三个包子掉地上了，所以这个包子我不吃了 此时我开始吃第四个包子与第五个包子
 ```js
     for (var i = 1; i <= 5; i++) {
         if(i === 3) {
             console.log('第三个包子掉地上了，我不吃这个包子了')
             continue
         }
         console.log('我吃了一个包子')
     }
 ```

17、循环嵌套

* 注意:外层循环的变量与内层循环的变量不要相同
```js
for (var j = 0; j < 3; j++) {
    for (var i = 0; i < 3; i++) {
      console.log(i)
    }
    console.log('j的值为',j)
}
```

for循环课堂案例

    * 需求：在页面上打印9个*
    document.write('*') //这个方法能够将我们需要的内容直接输出在页面上，而不是控制台面板
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')

    // 需求：在页面上打印两行9个*
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('<br>')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')
    document.write('*')

    // 在页面输出一个9 * 9的方阵
    for(var j = 0; j < 9; j++) { //外层循环:控制有多少行
      for (var i = 0; i < 9; i++){//内层循环:控制一行有多少个*
        document.write('*')
      }
      document.write('<br>')
    }

    // 在页面输出一个三角形
    for(var j = 0; j < 9; j++) { //外层循环:控制有多少行
      for (var i = 0; i < j; i++){//内层循环:控制一行有多少个*
        document.write('*')
      }
      document.write('<br>')
    }

    //在页面输出九九乘法表
    for(var j = 1; j <= 9; j++) { //外层循环:控制有多少行
      for (var i = 1; i <= j; i++){//内层循环:控制一行有多少个*
        sum = i * j
        document.write(i , '*' , j , '=' , sum,'  ')
      }
      document.write('<br>')
    }

18、课后练习

```js
    //1. 用户输入一个整数 n，计算 n 的阶乘。即`n*(n-1)*(n-2)*……*3*2*1`
    var sum = 1 //初始化
    for (var n = parseInt(prompt('请输入n的值')); n >= 1; n--) { //条件
        // 计算这个数字的阶乘
        sum = sum * n //执行代码
    }
    console.log(sum)
    
    /* var num = prompt('请输入一个数字') - 0;
    var sum = 1
    for(var i = 1; i <= num; i++) {
        sum *= i
    }
    console.log(sum);*/
    
    //2. 苹果 3 元一个, 鸭梨 2 元一个, 桃子 1 元一个。现在想用 200 元正好买 100 个水果, 用 JS 列出所有购买方案
    /**
    * 核心内容
    *  条件：
    *    1.买三种水果一共花200元 3*苹果+2*鸭梨+1*桃子=200
    *    2.买三种水果一共买100个 苹果+鸭梨+桃子=100
    * */ 
    for(var a = 0; a <= 100; a++){
        for(var b = 0; b <= 100; b++) {
            for(var c = 0; c <= 100; c++) {
                if(a + b + c === 100 && 3*a + 2*b + c === 200){
                    console.log('购买方案为','苹果',a,'鸭梨',b,'桃子',c)
                }
            }
        }
    }
```