JavaScript第二天

JavaScript介绍

一,运算符

1.赋值运算符

2.算术运算符

3.复合运算符

4.自增/自减

5.关系运算符

    "hello">"abc"
    "10">2  //10>2
    "10">"2" //"1">"2"->false
    "abc">10 //NaN>10->flase

6.逻辑运算

1)逻辑与&&
    全1则1,只有表达式全都为true,最终结果才为true
2)逻辑或||
    有1则1,只有有一个表达式为true,最终结果就为true

        练习:定义变量表示年份,判断是否为闰年
            (逻辑与优先级高于逻辑或)
            (year%4==0&&year%100!=0)||year%400==0;
    //带输入框的弹窗,参数为字符串,表示提示信息,返回用户输入的内容
    var r=prompt("请输入")
    console.log(r,typeof r)
3)逻辑非 !
    对布尔值结果取反
    例:
        !5
        !year

7.三目运算符

    语法:表达式1 ? 表达式2 : 表达式3;

    var age=20;
    var r=age>=18?"成年人":"未成年";

    使用:判断表达式1是否成立,成立的话执行并返回表达式2的结果,不成立执行并返回表达式3的结果

    练习:
        1)分数判断
        接收用户输入的分数,判断区间段
        >=90
        80~90
        60~80
        <60

    <script>
        var score=prompt("请输入分数:")
        var  res=score>=90?"优秀":
            score>=80?"良好":
            score>=60?"一般":
            "不及格";
        console.log(res);
    </script>

        2)身高指数
        接收用户输入的身高(m)和体重(kg)计算身体指数
        bmi=体重/(身高*身高)
        >=24 胖
        18.5~24 健康

    <script>
        var h=prompt("请输入身高:")
        var w=prompt("请输入体重:")
        var bmi=w/(h*h);
        bmi=bmi.toFixed(1);
        var r=bmi>=24?"该减肥了":bmi>=18.5?"健康":"该增肥了";
        console.log(bmi,r)
    </script>

二,流程控制

1.控制代码的执行顺序和执行次数

2.分类:

1)顺序结构,根据条件是否成立,选择执行某一段代码
2)循环结构,根据条件是否成立,选择是否重复执行某段代码

3.选择结构

1)if语句
    1.基本结构
        if(条件表达式){
            条件成立时执行
        }
    2.if-else 语句
        if (条件){
            条件成立时执行
        }else{
            条件不成立时执行
        }
    3.多重分支
        if-else if
        if(条件1){
            条件1成立时执行
        }else if(条件2){
            条件2成立时执行
        }
        ...
        else{
            条件n不成立时执行
        }
2) switch语句
    用于值的全等匹配
    语法:
        switch(变量){
            case 值1:
                匹配全等之后执行的代码段
                break;//结束匹配
            case 值2:
                匹配全等之后执行的代码段
                break;
            ...
            default:
                所有case都不匹配时执行的默认操作
                break;
        }
    特殊:
        1)break关键字可以省略,一旦省略,会从当前匹配到的case开始向后执行所有的代码语句,直到碰到break关键字结束匹配或执行至结束.
        2)多个case公用代码段
        case 值1:
        case 值2:
            //任意一个匹配全等后执行的操作
            break;
练习:
    接收用户输入年,月,日,计算当时是该年的第几天

    <script>
        //1.接收用户输入
        var year=prompt("请输入年份:");
        var month=prompt("请输入月份:");
        var day=prompt("请输入日:");
        //2.表示总天数
        var sum=0;
        //3.闰年判断
        var isRun=year%4==0&&year%100!=0||year%400==0;
        //4.整月天数的累加(month-1个月)
        switch(month-1){//month-1的结果为number值
          //month-1整月:1~11个整月
          case 11:sum+=30;
          case 10:sum+=31;
          case 9:sum+=30;
          case 8:sum+=31;
          case 7:sum+=31;
          case 6:sum+=30;
          case 5:sum+=31;
          case 4:sum+=30;
          case 3:sum+=31;
          case 2:sum+=28;
          if (isRun){
              sum+=1;
          }
          case 1:sum+=31;
        }
        sum+=day;
        alert(sum)
    </script>

4.循环结构

    控制代码的重复执行

•    1)while 循环
  

    语法:
        while(循环条件){
            条件成立时执行,循环体
            更新循环变量
        }

• 运用while循环将上面练习的代码简化

 <script>
        //1.接收用户输入
        var year=prompt("请输入年份:");
        var month=prompt("请输入月份:");
        var day=prompt("请输入日:");
        //2.表示总天数
        day=Number(day)
        var sum=0;
        //3.闰年判断
        var isRun=(year%4==0&&year%100!=0)||year%400==0;
        //4.整月天数的累加(1~month-1个月)
        var i=1;
        while (i<month){
            switch(i){
                case 1:
                case 3:
                case 5:
                case 7:
                case 8:
                case 10:
                    sum+=31;
                    break;
                case 4:
                case 6:
                case 9:
                case 11:
                    sum+=30;
                    break;
                case 2:
                    sum+=28;
                    break;     
            }
            i++;
        }
        sum+=day;
        if (isRun&&month>2){
            sum++;
        }
        alert(sum)

•    2)do-while循环
  

            do{
                循环体
                更新循环变量
            }while(循环条件)
        与while循环的区别:
            while 循环先判断条件,成立时执行循环体;
            do-while循环先执行循环体,再判断条件,不管条件是否成立,循环体至少走一次
    练习:
        循环接收用户输入,输入exit表示退出,否则就在控制台中打印输入内容

使用do-while实现

    <script>     
    do{
        var r=prompt("请输入:");
        console.log(r);
    }while(r!="exit");
    </script>

使用while实现

    <script>     
    var input;
    while (input!="exit"){
        input=prompt("请输入:");
        console.log(input);
    }
    </script>

•    3)for循环
  

    语法
        for(定义变量;循环条件;更新变量){
                循环体;
        }

•  4).循环控制
  

        1.break:跳出循环
        2.continue:结束本次循环,开始下一次循环

•  5).循环嵌套
  

        在循环中嵌套添加其他的循环
    练习:控制台输出乘法表

    <script>
        for(var i=1;i<10;i++){
             var show=''
            for (var j=1;j<i+1;j++){
                show+=i+"x"+j+"="+i*j+"\t";   
            }
            console.log(show);
        }
    </script>

    练习:控制台打印图案
    *
    **
    ***
    ****
    *****

    <script>
        for (var i=1;i<6;i++){
            var show="";
            for (var j=1;j<=i;j++){
               show+="*";
            }
            console.log(show); 
        }
    </script>

三.函数

1.定义

函数用于保存一段待执行的代码,或者封装某个功能.

2.使用

1.函数声明
    function 函数名(参数列表){
            函数体
    }
2.函数调用
    函数名(参数列表)

<script>
        //1.无参数,无返回值的函数
        function f1(){
            console.log("f1被调用");
        }
        f1();
        //2.带参数,无返回值的函数
        function f2(a,b){//形式参数
            var r=a+b;
            console.log(a,b,r);
            //函数允许形参与实参个数不匹配
            //函数内部变量arguments,保存了实际传递过来的参数
            console.log(arguments);
        }
        //实际参数
        f2(10,20);//传参
        f2(100);
        f2(100,200,30);
        //3.函数的返回值:将函数内部的结果返回给外界使用
        //return只能返回一个值,return后面的代码不执行
        function f3(a){
            var r1=a+a;
            var r2=a*a;
            return r1;
            console.log(r1,r2);//不执行
        }
        var  res=f3(5);
        console.log(res);
    </script>

3.作用域
    全局作用域和函数作用域
    1)全局变量
        在程序任意位置都能访问.
        1.函数外部定义的变量都是全局变量
        2.函数内部省略var创建变量,一律为全局变量
    2)局部变量
        在函数体中使用var关键字声明的变量一律为局部变量,只能在当前函数体中使用,外界无法访问