search

Home  >  Article  >  Web Front-end  >  Javascript_6_custom object

Javascript_6_custom object

黄舟
黄舟Original
2017-01-18 16:30:201071browse

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>

The above is the content of Javascript_6_Custom object. For more related content, please pay attention to the PHP Chinese website (www.php .cn)!


Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：Javascript_5_with statement_Math object_Global object_for in statementNext article：Javascript_5_with statement_Math object_Global object_for in statement

Related articles

See more