前端三件套之js（javascript）-学习笔记

编程语言：数据类型/结构，运算，流程控制（分支，循环）

#开发环境
    -开发软件：notepad++
    -运行环境：浏览器，nodejs（内部都集成了js的解释器）
    
#编程规范
    -注释 // 单行注释    /*  */ 多行注释
    -关键字
        在当前的编程环境中已经被定义好的单词或者词组
        比如：public static class void
        这些单词不能用作代码命名
        
    -代码命名规范
        - 一定要遵守规则
          命名必须使用英文大小写，数字，美元符$，下划线_ 构成
          并且不能以数字开头
          
        - 业内一起遵守的规则（尽量）
            变量名：小驼峰 首字母小写，第二个单词开始首字母大写
                    helloWorldNiHao
                    
            函数名：小驼峰
#书写位置
    -写在标签的事件属性中
        <div οnclick="js代码"></div>
        注意：事件属性中一般不会写很多代码，只会写一行代码（调用函数）
      
    -写在页面的<script></script>
        <script>
        js代码
        
        </script>
      
    -写在外部的js文件中  .js
        通过script标签将js文件引入进来
        
#js的测试方式
    -在控制台打印信息
     console.log("信息")
    -使用浏览器自带的弹窗
     alert("信息")
    -直接在页面上输出（前提：页面上没有任何元素）
     document.write("信息")
     
#数据类型（弱类型）
    -弱类型：
        在定义变量时不需要使用特定的单词进行类型的定义，js统一都使用 var
        在使用变量时，变量的值可以随时赋值成任意的类型 var a = 1;a = "hello";a = []
        
    -基本类型
        整数 浮点型（小数） 字符串 "" '' 布尔类型 true/false
        
    -引用类型
        数组，函数（方法），对象
        
    -特殊类型
        null(空指针) NaN(Not A Number)  undefined(未定义)
        
#运算符
    -数学运算符 + - * /   %取余/模
     除法中两个整数相除  10/3=3(商)....1（余数）  10%3=1
     
    -关系判断运算
        > < >= <= == !=  ===全等
        == 只比较数值是否相等  
        === 先比较数据类型，在比较数值
        
    -逻辑判断运算
        并且&&  或者||  取反！
        
    -赋值运算
        a = b  将b的值赋给a
        +=  -=  *=  /=  %=
        
    -拼接运算
        + 如果加号的左右两边都是数字的类型，那就是数字的加法运算
          如果加号的左右两边有一边不是数字的类型，都是拼接运算（最常见的就是字符串和变量的拼接）
          
    -三元运算
        A?B:C
         作用：分支判断（只支持两个情况）
         A：一句条件判断
         B：如果A成立，就会执行B的代码
         C：如果A不成立，就会执行C的代码
         
#js的函数
    -编程中定义函数
        function 函数名(){
        
            函数的内容(代码)
            
        }
        
    -函数的调用
     函数名()
     
    -代码的作用域
        -数据的有效范围
        局部作用域：定义在函数内部的数据，有效范围就在函数内部
        全局作用域：定义在函数的外部，有效范围是整个页面
    -将局部变量变成全局变量
        直接在函数内将变量传给window  window.int = int
     
#取整的方式
    直接强转成整数  parseInt(数据)
    向上取整  Math.ceil(数据) 3.14  4
    向下取整  Math.floor(数据) 3.14  3
    四舍五入取整  Math.round(数据) 3.54  4 3.14 3
    保留小数的方式  数据.tofixed(位数)
    
    
#登录升级3.0
    -获取页面元素
        -根据id获取页面元素
        var e = document.getElementById("idm名字")
        var e = document.querySelector("#id名字")
        偷懒方式：如果id名符合js的命名规则，那么元素可以直接使用id名来操作
        
    -获取文本框(input)的值
        元素.value 
        
    -修改文本框(input)的值
        元素.value = 新值
        
#猜数字
    -规则：电脑随机生成一个1-100之间的整数
        用户输入一个数字，于随机数字进行比对
        js判断是 太大，太小，正好
    
    -页面构建
        标题 结果的div 输入框（数字），猜一下的按钮，重新开始按钮
        
    -生成随机数
        Math.random() 随机一个0~1之间的小数
        
    -修改标签（除了input之外）的内容
        元素.innerText = 新的值
        
    -获取标签（除了input之外）的内容
        元素.innerText
        
    -设置按钮不可用
        元素.disabled = true
        
    -设置文本框不可用
        元素_input.disabled = true