Maison > Article > interface Web > Objet Javascript_6_custom

Objet Javascript_6_custom

黄舟original: 2017-01-18 16:30:201070parcourir

Javascript_6_Custom Object

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=GBK" />
    <title>javascript演示8_自定义对象</title>
    </head>
    <body>
    <h1>javascript演示8_自定义对象</h1>
    <script type="text/javascript" src="a.js">    </script>
    <script type="text/javascript">
    /*
     * JS当中用函数可以完成JAVA中的自定义对象！
     * 为与一般函数区分：首字母大写
     * 动态给对象添加属性，直接函数名.属性名赋值即可
     * 动态给对象添加方法，直接赋值为匿名函数即可！
     */
    function Person(){//相当于构造器
        println("Person run");
    }
    Person();
    //打印出：Person run
    Person.country="CN";
    println(Person.country);//CN
    Person.show=function(){
        println("show run...");
    }
    Person.show();//show run...
    //建立对象：使用new 函数名()即可！
    var p=new Person();
    p.name="pre_eminent";
    p.age="20";
    p.method=function(){
        println(this.name+"..."+this.age);
    }
    p.method();//pre_eminent...20
    //由上可知：直接为对象的属性赋值为一个匿名函数
    //就是给对象添加了一个方法（即行为）！
    var obj=new Object();
    obj.name="GOD";
    obj.age=2013;
    println(obj.name+"..."+obj.age);//GOD...2013
    /*
     * 下面代码是：先描述 后调用！
     */
    function Person(name,age){
        this.name=name;
        this.age=age;
        this.setName=function(n){
            this.name=n;
        }
        this.setAge=function(a){
            this.age=a;
        }
        this.getName=function(){
            return this.name;
        }
        this.getAge=function(){
            return this.age;
        }
    }
        //建立一个该类的对象,并传参
        var p=new Person("xixi",22);
        println(p.getName());//xixi
        println(p.getAge());//22
        p.setName("hehe");
        p.setAge("23");
        println(p.getName());//hehe
        println(p.getAge());//23
        for(i in p){
            println(i);
            //println(p.i);这样调用全是undefined!
            //println(p[i]);
        }        
        /*下面是打印i的结果：
         * name
            age
            setName
            setAge
            getName
            getAge
         */
        /*下面是打印p[i]的结果：
         * xixi
            22
            function(n){ this.name=n; }
            function(a){ this.age=a; }
            function(){ return this.name; }
            function(){ return this.age; }
         */
        document.write("<hr />");
        //下面演示另外一种自定义对象的方式：
        //用大括号封装实体！键值用冒号连接,键值对之间用分号隔开
        var p1={
            //定义一些成员
            "name":"史湘云","age":20,"getName":function(){
                return this.name;
            },"getAge":function(){
                return this.age;
            }
        }
        println(p1.name);//史湘云
        println(p1.age);//20
        //也可以这样：（二者区别在哪儿？？？）
        println(p1["name"]);//史湘云
        println(p1["age"]);//20
        /*
         * 通过上面可以看出：
         * 对象调用成员有两种方式：
         * 1，对象.属性名
         * 2，对象["属性名"]
         */    
         //for in语句遍历自定义对象
         for(i in p1){
             println(p1[i]);
         }
         /*这样子取得是等于号右边的内容（即值）
          * 史湘云
            20
            function(){ return this.name; }
            function(){ return this.age; }
          */
         for(i in p1){
             println(i);
         }
         /*这样子取得是等于号左边的内容（即名称）
          * name
            age
            getName
            getAge
          */
         for(i in p1){
             println(p1.i);//啥也没有，全是undefined
         }
         //下面接着演示第2种自定义对象的方式：
        //用大括号封装实体！键值用冒号连接,键值对之间用分号隔开
        var map={
            1:"林黛玉",2:"史湘云",3:"薛宝钗"
        }
        var girl=map[1];
        println(girl);//返回：林黛玉
        var girl=map[2];
        println(girl);//返回：史湘云
        var girl=map[3];
        println(girl);//返回：薛宝钗
        //不也可以通过一个函数通过键拿值
        function get(key){
            return map[key];
        }
        for (var i=1; i <= 3; i++) {
          println(get(i));
        }
        /*
        林黛玉
        史湘云
        薛宝钗
        */
        //编程习惯：如果是实体 变量名就用object的o打头
        var oX=new Person();
        var bY=true;
        var iZ=2467;
//下面接着演示更为复杂的第2种自定义对象的方式：
//用大括号封装实体！键值用冒号连接,键值对之间用分号隔开
        var oMap={
            1:"林黛玉",2:"史湘云",3:"薛宝钗"
        }
        var omyObj={
            myname:"pre_eminent",
            myage:20//注意：结尾千万不能有逗号
        }
        println(omyObj.myname);//pre_eminent
        println(omyObj["myname"]);//pre_eminent
        //下面这种：键也是字符串格式，效果一样！
        var omyObj2={
            "myname2":"pre_eminent",
            "myage2":20
        }
        println(omyObj2.myname2);//pre_eminent
        println(omyObj2["myname2"]);//pre_eminent
        //复杂的形式：
        var myMap={
            names:["A","B","C","D","E"],
            ages:[18,20,22,24,21]//注意：结尾千万不能有逗号
        }
        println(myMap.names[2]);//返回C
        println(myMap.names[3]);//返回D
        var myMap2={
        names:[{name1:"林黛玉"},{name2:"史湘云"}]
        }
        println(myMap2.names[1].name2);//返回:史湘云
    </script>
    </body>
</html>

Ce qui précède est le contenu de Javascript_6_Custom Object Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www. .php.cn) !

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Javascript_5_with instruction_Math object_Global object_for dans l'instructionArticle suivant：Javascript_5_with instruction_Math object_Global object_for dans l'instruction

Articles Liés

Voir plus