JavaScript的基础

1.JavaScript简介

    作用：可以在浏览器客户端执行前校队行为
    提高了用户体验
    减轻了服务器的负担 

    *是基于对象和事件的语言，应用与客户端
        -基于对象
            **提供好了很多的对象，可以直接拿过来用
        -事件驱动
            **HTML做网站静态效果，JavaScript动态的效果
        -客户端：专门指的是浏览器
    *js的特点
        （1交互性
            -信息的动态交互
        （2安全性
            *JS不能访问本地磁盘的文件
        （3跨平台性
            *java里面是跨平台性 虚拟机
            *只有能够支持JS的浏览器，都可以运行
    *JavaScript和java的区别
        （1java是Sun公司，现在oracle：JS是网景公司
        （2JavaScript是基于对象，java是面向对象
        （3java是强类型的语言，JS是弱类型的语言
            -比如java里面 int i="10‘；
            -JS var i=10 ;var i="10";
        (4JavaScript只需要解析就可以执行，二java需要先编译成字节码文件。在执行
*JavaScript的组成
    三部分组成
        （1 ECMAScript
            -ECMA :欧洲计算机协会
            -有ECMA组织制定的JS的语法，语句....
        （2BOM
                - broswer object modal:浏览器对象模型
        （3DOM
                -document object modal; 文档对象模型

2js与HTML结合方式

第一种
内部的JavaScript
使用标签<script type="text/javascript"> js代码 </script>
在HTML页面中使用<script>标签，在script标签中写js的内容
弊端：和HTML代码混杂在一起，不好维护，不好重用
第二种
外部的JavaScript
使用script标签，引入一个外部文件的js文件 
***创建一个js文件，写js代码
    <script type="text/javascript" src="1.js> js代码 </script>
**使用第二种方式时候，就不要在script标签里js代码了，不会执行。

java  单行 //   多行 /* */  文档注释 /** */  Javadoc
css   多行注释  /*  */
JavaScript  单行 //  多行 /* */

常用函数 
alter("提示框")；
document.write（“向浏览器输出内容”）；

3js的基本数据类型

**java的基本数据类型  byte char int long float doube boolean
**定义变量  都使用关键字 var，var可以省略
            在js中可以重复定义变量，后面定义的变量覆盖前面定义的变量
            js是弱语言，使用var来定义任何数据类型
            typeof（）查看数据类型
            js中变量的类型是由变量的值决定的，所以，只定义不赋值的变量就是
            一个未定义的（undefined），未定义变量不能使用。

            js的基本数据类型
                number  无论整数小数都是number型
                string  无论是字符串还是字符都是string型
                boolean 
                object  对象类型

        ***JS的原始数据类型（五个）
            ***string： 字符串
                ***  var str="abc";
            *** number：数字类型
                *** var m=123;
            ***boolean ture和false
                ***var flag=ture;
            ***null
                ***var data =new Data()
                *** 获取对象的引用，null表示对象的引用为空，所有对象的引用也是object
            ***undifined
                ***定义一个变量，没有赋值。
            **typeof();查看当前变量的数据类型

        类型转换的函数
            string->number(整数）：parseInt(变量）
            string->number(小数): parseFloat(变量)
        转换
        var a="10";
        var b=parseInt(a);

        var a="a10";
        var b=parseInt(a);  则出现的结果是错误的NAN

        var a="10a";
        var b=parseInt(a);
        使用parseInt函数转换时，转换的内容中的第一个是数值类型就可以继续转换直到遇到一个非数值类型为止就停止转换。

        var a="3.14";
        var b=parseFloat(a);

4 运算符

            1）算术运算符 + - * / 
            2）比较运算符 > <  >=  <=  ==
            3）逻辑运算符  &&   ||  !
            4）三木运算符 表达式? true的结果： false 的结果

        var a=10;
        var  b=true; 
        a/b=10;
        a+b=11;
        注意：在js中Boolean可以true用1来代表，false用0来代表    
        **js里面不区分整数和小数
    ** var j=123;
    alert(j/1000*1000);
    //在java里面结果为0；
    //在JS里面不区分整数和小数；123/1000=0.123*1000=123
    **字符串的相加 和 相减的操作
          var str="123";
    **如果相加时候：做过字符串链接 
    **如果相减，做的是相减的运算

    *//字符串的操作
    var str=“456”；
    //alert（str+1）：//在java里面操作的结果是4561. 在JS里面还是4561
    alert(str-1);   //相减时候，执行减法的运算
    *提示NAN：表示不是一个数字
    **Boolean 类型也可以操作
    ***如果设置成true 相当于这个值是1；
    ***如果设置为false 相当于这个值是0
    **== 和 ===区别
    **做判断
    **== 比较的只是值
    ** ===比较的是值和类型
    **引入知识
    直接向里面数出语句（可以把内容显示在页面上）
    *document.write（“aaa");
    document.write("hr/");
    **可以向页面输出变量，固定值
    document.write里面可以有双引号，如果设置标签的属性需要使用单引号
    document.write可以输出变量，还可以输出HTML代码。
    var a=10;
        var  b=true; 
        a/b=10;
        a+b=11;
        注意：在js中Boolean可以true用1来代表，false用0来代表    

5基本的循环语句

**java里面的语句
    **if 判断
        条件可以是布尔值 true成立         false不成立
            number  非0：成立           0不成立了
            string  非空字符串成立  空          字符串不成立
            object     非null成立                  null不成立     
    ** switch 语句
        case的条件
            1）可以使变量，string，number
            2）可以是变量（java是不能变量）

    var i="a";
                var b="b";
                switch(i){
                case “a”: break;
                case  b: break;
                }

            3）还可以是个表达式(java里面不能）
            var age=12;
            switch(true){
                case age>=18: break;
                case a<18: break;
                default:
                    break;              
            }
    **循环 for
    while do-while
**js里面的这些语句
    **if判断语句
        **** =:表示赋值
        **** ==表示判断
    **switch语句
        ** Java里面支持数据类型 string 支持吗？在JDK1.7开始支持
        **js里面都支持
        **switch(a){
            case 5: 
                    break;
            case 6: 
                    break;
            default: 
            .....
    **循环语句 for while do-while
            **while循环
            **** var i=5;
            while(i>1){
                alert(i);
                i--;
            }
      **for循环
        *** for(var i=0;i<=10;i++){}
      *** i++ ++i 和java里面一样

    for-in语句
        作用：遍历数组
            对象
            注意
                遍历对象的时候，变量是属性的名称，如果获取属性值则p[i];
        for(var 遍历 in 数组||对象)  

        定义数组
        var arr=[10,20,30,40];
        //遍历数组
        //使用for循环

for(var i=0;i<arr.length;i++){
                document.write(arr[i]+",");
            }

            for(var i in arr){
                document.write(arr[i]+",");             
            }                       

        定义对象
        function Person(name,age){
            this.name=name;
            this.age=age;
        }   
        //创建对象
        var p=new Person("eric",20);

        for(var i in p){
            document.write(p[i]+",")

        with 语句方便函数的调用
        with(对象){
            直接写对象的名字，不需要写对象的名称。
            }                       
        with(document){
            write("输出语句");
        }   

6全局变量和局部变量

***全局变量 ：在scrip标签里面定义一个变量，这个变量在页面中js部分都可以使用
--在方法外部使用，在方法内部使用，在另一个scrip标签使用
***局部变量：在方法内部定义的一个变量，只能值方法内部使用
    -如果在方法的外部调用这个变量，提示错误
    -SCRIPT009;"nn"未定义
**JS自带了一个调试工，IE8以上的版本中，键盘F12 ，在页面下方出现一个条

7scrip放置的位置

    ***建议把scrip标签放到</body>后面
**如果现在有这样一个要求：
    在JS里面需要获取到input里面的值，如果把scrip标签放在head里面
    会出现问题
    HTML解析是从上到下解析的，scrip标签放的是head里面，直接在里面取input里面的值
    因为页面还没有解析到input那一行，肯定取不到。
    //代码

var input1=document.getElementById("nameId");
        alert(input.value);
        <body>
            <input typr="text" name="name" id="nameId" value="aaa"/>
        </body>