Maison > interface Web > js tutoriel > le corps du texte

Objet Javascript_6_custom

黄舟
Libérer: 2017-01-18 16:30:20
original
1071 Les gens l'ont consulté

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>
Copier après la connexion

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) !


Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal