JavaScript基础应用例子

javaScript基础应用例子

点我下载所有基础这里写链接内容例子

调用javascript

<html>
    <head>
        <title>javascript-编写javascript代码的第一种方式</title>
        <script type="text/javascript" >
            function test(){
                alert("这是事件驱动");
            }
        </script>

    </head>
    <body>
    <!--
      如何编写javascript代码的第三种方式(行内js)
      A:行内js代码实际上就是js编程中的事件驱动
      B:由页面的某个元素触发一个事件
         完成某个功能
      C:编写一个js函数,负责按钮点击,输出语句
      D:在按钮所在的input标签中加入onclick事件
      E:通过onclick事件触发编写好的js函数


    -->
        <input type="button" value="test1" onclick="test();"/><br>


    </body>
</html>

js注释

如何编写javascript代码的注释
      A:// 单行注释
      B:/* */多行注释

javascript-变量

<html>
    <head>
        <title>javascript-变量</title>

    </head>
    <body>
    <!--
    javascript代码中的变量
    A:在javascript语言中变量定义
      在java语言中,变量定义
      考虑三要素
      数据类型  变量名称 = 初始化值;

      在js语言中,变量定义只考虑二要素:变量名称和初始化值(甚至初始化值都可以不写)
      语法
      var 变量名称 = 初始化值;



    -->
        <script type="text/javascript" >
            //定义变量  其初始化值为1
            var a = 1;
            //输出变量
            alert(a);
        </script>
        <input type="button" value="test1" /><br>


    </body>
</html>

javascript-变量2

<html>
    <head>
        <title>javascript-变量</title>
        <meta charset="UTF-8"/>
    </head>
    <body>
    <!--
    javascript代码中的变量特点
    A:在js语言中,变量的类型是由其值决定的
    js语言是一种弱类型语言,就是在定义变量时不会指定其数据类型
    所以其变量的数据类型是在运行期,赋值时指定的,变量的数据类型就是值的数据类型
    相对的java就是强类型语言,在编码过程中就定义好了变量的唯一数据类型,在赋值时,所用的值
    必须符合定义时的数据类型,如果不符合,则会在编译阶段报错误

    所以在进行js编程时,要随时提醒使用的变量原有是什么数据类型的
    B:同名称变量的问题
    在java代码中,同一个作用域内,是不能出现相同名称的变量的
    在js代码中,同一个作用域中,是可以出现相同名称变量的  至于哪一个起作用,就看代码的编写顺序了
    定义两个变量,并不是后一个覆盖前一个的值(不是赋值)、
    C:在js代码中,如果变量只是被定义,而没有被赋值是正确,其值是undefined
    在java代码中,如果变量只是被定义,而没有被赋值是错误(注意成员变量在使用前,如果没有手动赋值,肯定有默认值)
    D: 当变量没有被定义,而被直接使用,是错误



    -->
        <script type="text/javascript" >
            /*js中的变量时弱类型
            //定义变量  其初始化值为1  此时a的数据类型是一个数值型
            var a = 1;
            //再次给变量a赋值  赋值为字符串"aaa"  那么此时变量a的数据类型就由数值型变成了字符串型
            a = "aaa";
            //输出变量
            alert(a);
            */
            /*
            同名变量的问题
            var a = 1;
            alert(a);
            var a = "aaa";
            */
            /*讲解变量只被定义  没有被赋值  其值是默认值  undefined
            var a;
            alert(a);
            */
            //以下代码的b根本就没有被定义过  所以直接使用就是错误
            alert(b);

        </script>
        <input type="button" value="test1" /><br>


    </body>
</html>

typeof运算符

<html>
    <head>
        <title>javascript-typeof</title>
        <meta charset="UTF-8"/>
    </head>
    <body>
    <!--
    javascript代码中的typeof运算符
    A:因为在js代码中,变量的类型是靠变量的值来决定的   
    所以会引出在大量的js代码中,查找js变量的数据类型是很麻烦的
    所以在js中出现了一个运算符 typeof 专门用来判断变量的数据类型
    B:语法
    typeof 变量名称
    typeof(变量名称)
    C:typeof的结果都是字符串 
    用不同的字符串代表不同的数据类型

    "string"   String 字符串类型
    "number"   数值型
    "boolean"  布尔型
    "undefined"  Undefined类型
                 Null类型


    "object"   Object类型  但是如果使用typeof去测试null  也是object 但是null属于Null型
    "function"  函数型





    -->
        <script type="text/javascript" >
            //字符串类型
            //var str = "aaa";
            //alert(typeof str);

            //数值型
            //var num = 1;
            //var num = 1.25;
            //alert(typeof num);

            //布尔型
            //var bb = true;
            //alert(typeof bb);

            //Null型
            //var nn = null;
            //alert(typeof nn);//返回"object"

            //Undefined
            var aa;
            alert(typeof aa);//undefined

        </script>


    </body>
</html>

javascript-函数

<html>
    <head>
        <title>javascript-函数</title>
        <meta charset="UTF-8"/>
    </head>
    <body>
    <!--
    javascript代码中的函数
    A:定义语法
    java中的方法就是js语言中的函数(叫法一样)
    方法就是完成某个功能的代码
    java中方法的定义语法:
    修饰符  返回值类型  方法名称(形式参数1,形式参数2,...) 抛出异常类型{
            方法体
            return 返回值;
    }
    要注意return后返回值的数据类型要符合返回值类型

    js中的函数语法:
    function 函数名称(形式参数1,形式参数2,...){
          方法体
          return 返回值;
    }
    语法说明
    function  表明编写的是一个js函数、
    函数名称  给这个函数起一个名字
    形式参数  在js语法中的形式参数只需要参数名称(变量名称)
    方法体   执行某个功能的代码
    return 返回值   
       return后是否需要返回值只和需求有关  没有任何的语法检查
       返回值是什么数据类型只和需求有关   没有任何的语法检查

    B:js中函数的调用语法
    函数名称();

    C:js中可以使用匿名函数,但是为了使用这个函数
    通常我们需要给它起一个名字  由于以上的原因,则匿名函数定义看起来像是给变量赋值

    var 函数名称 = function(形式参数1,形式参数2,...){
            方法体
            return 返回值;
    };

    -->
        <script type="text/javascript" >
          /*
          普通定义函数的方式
          //定义函数 fun1
          function fun1(){
            alert("111");
          }

          //调用函数fun1
          fun1();
          */

          var fun1 = function(){
            alert("111");
          }

          fun1();

        </script>


    </body>
</html>

javascript-函数2

<html>
    <head>
        <title>javascript-函数</title>
        <meta charset="UTF-8"/>
    </head>
    <body>
    <!--
    javascript代码中的函数的执行顺序
    A:在js代码中是没有函数重载的
      在js代码中,如果函数出现同名称,则后面的会把前面的覆盖掉
      最终执行的是最后定义的函数
      所以可以认为在js中是没有函数重载的

    B:如果使用函数定义是普通函数定义,则在解释执行js代码时;
       会先执行函数定义解析流程,在这个流程中处理处理函数名称相同的问题,后面的函数会把前面的相同名称
       函数覆盖掉;执行完解析定义流程后,再执行解释执行流程,如果有函数调用,则会执行调用语句

    C: 如果使用函数定义是匿名函数定义,则在解释执行js代码时;
       或遵循自上而下的执行顺序,函数定义的解析和函数调用语句的执行是自上而下顺序执行的


    -->
        <script type="text/javascript" >
        /*
         普通函数的定义 执行  和重载
         // x1();
          function x1(){
            alert("111")
          }
          //x1();
          function x1(a,b){
            alert("222");
          }
          x1();
          function x1(a){
            alert("333");
          }
          //x1();
         // x1(1,2);
          //x1(3);
          */
          //x1();
          var x1 = function(){
            alert("111");
          }
          x1();
          var x1 = function(a,b){
             alert("222");
          }
          //x1();
          var x1 = function(a){
             alert("333");
          }

          x1();
        </script>


    </body>
</html>

javascript-函数3

<html>
    <head>
        <title>javascript-函数</title>
        <meta charset="UTF-8"/>
    </head>
    <body>
    <!--
    javascript代码中的函数的特点
    A:在调用函数时,可以不遵循函数的参数个数
     在调用定义好的函数时,无论参数个数对于定义还是少于定义都不是错误
     在函数定义时,定义了形式参数,但是在调用函数时没有传递,则形式参数的值就是undefined
     如果函数调用时给的参数值少于 形式参数的个数,则在函数执行时,会按照对应的位置给形式参数赋值
     没有对应到的形式参数其值就是undefined
     如果函数调用时给的参数值个数多于  形式参数的个数,则在函数执行时,多余的赋值不会被函数的形式
     参数接收

    B:js函数的返回值,没有语法限制,只和需求有关
       函数没有定义返回值   如果直接使用这个函数的返回值  其返回值就是undefined
       函数的返回值如果修改数据类型,不用修改函数的定义体
    -->
        <script type="text/javascript" >
        /*
         函数调用时可以按照需求传递参数
          function add(a,b){
            alert(a);
            alert(b);
          }

          add(1,2,3);
          */
          function add(a,b){
            return a+b;
          }
          alert(add());
        </script>
    </body>
</html>

javascript-运算符

<html>
    <head>
        <title>javascript-运算符</title>
        <meta charset="UTF-8"/>
    </head>
    <body>
    <!--
    javascript代码中的运算符
    A:js的运算符大部分的计算方式都和java的运算符一致
    B:算数运算符的除法
    在java语言中,除法是整除(两数相除取商)
    在js语言中,除法就是真正的数学运算  (因为js没有小数型,只有数值型)
    C:比较运算符的  "=="  和  "==="
    在js中"="  "=="  和  "==="的区别?
    "="是赋值运算符  是把右边的结果给左边
    "=="是比较运算符  如果判等运算符的两边变量的值相等  结果就是true 否则就是false
    "==="是比较运算符  全等比较运算符   它两边的变量的值相等、数据类型相等  结果就是true 否则就是false
    -->
        <script type="text/javascript" >
        /*
          var x = 4;
          var y = 5;
          alert(x/y);//0.8
          */
          var x = 4;
          var y = "4";
          alert(x==y);//true
          alert(x===y);//false

        </script>


    </body>
</html>

javascript-数据类型

<html>
    <head>
        <title>javascript-数据类型</title>
        <meta charset="UTF-8"/>
    </head>
    <body>
    <!--
    javascript代码中的数据类型-字符串型
    A:在js编程中是没有字符型的
    B:字符串类型的定义方式
      B1:使用双引号
      B2: 使用单引号

      注意:可以只使用双引号或者只使用单引号
            但是不能混合使用

    C:字符串参数运算
    "+" 字符串连接符  只是简单地拼接字符串
    "-" 字符串连接符如果是"-"  则前后两个字符串做减法  如果其中某个运算因子不是数字,则结果是NaN
    -->
        <script type="text/javascript" >
                //var xx = "1211";
                //alert(typeof xx);
                //var xx = 'ahna';
                //alert(typeof xx);
                //var xx = "xxxkkk';错误
                //alert(typeof xx);
                var x1 = "11";
                //var x2 = "22"
                var x2 = "a";
                alert(x1-x2);

        </script>


    </body>
</html>
<html>
    <head>
        <title>javascript-数据类型</title>
        <meta charset="UTF-8"/>
    </head>
    <body>
    <!--
    javascript代码中的数据类型-数值型
    A:在js代码中,没有整数型和小数型之分,只有数值型
    B:常见的数值型值
       1  20  ......
       1.25  3.5 ......
       NaN
       Infinity
    C: 在js代码中小数也是具有有效数位的
       (小数也是不精确的)
    D:NaN
        NaN是属于数值型的一个值,不是错误,但是可以用来判定错误位置
           如果在编写程序时,某个表达式的值是NaN,则说明它所在的表达式没有问题,而是前面的代码出现问题
        它表示应该得到一个数值,可以没有的到一个数值
        NaN 就是Not A Number
    E:Infinity 
       表示无穷大
       如果除法的除数是0,则结果就是无穷大
    F: 和数值型相关的几个全局函数
    全局函数:
    就是在js代码中,直接可以使用的函数
    isNaN(); 重点  true:表示不是一个数字     false:表示是一个数字
    注意:对于字符串的值是数字  使用isNaN()进行判定  结果是false 它认为是一个数字
    Number(); 把某些数据类型的数值转成数值型
    几个需要背诵的
    null使用Number()会被转成0
    true使用Number()会被转成1
    false使用Number()会被转成0
    Number()可以把任何类型的数据都转成一个数值,如果数据值的本身就是一个数字,则直接转;
    如果数据值的本身不是一个数字,则不会错误,直接转成NaN
    parseInt(); 要不就是数字要不就是NaN
    parseFloat();  要不就是数字要不就是NaN

    -->
        <script type="text/javascript" >
           /*
           var x = 4;
           var y = 'a';
           alert(x/y);//NaN
           */
           /*
           var x = 4;
           var y = 0;
           alert(x/y);//Infinity 
           */

           //isNaN()
           /*
           var x1 = "111";
           alert(isNaN(x1));//false
           */

           //Number()
           /*
           var x1 = 10;
           var x2 = "111";
           var x3 = "aaa";
           var x4 = null; //背诵
           var x5;
           var x6 = true; //背诵
           var x7 = false; //背诵
           var x8 = 0;

           alert(Number(x1));//10
           alert(Number(x2));//111
           alert(Number(x3));//NaN
           alert(Number(x4));//0
           alert(Number(x5));//NaN
           alert(Number(x6));//1
           alert(Number(x7));//0
           alert(Number(x8));//0
           */

           var x1 = 10;
           var x2 = 1.25;
           var x3 = 1.65;
           var x4 = "aaa";
           var x5 = "111";
           var x6;
           var x7 = null;
           var x8 = true;
           var x9 = false;

           alert(parseInt(x1));//10
           alert(parseInt(x2));//1
           alert(parseInt(x3));//1
           alert(parseInt(x4));//NaN
           alert(parseInt(x5));//111
           alert(parseInt(x6));//NaN
           alert(parseInt(x7));//NaN
           alert(parseInt(x8));//NaN
           alert(parseInt(x9));//NaN

        </script>


    </body>
</html>
<html>
    <head>
        <title>javascript-数据类型</title>
        <meta charset="UTF-8"/>
    </head>
    <body>
    <!--
    javascript代码中的数据类型-布尔型
    A:在js代码中,布尔型的值只有truefalse
    B:在js代码中,truefalse是可以参与运算的
       通常true可以被转成1参与运算
       false可以被转成0参与运算
    C:Boolean(); 
       把其它数据类型的数据转成布尔型
       如果有值,并且值可以代表具体指,则转化成true
       如果没有值,或者有值,但是值代表没有,则转化成false
    D: 布尔型还是常用于判定条件
       但是如果判定条件使用的不是一个布尔类型的值,则不会错误
       会直接使用Boolean()函数把其转成true或者false,再进行判定条件


    -->
        <script type="text/javascript" >
        /*
            var x1 = true;
            var x2 = 2;

            //x1布尔型,直接参与数学运算,则会默认使用Number()把其值转成数值型
            //alert(x1+x2);//3

            var x3 = true;
            var x4 = false;
            alert(x3+x4);//1  true被转成1  false被转成0
        */
        /*
           var x1 = 10;
           var x2 = 1.25;
           var x4 = "aaa";
           var x5 = "111";
           var x6;
           var x7 = null;
           var x8 = 0;

           alert(Boolean(x1));//true
           alert(Boolean(x2));//true
           alert(Boolean(x4));//true
           alert(Boolean(x5));//true
           alert(Boolean(x6));//false
           alert(Boolean(x7));//false
           alert(Boolean(x8));//false
           */
           var x1 = "aaa";
           if(x1){
             alert('111');
           }else{
             alert('222');
           }



        </script>


    </body>
</html>
<html>
    <head>
        <title>javascript-数据类型</title>
        <meta charset="UTF-8"/>
    </head>
    <body>
    <!--
    javascript代码中的数据类型-Null型和Undefined型
    A:Null型只要一个可用值  就是null
       null使用typeof测定其类型  属于object类型
       所以基本数据类型Null类型是属于Object类型的

    B: Undefined型只有一个可用值  就是undefined
       它表示变量被定义,但是并没有被赋值
       如果变量没有定义就使用,在js中就是错误

       实际上没有被赋值的变量并不是没有值,而是默认被赋值为undefined
       eg:
       var x;
       alert(x);//undefined

    所有的数据类型:
    基本数据类型
    字符串
    数值
    布尔
    Null
    Undefined

    引用数据类型
    Object
    Function

    -->
        <script type="text/javascript" >




        </script>


    </body>
</html>

JavaScript语句

<html>
    <head>
        <title>javascript-数据类型</title>
        <meta charset="UTF-8"/>
    </head>
    <body>
    <!--
    javascript代码中的语句
    A:分类
       顺序结构
         在普通的script语句块中,默认都是顺序结构
       选择结构
       循环结构
    B:选择结构
       if  重点
       switch
       注意:判定条件可不一定值就是true或者false
    C:循环结构
       for  重点
       while
       do while

       注意:
       js中for循环的循环自变量的作用域范围不仅仅是在循环体内部



    -->
        <script type="text/javascript" >

          for(var i=1;i<=5;i++){
             alert(i);
          }

          alert(i);


        </script>


    </body>
</html>

全局变量

<html>
    <head>
        <title>javascript-全局变量</title>
        <meta charset="UTF-8"/>
    </head>
    <body>
    <!--
    javascript代码中的全局变量
    A:在js代码中,没有定义在函数内部的变量都叫做全局变量
      全局变量会在整个页面的js代码中共用
      但是如果有函数在定义全局变量之前执行,则会报出错误


    B: 如果在函数中不写var就定义变量,则这个变量不是局部变量‘
       而是定义了一个全局变量

    -->
        <script type="text/javascript" >
        /*
           function test3(){
                alert(i);
           }
           test3();
         */



        </script>
        <script type="text/javascript" >
           //var  i = 10;
           function test1(){
                //alert(i);
                //i = 20;//不用var定义就类似于定义了一个全局变量 var i = 20;
                var i = 20;//这样是定义了test1函数的一个局部变量  出了test1函数的范围就不能访问
           }
           test1();



        </script>
        <script type="text/javascript" >
           function test2(){
                alert(i);
           }
           test2();



        </script>


    </body>
</html>

javascript-局部变量

<html>
    <head>
        <title>javascript-局部变量</title>
        <meta charset="UTF-8"/>
    </head>
    <body>
    <!--
    javascript代码中的局部变量
    A:局部变量就是定义在某个函数内的变量
    B:局部变量的作用域只在函数内部
    C:局部变量可用的数据类型(js中就是这个局部变量可用的值)
       所有的数据类型的值都可以作为局部变量的值

       讲解函数作为局部变量的值

    D:匿名函数做返回值
    E: 匿名函数做函数的参数


    -->
        <script type="text/javascript" >

        //匿名函数做函数的返回值
        /*
        function test1(a,b){
          var xx = function(a,b){
             return a+b;
          }
          return xx;
        }
        var yy = test1(1,2);
        //就是做了
        /*
        var yy = function(a,b){
             return a+b;
          }
        */
        //alert(yy(3,4));
        //alert(test1(1,2)(3,4));
        /*
        test1(1,2)(3,4)的执行过程:
        A:先执行test1(1,2)
        返回一个匿名函数
        function(a,b){
             return a+b;
        }
        B:再使用3 和 4去执行以上的匿名函数

        function(3,4){
             return 3+4;
        }
        */


        //匿名函数做函数的参数
        /*
        function add(a,b){
            return a+b;
        }
        */
        var add = function(a,b){
            return a+b;
        }

        function test(xx,c){
           return xx()+c;
        }

        alert(test(add,3));//NaN
        /*
        计算过程:
        A:把add函数体赋值给形式参数func
        B:在test函数执行时,func()实际上就是add函数执行
           但是由于没有给a和b赋值,造成在func函数中a和b都是undefined
           造成func()的结果是一个NaN 
           然后互再使用NaN 和 3做加法  结果还是一个NaN

        */
        /*
        Student st = new Student();
        test1(Student st1){
        }
        test1(st);


        //var xx = fuction(){}
        function xx(){}
        function test(func){
        }
        test(xx);
        */

        </script>



    </body>
</html>

javascript-Object类型



javascript-Object类型



javascript代码中定义类并创建对象

<html>
    <head>
        <title>javascript-Object类型</title>
        <meta charset="UTF-8">
    </head>
    <body>
    <!--
    javascript代码中定义类并创建对象
    A:定义类就是编写函数
    因为定义类就是定义函数,所以请一定在定义时使用类的标识符语法
    eg:
    学生类
    属性:姓名  年龄
    行为:学习

    B: 函数本身就是构造方法
     使用new 函数名称();  就是给函数传值,给其中的成员变量赋值
    C:函数中定义的匿名函数通常都是类定义的行为
    D:在类的定义中的所有的getter方法中return后的this不能省写


    -->
        <script type="text/javascript" >
            /*
            function Student(){
            //属性
              this.name = "aaa";
              this.age = 21;
            //行为
              this.study = function(){
              }
            }
            var st = new Student();
            alert(typeof Student);//function
            alert(typeof st);//object
            */
            function Student(name,age){
              //属性
              this.name = name;
              this.age = age;
              //setter getter
              this.setName = function(name){
                    this.name = name;
              }
              this.getName = function(){
                    return this.name;
              }

              this.setAge = function(age){
                   this.age = age;
              }
              this.getAge = function(){
                    return this.age;
              }

              //行为
              this.study = function(){
                 alert("study");
              }
            }

            var st1 = new Student("aaa",21);
            var st2 = new Student("bbb",22);
            //测试的name属性每个对象一个
            //alert(st1.name);
            //alert(st2.name);

            //测试setter方法
            //st1.setName("ccc");
            //alert(st1.name);

            st1.study();


        </script>



    </body>
</html>

javascript代码中使用对象字面量

<html>
    <head>
        <title>javascript-Object类型</title>
        <meta charset="UTF-8">
    </head>
    <body>
    <!--
    javascript代码中使用对象字面量
    A:对象字面量属于常量
    B:对象字面量的语法
       {属性名称:属性值,属性名称:属性值,...}
    C: 使用对象字面量定义一个学生类
     eg:
     学生类
     姓名  年龄
     学习

    -->
        <script type="text/javascript" >
             //使用对象字面量定义一个学生类
             var student = {
                 name:"aaa",
                 age:21,
                 study:function(){
                    alert("study");
                 }
             };
             alert(typeof student);//object
              student.name = "bbb";
             //输出属性name的值
             alert(student.name);

        </script>



    </body>
</html>

javascript代码中使用对象特点

<html>
    <head>
        <title>javascript-Object类型</title>
    </head>
    <body>
    <!--
    javascript代码中使用对象特点
    A:在js中,创建对象之后,是可以再次给对象添加属性的
       两种添加属性方式
       第一种使用类本身添加
       第二种使用对象添加

       区别:
       如果是给类添加的,则这个类的所有对象都有
       如果是给某个对象添加的,则只有这个对象才有
       如果给类和某个对象都添加了,则对于这个对象听自己的

    B:在js中,添加行为就是添加变量(和添加属性的方法没有区别);
       只不过添加属性的变量的值是一个具体值,而添加行为的变量的值是一个函数体

    -->
        <script type="text/javascript" >
            function Student(name,age){
              //属性
              this.name = name;
              this.age = age;
              //setter getter
              this.setName = function(name){
                    this.name = name;
              }
              this.getName = function(){
                    return this.name;
              }

              this.setAge = function(age){
                   this.age = age;
              }
              this.getAge = function(){
                    return this.age;
              }

              //行为
              this.study = function(){
                 alert("study");
              }
            }

            var st1 = new Student("aa",20);
            var st2 = new Student("bb",21);


            //给对象添加属性
            st1.name = "bb";//修改属性name的值

            //使用类添加属性
            //Student.prototype.sex = 1;
            //alert(st1.sex);
            //alert(st2.sex);

            //使用对象本身添加属性
            //st1.sex = 2;//给st1添加属性sex
            //alert(st1.sex);
            //alert(st2.sex);

            //给类添加行为
            /*
            Student.prototype.test = function(){
                alert("这是给对象添加的test行为");
            }
            st1.test();
            st2.test();
            */
            /*
            st1.test = function(){
               alert("这是给对象添加的test行为");
            }
            st1.test();
            st2.test();
            */
            /*
            st是对象,只能给对象添加属性和行为
            var st = {
               name:"aaa",
               age:21
            };
            */
          function test(){
             var x = 10;
             alert(b);
          }

          test();

        </script>



    </body>
</html>

javascript代码中和对象相关的操作符

<html>
    <head>
        <title>javascript-Object类型</title>
    </head>
    <body>
    <!--
    javascript代码中和对象相关的操作符
   A:in操作符
    在使用方式上类似于增强for循环
    作用是遍历对象的属性和行为名称(就是变量名称)
    语法
    for(var 变量名称  in  对象名称){
    ......
    迭代对象中的每一个属性和行为的名称
    }
   B:在js中另一个获取属性值的方式
   对象名称['属性名称']

   C:delete 操作符
   它可以删除对象的属性

   注意:它只能删除对象的属性,而不能删除类的属性

    -->
        <script type="text/javascript" >
            function Student(name,age){
              //属性
              this.name = name;
              this.age = age;
              //setter getter
              this.setName = function(name){
                    this.name = name;
              }
              this.getName = function(){
                    return this.name;
              }

              this.setAge = function(age){
                   this.age = age;
              }
              this.getAge = function(){
                    return this.age;
              }

              //行为
              this.study = function(){
                 alert("study");
              }
            }

            var st1 = new Student("aa",20);
            //in操作符
            /*
            //alert(st1.name);
            //alert(st1['name']);

            //测试in操作符
            //如何使用in操作符迭代输出对象的每个属性值
            for(var xx in st1){
               //alert(name);
               //先拆分属性和行为  因为属性和行为在js对象中都是变量
               //可以使用typeof操作符  如果其结果不是function字符串,就是属性
               //直接使用typeof操作符可以使用其函数的使用方式
               //typeof的结果肯定是一个字符串  需要把这个字符串和'function'判等  
               //在js中字符串判等请使用"=="或者"==="

               if(typeof(st1[xx]) != 'function'){
                   //使用typeof操作符判断,如果属性的值不是函数体
                   //则它肯定是Student类的属性
                   //获取其属性值
                   alert(st1[xx]);
               }



               //如何通过变量名称获取其值

               //alert(typeof(st1[xx]));
            }
            */

            //delete操作符
            /*
           st1.sex = 1;
           alert(st1.sex);//1  st1对象被添加过属性sex
           delete st1.sex;
           alert(st1.sex);//undefined  使用delete删除了对象st1的属性sex
           */
           //delete st1.name;
           //alert(st1.name);

           //var st2 = new Student("bb",20);
           //alert(st2.name);

           st1.sex = 1;
           /*
           for(var xx in st1){
           alert(xx);
           }
           */
           /*
           delete st1.sex;
           delete st1.name;
           for(var xx in st1){
           alert(xx);
           }
           */







        </script>



    </body>
</html>

javascript代码中的内置对象-String对象

<html>
    <head>
        <title>javascript-Object类型</title>
    </head>
    <body>
    <!--
    javascript代码中的内置对象-String对象
    A:直接可以使用一个字符串创建一个字符串对象
     eg:
     String x1 = "aaa";
     String x2 = new String("aaa");

     System.out.println(x1==x2);
     System.out.println(x1.equals(x2));

     String x1 = "aaa";
     x1 += "bbb";
    B: 内置对象,String的常见方法
    length  求字符串长度
    charAt()  返回某个下标位置的字符
    concat()  连接字符串
    indexOf()  返回小字符串在大串出现的第一次索引值
    lastIndexOf()   和indexOf类似,就是从后往前查找
    split()  按照某个分隔符把字符串转成数组
    substr()  从哪开始取  取几个
    substring()   从哪开始取  取到哪
    toLowerCase()  小写
    toUpperCase()   大写
    -->
        <script type="text/javascript" >
            //var str = new String("abcdeabcgh");
            //alert(str);
            //length  求字符串长度
            //alert(str.length);
            //charAt()  返回某个下标位置的字符
            //alert(str.charAt(0));
            //concat()  连接字符串
            //alert(str.concat('fgh'));
            //indexOf()  返回小字符串在大串出现的第一次索引值
            //alert(str.indexOf('abc'));
            //lastIndexOf()   和indexOf类似,就是从后往前查找
            //alert(str.lastIndexOf('abc'));
            //substr()  从哪开始取  取几个
            //alert(str.substr(3,5));
            //substring()   从哪开始取  取到哪
            //alert(str.substring(3,5));
            //toLowerCase()  小写
            //toUpperCase()   大写
            //alert(str.toUpperCase());


             var str = new String("a-b-c-d-e-f");
            //split()  按照某个分隔符把字符串转成数组
            var strArr = str.split('-');
            alert(strArr.length);




        </script>



    </body>
</html>

javascript代码中的内置对象-Array

<html>
    <head>
        <title>javascript-Object类型</title>
    </head>
    <body>
    <!--
    javascript代码中的内置对象-Array
    A:java中数组和集合的区别?
    1、数组的长度一定固定就不能修改
    2、数组可以存储基本数据类型  也可以存储引用数据类型
       但是集合只能存储引用数据类型
    3、数组中的元素类型必须一样  而集合可以任意
    B:js中的数组
    在java的数组中有两种初始化方式
    一种是静态的
    一种是动态的
    在js中数组的初始化页分静态和动态
    静态:通常在编程中都是使用静态的
    语法   
    var 数组名称  = [];
    动态:
    js的动态初始化有两种
    var 数组名称 = new Array(数组元素值1,数组元素值2,....);
    var 数组名称 = new Array(元素个数);

    C: 数组的特点
       C1:js中的数组是可以存放任意类型的元素的
       C2:js中的数组可以改变其长度

    D:数组常用的2个方法
    push()  放入数组  重点
    pop()  取出数组中  是把数组的最后一个元素从数组中取出  (不仅仅是取出其值)

    E:reverse()
    把数组元素颠倒位置
    -->
        <script type="text/javascript" >
             //静态初始化一个数组xx  有3个元素  分别是10 20 30 
             //var xx = [10,20,30];

             //动态初始化
             //动态初始化一个数组xx  有3个元素  分别是10 20 30 
             //var xx = new Array(10,20,30);
             //动态初始化一个数组xx  有3个元素
             //var yy = new Array(3);

             //数组中可以存放任意类型的数据
             /*
             var xx = [10,"sed",true,null,function(){
                var xx = 'aaa';
             },[10,34,"yyy"]];
             alert(xx.length);//6
             xx[7] = 'hehe';//给任意位置的下标7赋值
             alert(xx.length);//8
             alert(xx[6]);//undefined 因为上句话给下标7赋值了,那么数组中就肯定有下标为6的元素 但是没有赋值
             */

             /*
              var xx = [];
              xx.push('aaa');
              xx.push(20);
              alert(xx.length);//2
              alert(xx.pop());//20
              alert(xx.length);//1
              */

              var xx = [10,'awe',true];
              xx.reverse();//颠倒数组
              alert(xx);//true,awe,10
        </script>



    </body>
</html>

javascript代码中的内置对象-Date

<html>
    <head>
        <title>javascript-Object类型</title>
    </head>
    <body>
    <!--
    javascript代码中的内置对象-Date
    A:Date表示日期
    所有的编程语言中的日期都是从1970.01.01到当前时间的毫秒数
    java.util.Date
    java.sql.Date
    以上的两个日期类型如何换算?
    以上的java.sql.Date是java.util.Date的子类
    给了任意一个的对象,可以首先使用getTime()转换成对应的毫秒数,然后再使用另外一种的
    构造函数Date(long date) 创建其对应的对象

    B:在任何语言中常见的使用日期类的作用
      B1:获取当前时间
      Date date = new Date();
      在java中获取当前日期通常都不是本地的显示格式
      SimpleDateFormat
          format  把日期按照某种格式转换成字符串
          parse   把符合某个格式的字符串转成日期

      在js中
      toLocaleString

      B2:单独获取年  月  日  时  分  秒
      在java中,通常使用Calendar来单独获取每个时间单位以及时间的计算

      在js中,有直接的获取时间单位的方法
      getFullYear()  获取年份
      getMonth()  获取月份
      getDate()  获取日期
      getHours() 获取时
      getMinutes() 获取分
      getSeconds() 获取秒

    -->
        <script type="text/javascript" >
        //获取当前日期
        /*
        var date = new Date();
        var dateStr = date.toLocaleString();
        alert(dateStr);
        */

        //通过当前日期获取时间元素
       var date = new Date();
       alert(date.getFullYear());//年2016
       alert(date.getMonth());//月6
       alert(date.getDate());//日1
       alert(date.getHours());//时14
       alert(date.getMinutes());//分34
       alert(date.getSeconds());//秒25
       //注意:月份需要+1

        </script>



    </body>
</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值