zoukankan      html  css  js  c++  java
  • js中定义对象的几种方式

    转载:http://blog.sina.com.cn/s/blog_60f632050100wz7h.html

    (1)基于已有对象的扩充方法:适用于临时构建对象,弊端:每次构建对象都要新建一个。

    [html] view plain copy
     
    1. var object=new Object();  
    2.   
    3.    object.name="Tom";  
    4.    object.sayname=function(name)  
    5.    {  
    6.        this.name=name;  
    7.        alert(this.name);  
    8.    }  
    9.   
    10.    object.sayname("James");  

    (2)工厂方法 :可以重复返回多个对象。

    [html] view plain copy
     
    1. function createObject(){  
    2.   
    3.     var object=new Object();  
    4.     object.username="Tom";  
    5.     object.password="123";  
    6.     object.get=function(){  
    7.         alert(this.username+","+this.password);  
    8.     }  
    9.   
    10.     return object;  
    11. }  
    12.   
    13. var o1=createObject();  
    14. var o2=createObject();  
    15. o2.username="james";  
    16. o1.get();  
    17. o2.get();  

    工厂方法的改进:

    因为js的函数定义是指向一个应用的对象,所以每次构建一个object对象,都会构建一个get方法的对象,现在将get方法分离,那么就是多个object对象共用一个get对象,这样就可以节省内存空间。改进如下:

    [html] view plain copy
     
    1.   function get(){  
    2.   alert(this.username+","+this.password);  
    3. }  
    4.   
    5.   function createObject(username,password){  
    6.       
    7.         var object=new Object();  
    8.         object.username=username;  
    9.         object.password=password;  
    10.         object.get=get;  
    11.   
    12.         return object;  
    13.     }  
    14.     var o1=createObject();  
    15.     var o2=createObject();  
    16.     o1.get();  
    17.     o2.get();  



    (3)构造方法创建对象:

    [html] view plain copy
     
    1. <span style="white-space:pre">    </span>function getInfo(){  
    2.     <span style="white-space:pre">        </span>alert(this.username+","+this.password);  
    3.     <span style="white-space:pre">    </span>}  
    4.      
    5.         function Person(username,password){  
    6.            //在执行第一行代码前,js引擎会生产一个对象。即浏览器  
    7.             this.username=username;  
    8.             this.password=password;  
    9.             this.getInfo=getInfo;  
    10.             //此处隐含了一个return object的语句。  
    11.          
    12.         }  
    13.        //只有在使用new Person();才会有上述Person中注释出现的情况,如果不适用new语句是不会          //成功的。  
    14.         var person=new Person("Tom","abc");  
    15.         person.getInfo();  
    16.         var person2=new Person("Jame","123");  
    17.         person2.getInfo();  


    (4)原型方法:(prototype)
    因为js的所有类都是继承Object,Object中有prototype属性,因此自定义的对象也有prototype属性:如下

    [html] view plain copy
     
    1. function Person(){}  
    2.   
    3. Person.prototype.username="Tom";  
    4. Person.prototype.password="1325";  
    5.   
    6. Person.prototype.getInfor=function(){  
    7.     alert(this.username+" , "+this.password);  
    8. }  
    9.   
    10. var person=new Person();  
    11. var person2=new Person();  
    12. person.username="James";  
    13. person.getInfor();  
    14. person2.getInfor();  


    这种方法的缺点就是不能传递参数,只能在创建后修改属性。另外使用这种方法定义的对象都贡献同样的属性,因为他们都共用了object对象中的prototype对象,所以所有的对象贡献原型中的属性,其中一个更改了属性,也会反映到其他对象中去。

    为了解决原型方法中对象贡献属性,可以采用构造方法+原型的方法去构建对象。把属性用构造方法定好。具体方法就用原型设置。
    如下:

    [html] view plain copy
     
    1. <script type="text/javascript">  
    2.   
    3.     function  Person(password){  
    4.      
    5.         this.username=new Array();  
    6.          
    7.         this.password=password;  
    8.      
    9.     }  
    10.   
    11.     Person.prototype.getInfo=function(){  
    12.         alert(this.username+","+this.password);  
    13.     }  
    14. var p1=new Person("abc");  
    15. p1.username.push("Tom");  
    16. p1.getInfo();  
    17.   
    18. </script>  


    (5)动态原型的方法:

    [html] view plain copy
     
      1. function Person(username,password){  
      2.      
      3.     this.username=username;  
      4.     this.password=password;  
      5.   
      6.     if( typeof Person.first=="undefined" ){//通过设置标志量让getInfo只生成一次对象。  
      7.      
      8.         alert("invoke");  
      9.   
      10.         Person.prototype.getInfo=function(){  
      11.             alert(this.username+" , " +this.password);  
      12.         }  
      13.     Person.first=true;  
      14.      
      15.     }  
      16.   
      17. }  
      18.   
      19. var p1=new Person("Tom","123");     
      20. var p2=new Person("James","abc");  
      21. p1.getInfo();  
      22. p2.getInfo();  
  • 相关阅读:
    Java-GZIPOutputStream踩坑
    Redis事务
    Netty实现简单群聊
    SpringMVC请求参数解析
    Netty实现WebSocket
    SpringBoot项目war包部署
    NIO实现群聊
    SpringMVC请求映射handler源码解读
    SpringMVC自定义兼容性HandlerMapping
    spring boot自定义类配置绑定在配置文件中自动提示
  • 原文地址:https://www.cnblogs.com/zr123/p/8109341.html
Copyright © 2011-2022 走看看