JavaScript基础语法结构Day03

1、数据类型转换
    1、隐式转换
        函数:typeof(变量) 或 typeof 变量
        与字符串做加法操作,最后会将其他数据转换为字符串
    2、转换函数
        1、toString()
        2、parseInt(数据)
        3、parseFloat(数据)
        4、Number(数据)
2、运算符和表达式
    1、运算符
        算术运算符,关系运算符,逻辑运算符,位运算符 ... ...
    2、表达式
        由运算符以及操作数所组成的式子
        a+b;
        a%4==0&&a%100!=0

        a=b;
    3、运算符详解
        1、算术运算符
            +,-,*,/,%,++,--
            ++:自增
                ++作为前缀:先自增再使用
                ++作为后缀:先使用再自增

                var num = 5;
                num++; ==> num = num + 1
        2、关系运算符
            >,<,>=,<=,==,!=,===,!==
            ==:判断等于,判断两个数据是否相等,如果相等,结果为true,否则为false
            !=:不等于,判断两个数据是否不相等,如果不相等,结果为true,否则为false
            ===:判断数值和类型是否完全相等,完全相等时,结果才为true,否则为false

            由关系运算符组成的表达式称之为 关系表达式,结果一定是boolean的

            注意:
                1、字符串 与 字符串 判断大小
                    比每位字符的Unicode码

                    "5">"30" : true
                2、字符串 与 数字 判断大小时
                    将字符串 隐式的通过 Number()函数转换为数字再做比较
                    5>'30' : false
                    
                3、任何一个数据与NaN进行比较时,结果一定是false
                    5>'3a' : false,注意,3a会被转换成NaN
        3、逻辑运算符
            1、逻辑运算符
                !:逻辑非
                &&:逻辑与
                ||:逻辑或
            2、短路逻辑
                1、&&
                    只要第一个条件为假的话,则不会判断第二个条件,整个表达式结果为假
                    如果第一个表达式为真的话,则继续判断(执行)第二个表达式,并且以第二个表达式的结果作为整个表达式的结果
                2、||
                    只要第一个条件为真的话,则不会判断第二个条件,整个表达式结果为真
                    如果第一个表达式为假的话,则继续判断(执行)第二个表达式,并且以第二个表达式的结果作为整个表达式的结果
        4、位运算符
            1、&
                场合:判断奇偶性
            2、|
                场合:向下取整
            3、<<
                将二进制数字,向左移动几位,右面以0补位
            4、>>
                将二进制数字,向右移动几位,左边以0补位
            5、^
                异或
                将两边的数字转换成二进制进行比较,每位上的数字,只有一个为1时,该位结果才为1,否则为0
                var num1=5;
                var num2=3;

                num1=num1^num2;
                5:101
                3:011
                -----
                r:110 => 6 (num1=6)

                num2=num2^num1;
                3:011
                6:110
                -------
                r:101 => 5 (num2=5)

                num1=num1^num2;
                6:110
                5:101
                --------
                r:011 => 3 (num1=3)
=========================
1、运算符
    1、赋值运算符
        1、使用"="进行赋值
            注意:
                赋值符号的左边,必须是变量
                const PI=3.14;(特殊)
        2、扩展赋值表达式
            +=,-=,*=,/=,%=,&=,|=,^=
            ex:
                var num = 5;
                num+=3; ==> num=num+3;

                num-=5; ==> num=num-5;
            语法:a+=b;==> a=a+b;
    2、字符串连接
        运算符: +
    3、条件运算符(三目运算符、三元运算符)
        单目运算符:!,++,--
        双目运算符:+,-,*,/,%,&&,||,^,&,|,>,<
        三目运算符:需要三个操作数/表达式

        语法:
            表达式1?表达式2:表达式3;
            表达式1的运行结果应为boolean类型
                若表达式1为true,则整个表达式的值为表达式2的运算结果
                若表达式1为false,则整个表达式的值为表达式3的运算结果

        条件表达式允许被嵌套:
        判断考试成绩,如果考试成绩>=80,则输出成绩优秀,如果大于等于60分,输出成绩合格,否则输出不及格
2、函数
    1、什么是函数
        没有函数的弊端:
            1、事件中想执行JS脚本只能逐行编写
            2、可重用性不高
        
        函数(function):可以被称之为方法(method),过程(procedure)

        是一段预定义好,并可以被反复使用的代码块
            1、预定义
                事先声明好的内容,不会马上被执行
            2、反复使用
                提升代码的可重用性
            3、代码块
                允许包含若干条的可执行语句
        其实函数就是一段独立的功能体,同时也是一个功能完整的对象
    2、定义函数    
        语法:
            function 函数名(){
                //函数体(待执行的代码块)
            }

        调用函数:
            在任意合法的JS脚本位置处都可以调用函数。
            语法:函数名();

        练习:
            编写一个函数,名称为change,函数体内要求用户从弹框上录入两个数字,并且进行数字的交换,最后打印输出交换后的两个数字。通过一个 按钮 调用该函数
        学过的函数:
            console.log("World");
            alert();
            prompt();
            document.write();
            Number();
            toString();
            parseInt();
            parseFloat();
            charCodeAt();
            isNaN();
    3、带参数函数的声明
        1、参数
            定义函数数,需要由外部传入到函数内部进行辅助运行的数据,称之为参数
            console.log("Hello World");
        2、声明带参函数
            function 函数名(参数列表){
                
            }

            参数列表:由,隔开的参数名称的声明
            function 函数名(参数1,参数2,参数3){
                
            }
            定义函数时定义的参数称之为"形参(形式参数)"

            调用带参函数:
                函数名(参数列表);
                参数列表:由,隔开的具体参数值来组成的列表。
                调用函数时所传递的参数称之为"实参(实际参数)"
        
        var result=parseInt(35.5);
        console.log(result);
    4、带返回值的函数声明
        1、返回值:调用完函数后,由函数内部返回给函数调用处的一个值。
        2、声明带返回值的函数    
            function 函数名(参数列表){
                //函数体(语句)
                return 值;
            }
            注意:
                1、方法的返回值可以灵活添加,但最多只能有一个
                2、程序碰到return就会返回到函数调用处,所以,return后面的代码是不会被执行的。
    5、函数内调用函数
        function 函数(参数列表){
            /*调用函数*/
            函数();
        }
    6、变量的作用域
        1、什么是作用域
            作用域就是变量与函数的可访问范围,它控制着函数与变量的可见性与生命周期

            JS中作用域可分为以下两种:
            1、函数作用域,只在当前函数内可访问
            2、全局作用域,一经定义,在代码中的任何位置都能访问
        2、函数作用域中的变量
            又称为 局部变量,只能在当前函数中访问,离开函数无法访问
        3、全局作用域中的变量
            又称为 全局变量,定义后,在JS的任何位置处都可以访问得到
            定义方式:
            1、独立于任何function的位置处
            2、声明变量时不使用var关键字
                注意:必须先调用 变量所在的函数后,才可以继续使用全局函数
        4、声明提前
            JS程序在正式运行前,会将所有的var声明的变量和function声明的函数,预读到所在作用域的顶部
            但是对变量的赋值还保留在原有位置。
        5、按值传递
            基本数据类型的数据,在作为实参传递时,实际上将参数的值复制了一份副本进行传递的。
    7、函数的作用域
        也分为“全局作用域(全局函数)”以及“函数作用域(局部函数)”

        全局函数:
            声明在独立于任何function的位置处,位于JS的最外层
        局部函数:
            在一个函数内部定义的函数,就是局部函数
3、分支结构
    1、程序的流程控制
        程序=数据结构 + 算法

        任何复杂算法都有以下几种结构:
        1、顺序结构
        2、分支选择结构
        3、循环结构
    
        分支结构:
            程序在运行过程中,在不同的条件下可以选择执行某些程序

            1、当条件满足时运行某些语句
                当条件不满足时则不运行这些语句-if结构
            2、当条件满足时运行某些语句
                当条件不满足时则运行另外一些语句-if...else 结构
    2、if结构
        1、语法
            if(条件){
                语句块
            }

            执行流程:
                1、判断条件的结果
                    若值为true,则执行if语句块中的语句
                    若值为false,则不执行if语句块中的语句
        2、注意
            1、条件应该是boolean类型的值或表达式
                如果条件不是boolean的话,则会进行自动转换
                以下几种情况会默认转换为 false
                if(0){}
                if(0.0){}
                if(NaN){}
                if(undefined){}
                if(""){}
                if(null){}

                ex:
                    if(28){}
                    if(2.8){}
                    if("我帅吗"){}
            2、if(条件)后的{}可以省略,但不推荐
                如果 省略了{} ,那么if结构只控制if下的第一条语句
    3、if...else 结构
        1、语法
            if(条件){
                //语句块1
            }else{
                //语句块2
            }

            流程:
                1、判断条件
                    若值为true,则执行语句块1
                    (否则)若值为false,则执行语句块2

4、练习
    使用 if 结构 完成 克莱托指数判断






                

猜你喜欢

转载自blog.csdn.net/Xiaotongbiji/article/details/80936829