第28节:if语句(一)

218 阅读1分钟

if语句(一):

一、流程控制语句:

  • JS中的程序是从上到下一行一行执行的
  • 通过流程控制语句可以控制程序执行流程
    • 使程序可以根据一定的条件来选择执行

二、语句的分类:

  1. 条件判断语句
  2. 条件分支语句
  3. 循环语句

三、条件判断语句:

  • 使用条件判断语句可以在执行某个语句之前进行判断
    • 如果条件成立才会执行语句,条件不成立则语句不执行。

1、 if语句:

语法一:

if(条件表达式)

{

​ 语句……

}

  • if 语句在执行时,会先对条件表达式进行求值判断,
    • 如果条件表达式的值为true,则执行 if 后的语句
    • 如果条件表达式的值为false,则不会执行 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>
        if(true)
            console.log("你猜我出不出来?")//执行


        if(false)
            console.log("我不出来?")//不执行

        var a = 10 ;
        if (a > 10 ||a == 10)
        console.log("a比10大")//执行

        
    </script>
</head>
<body>
    
</body>
</html>

image-20211109105913408

if 语句只能控制紧随其后的那个语句:

  • 如果希望 if 语句可以控制多条语句
  • 可以将这些语句统一放到代码块中

==if 语句后的代码块不是必须的,但是在开发中尽量写上代码块,即使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>
        var a = 20;
        if (a > 10 );
        
        //主要应用于alert中,这样可以弹出两个语句
        {
            console.log("a 比 10 大")
            console.log("谁也管不了我·····")
        }//code areas    
        
        
    </script>
</head>
<body>
    
</body>
</html>

image-20211109110312375

多重条件语句(if 多点条件 多点爱)

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>
        var a = 5;
        if (a > 10 && a <= 20)
        {  
            console.log("a")
        }      
    </script>
</head>
<body>
    
</body>
</html>

image-20211109112136142

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>
        var a = 5;
        if (a > 10 && a <= 20);//之所以会出现这个状况,是因为分号把他们分成了两句话,所以,以后没事别写  ; 分号
        {  
            console.log("a")
        }      
    </script>
</head>
<body>
    
</body>
</html>

image-20211109112232151