JavaScript 03-12条件语句与while循环

╰+攻爆jí腚メ 2023-07-13 15:12 1阅读 0赞

# if 语句 #

### 语法 ###

##### 1. if( 表达式 )\{执行程序\} #####

当表达式的结果为true，执行程序，当表达式的结果为false，没有执行程序。

**实例**

// 当月薪超过 10W , 可以获得 零花钱 100 元
    // 当月薪小于 10W , 就没有零花钱
    var pay = 50000;
    if(pay > 100000){ 
    console.log('恭喜我自己,获得 100 元零花钱');
    }

##### 2. if(表达式)\{程序1\}else\{程序2\} #####

当表达式结果为 true，执行程序1，当表达式结果为 false，执行程序2。

**实例**

月薪超过 10W , 可以获得 零花钱 100 元
    当月薪小于 10W , 可以获得 零花钱 50 元
    var pay = 150000;
    if(pay > 100000){ 
        console.log('恭喜我自己,获得 100 元零花钱');
    }
    else{ 
        console.log('恭喜我自己,获得 50 元零花钱');
    }

##### 3. if(条件1)\{程序1\}else if(条件2)\{程序2\}else if(条件3)\{程序3\}… #####

> **当满足条件1，执行程序1，当满足条件2，执行程序2… 满足哪个条件就执行哪个条件的程序 判断的顺序是从上至下，如果满足了第一个条件，之后的条件都不会再判断和执行，最终只会执行一个程序，如果所有的条件都不满足，是没有执行内容的。**

**实例**

##### 4. if(条件1)\{程序1\}else if(条件2)\{程序2\}else if(条件3)\{程序3\}…else\{\} #####

> **从第一个条件开始判断，满足哪个条件就执行对应的程序。 满足当前条件之后，执行对应的当前程序，之后的else if()，else 不会执行。 如果所有的条件都不满足，会执行 else 中的程序。**

**实例**

if(pay >= 100000){ 
        console.log('恭喜我自己,获得 100 元零花钱');
    }
    else if(pay >= 90000 && pay < 100000){ 
        console.log('恭喜我自己,获得 90 元零花钱');
    }
    else if(pay >= 80000 && pay < 90000){ 
        console.log('恭喜我自己,获得 80 元零花钱');
    }
    else if(pay >= 70000 && pay < 80000){ 
        console.log('恭喜我自己,获得 70 元零花钱');
    }
    else{ 
        console.log('工资少于7W,我只能跪搓衣板');
    }  // 一般else 做容错处理，else 之后没有(),没有条件,不要多加内容

**注意：if语句，写判断条件时，要注意边界值的设定。**

### if 语句的嵌套 ###

简单if语句，指的是没有嵌套的if语句，只是就简单的if…else语句，实际中if语句往往是可以嵌套的。

**实例**

// 如果是偶数,判断是否在20-50之间,如果在输出 这个数是偶数,在20-50之间
    // 如果不在,输出, 这个数是偶数,不在20-50之间
    // 如果是奇数,判断是否在60-80之间,如果在输出 这个数是奇数,在60-80之间
    // 如果不在,输出, 这个数是奇数,不在60-80之间
    var int = 55;
    // 判断如果是奇数
    if(int % 2 != 0){    
        // 奇数的情况,再做判断,范围 60-80
        if(int >= 60 && int <= 80 ){ 
            console.log(int + '是奇数,在60-80范围内');
        }else{ 
            console.log(int + '是奇数,不在60-80范围内');
        }
    }else{ 
        // 偶数情况,再做判断,范围 20-50
        if(int >= 20 && int <= 50 ){ 
            console.log(int + '是偶数,在20-50范围内');
        }else{ 
            console.log(int + '是偶数,不在20-50范围内');
        }
    }

**注意：这样的if嵌套，就不要写成三元运算符的形式。**

# switch 语句 #

switch语句也是判断语句形式的一种，功能与if判断基本相同，只是使用环境不同。

### 语法 ###

switch(n) {  
        case 1: 
            执行代码块 1;
            break; 
        case 2: 
            执行代码块 2;
            break; 
        default: 
            与 case 1 和 case 2 不同时执行的代码;
    }

##### case 关键词 #####

是变量对应的数值，要执行的对应程序。对于数值的判断，执行的是 === 严格比较 / 全等判断。

##### default 关键词 #####

对应的是 if语句中的 else，也就是当变量的数值不满足所有的 case 时，执行的程序。

##### break 关键词 #####

> 终止语句。  
> switch 默认会从定位的位置开始，执行之后所有的程序，除非遇到 break 关键词，才会终止程序的执行。  
> 因此，每一个case的定位，每一种执行情况，都要配合一个break 做终止，防止程序执行的冲突。 最后一个程序，可以不加 break加不加看个人习惯。

# if 语句和 switch 语句的区别 #

1. if 语句，往往做比较判断，判断是范围。逻辑运算符，使用 if 语句做判断。
    2. switch 判断等于某个具体数值时，我们使用switch语句，switch的执行效率高于 if 判断。
    3. switch一定能写成 if ，但是有些 if 不适合写成 switch。

##### 实例 #####

// 有商品编号 1-5 5种商品 , 根据不同的商品编号,输出商品信息
    var num = parseInt(Math.random() * 5 + 1);
    if (num == 1) { 
        console.log(`随机数是${ num},输出的是第一种商品的信息`);
    } else if (num == 2) { 
        console.log(`随机数是${ num},输出的是第二种商品的信息`);
    } else if (num == 3) { 
        console.log(`随机数是${ num},输出的是第三种商品的信息`);
    } else if (num == 4) { 
        console.log(`随机数是${ num},输出的是第四种商品的信息`);
    } else if (num == 5) { 
        console.log(`随机数是${ num},输出的是第五种商品的信息`);
    } else { 
        console.log('您输入的商品编号有误,无法查询对应的商品信息');
    }
    
    // 如果判断是否等于某个值,例如 5 
    // 需要从第一个条件开始执行判断,执行到5,要多判断4次 false
    // 如果判断较多,执行效率就会比较低
    // 此时就推荐使用 switch 语法
    
    // switch 是 根据变量的数值,来进行定位
    // 如果 num 数值是5,直接定义到5,执行对应的程序内容
    // 不会做过多的判断,效率就比if判断的效率高
    
    switch (num) { 
        case 1:
            console.log(`随机数是${ num},输出的是第一种商品的信息`);
            break;
        case 2:
            console.log(`随机数是${ num},输出的是第二种商品的信息`);
            break;
        case 3:
            console.log(`随机数是${ num},输出的是第三种商品的信息`);
            break;
        case 4:
            console.log(`随机数是${ num},输出的是第四种商品的信息`);
            break;
        case 5:
            console.log(`随机数是${ num},输出的是第五种商品的信息`);
            break;
        default:
            console.log('您输入的商品编号有误,无法查询对应的商品信息');
            break;
    }

# 随机数 #

在JavaScript中，有自己生成随机数的语法，与PHP、Python、Java都不同。

`Math.random()` **随机生成 0-1的小数,可以是0,永远不会是1。**  
例如：

console.log( Math.random() );    //输出一个0~1之间的随机小数

一般使用时,都是生成一个随机整数。

`parseInt()` **获取数值的整数部分。**

有生成随机整数的公式，如果需要生成数值的范围是 a - b 那么公式是：

随机数*(b+1-a) + a

结合起来就是

parseInt( Math.random() * (b+1-a) + a )

##### 实例 #####

// 例如要 生成 10 - 20 之间的整数 , 可以 取到10 和 20
    parseInt( Math.random() * ( 20+1-10) + 10 )  
    console.log( parseInt( Math.random() * ( 20+1-10) + 10 ) )

# while 循环 #

### 语法 ###

> 循环语句的基本语法格式由 4 部分组成：
> 
> 1.  设定循环变量的初始值
> 2.  判断进入循环的条件
> 3.  循环体
> 4.  步长

### 实例 ###

var i = 1;       //设定循环变量的初始值
    while(i <= 5){    //判断进入循环的条件
        console.log('老婆大人我错了,我下次不会再犯了'); //循环体
        i++;         //步长
    }
    console.log(i)

### while 循环和 if 的配合 ###

##### 实例 #####

// demo：输出 1 - 10 中 , 所有的偶数
    // 思路1: 循环生成1-10的所有整数
    // 然后判断 这个数值是否是 偶数,如果是,执行输出,如果不是没有操作
    var i = 1;
    while(i <= 10){ 
        // 嵌套在循环{ } 中的 if判断
        // 这个if判断,也是循环体的一部分
        // 每次循环,if判断也会执行
        // 如果这个循环变量 i 的数值 可以被 2整除,也就是 此时的i 是偶数
        // 就执行输出
        // 否则就直接执行 步长 i++ 没有输出内容
        if(i % 2 == 0){ 
            console.log(i + '是偶数');
        }
        i++;
    }
    // 总结,这种思路,会循环10次,执行10次判断,5次是true,有输出,5次是false没有输出内容

### while 循环的优化 ###

##### 实例 #####

//还是上面那个demo：
    // 思路2:可以直接生成1-10的偶数,直接输出,循环次数少,并且还不用判断,效率会提高---程序优化
    // 所谓的偶数,相邻的两个偶数相差是2,偶数之间,步长是2
    // 只要找到第一个偶数,将步长设定为2,获取到的就都是偶数了
    // 就不需要判断,可以直接输出
    // 1-10之间,第一个偶数是2 , 步长是 2 也就是 i+=2
    var i = 2;
    while(i <= 10){ 
        console.log(i);
        i+=2;
    }

# 死循环 #

### 定义 ###

所谓的死循环指的是，循环会一直判断进入条件，判断结果一直是true。循环也就是会一直执行，不会停止，这样的循环称为死循环。

### 实例 ###

var i = 1;
    while(i <= 10){ 
        console.log(i);
        i--;
    }

当然，你也可以把console.log改为window.alert试试，此时会弹窗输出，看看会发生啥…