美文网首页
01-25 js基础属性

01-25 js基础属性

作者: ychaochaochao | 来源:发表于2019-02-11 19:26 被阅读0次

    什么是js

    1.什么是js
        js全称是javascript,是web标准中的行为标准,主要负责网页中内容的变化。
        js和python一样是脚本语言    
        2.js代码写在什么地方
        a.内联 js  - 写在标签的事件相关属性中,例如onclick属性(鼠标点击事件)
        b.内部js - 写在script标签中,script可以放在head和body中
        c.外部js - 写在一个js文件中,然后在html中通过script导入   
        console.log()  相当于python中的print
        window.alert() 弹出弹框 
        3.js能做什么
        a.可以修改标签内容
        b.修改标签属性
        c.修改标签样式
        d.添加网页内容
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8" />
            <title></title>
            <!--外部js 
                在script标签的src中设置要导入的js的文件路径(可以是本地的,也可以是网络的)
            <script type="text/javascript" src="index.js"></script>         
            <!--内部的-->
            <script type="text/javascript">
                //在这儿写js代码
                window.alert('内部js')
            </script>
        </head>
        <body>
            <!--内联的-->
            <button onclick="window.alert('你好')">按扭</button>
            
            <p id='p1'>我是段落</p>
            <button onclick="document.getElementById('p1').innerText = 'hello js'">修改内容</button>        
        </body>
    </html>
    

    一:js基础语法

    //1.注释
        //单行注释 - 注释前加两个斜杠
        /*多行注释
         * 
         */
        //2.标识符
        //由数字、字母、下划线和$组成,数字不能开头.命名一般不用$符,$有特殊功能
        //数字不能开头
        num = 1
        $Str1 = 'ads'
        
        //3、关键字
        //for , in ,while ,if , else , true , flase等等,有特殊功能的标识符
        
        //4.数据类型和字面量
        // Number - 数字类型 , String字符串 ,Boolean布尔,Array数组 ,Object对象 ,Function函数等
        // Number - 23 , 23.12(支持科学计数法)NaN(不存在的数字Infinity无穷大)
        
        //String字符串 - 'asdf' , "asd"
        console.log('asd',"gsda")
        
        //Boolean布尔 - true和false两个值
        
        //  Array数组 - 相当于python中的列表;[]
        //对象 - 相当于python中的字典 + 对象;{属性名:属性值}属性值可以是任何类型,属性名可以有引号也可没有
        
        //Function - 相当于python中的函数  
        //0.2 查看类型和类型转换
        //查看类型: typeof(数据)
        console.log(typeof(100))
        //类型转换:类型名()
        int1 = parseInt() 转换成整型
        Float1 = parseFloat() 转换成浮点型
        num = Number('ads')  #结果是NaN
        console.log(num)    
    

    二:变量

    //1.基本语法
        //  格式1:  变量名 = 值  和python一样的
        //  格式2:var 变量名 = 值  
        //单独声明一个变量
        同时声明多个变量赋不同的值;注意,使用var声明变量的时候,可以不给变量赋值,默认是unfefined
        a = b = c = 10
        a1 = 10 ,b1 = 20
        var a2, s2,d2   
    

    三:运算符

    //js支持:数学运算符,比较运算符,逻辑运算符,赋值运算符,位运算符
        //1.数学运算符:+ - * / % ,++ ,--(比python少了//和**,多了++,--)
        // ++(自加1) , -- (自减1)
        //变量++、++变量    让变量自己的值加1
        //变量-- 、 --变量    让变量自己的值减1
        num = 10
        num++   //相当于num += 1
        --num   
        console.log(num)
        num1 = 10
        num2 = num1++   //num2结果是10,先赋值再加1
        
        num11 = 10
        num22 = ++num11  //num22结果是11,先加1再赋值
        
        //2.比较运算符:>,< ,>= ,<=,==,!=,===,!==
        //比较大小和python一样,结果都是布尔
        //== 判断值是否相等,!=判断值是否不相等
        //===判断值和类型是否相等,!==判断值和类型是否不相等(相当于python的==和!=)
        console.log(5 == 5)   //true
        console.log(5 == '5')   //true
        console.log(5 === '5')   //false
        
        //3.逻辑运算符:&& (逻辑与)、||(逻辑或)、!(逻辑非)
        //运算规则和python一样
        
        //4.赋值运算符: = , += ,-=,*=,/=,%=
        //运算规则和python一样
        
        //5.位运算:&、|、~,^
        //运算规则和python一样
        
        //6.复合运算和python一样
        //运算顺序和python一样
        
        //7.三目运算符
        // ?: -- 条件语句?值1:值2   (条件语句成立结果是值1,不成立结果是值2) 
        age = 20
        console.log(age>=18?'成年':'未成年') 
    

    四:分之结构

    //js中的分之结构有两种:if语句、switch语句
    //1. if语句
    /*
    if (条件语句){
    条件语句成立时执行的代码段
    }
    if (条件语句){
    条件语句成立时执行的代码段
    }else{
    不成立时执行的代码段
    }
    if (条件语句){
    条件语句成立时执行的代码段
    }else if(条件语句2){
    条件语句2成立时执行的代码段
    }else{
    前面都不成立时执行的代码段
    }
    //2.switch语句
    a.语法:
    switch(表达式){
    case 值1:{代码段1
    }
    case 值2:{代码段2
    }
    default:{代码段3
    }
    }
    注意:case后面的{}可以省略,代码段也可以没有
    b.执行过程:先计算表达式的结果,然后再从上往下一一和case后面的值进行比较,判断是否相等;
    找到第一个和表达式结果相等的case,然后将这个case作为入口 ,依次执行分之后面的所有代码段,直到执行到最后一个代码段或者遇到break才结束。
    、、如果表达式的结果和每个case的值都不相等,就直接执行default作为入口,执行后面的代码段(default一般放在最后)
    

    五:循环

    //js中的循环结构有两种:for循环、while循环
    //1.for循环
    //a,python中的for循环:for- in
    /*
    for (变量 in 序列){
    循环体
    }
    注意:不管序列是什么类型,这个变量取的都是下标或者属性名(相当于key)
    //b.C的for循环
    for(表达式1;表达式2;表达式3){
    循环体
    }
    执行过程:先执行表达式1,再执行表达式2为真,就执行循环体。再执行表达式3,再执行表达式2为真,就执行循环体。
    //1-100相加的和
    for(num=1,sum=0;num<=100;num ++){
    sum +=num
    }
    /*
    1.python的while循环
     */
    while(条件语句){
        循环体
    }
    /*
     C中的do-while
     
     do{
        循环体 
     }
     while(条件语句)
     
     执行过程:先执行一次循环体,然后才判断条件语句是否为true
    

    六:函数
    function 函数名(参数列表){
    函数体

    //js中所有的名字都用驼峰式命名(多个单词首字母大写)
    //注意:不支持关键字参数 。 不支持不定长参数。。不支持多个返回值
    //声明函数的时候就是声明类型是Function的变量
    //匿名函数
    function(参数列表){
    函数体

    注意:如果函数体中没有return,函数的返回值是undefined
    </script>
    func1 = function(a){
    console.log(a)
    }

    相关文章

      网友评论

          本文标题:01-25 js基础属性

          本文链接:https://www.haomeiwen.com/subject/cufceqtx.html