很久没碰过javascript的时候,会把javascript的一些基本知识混淆,尤其是对面向对象编程这一块,所以我重新编写了一些代码来清楚说明!

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml">  
  3. <head>  
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
  5. <title>javascript 不同写法中的理解</title>  
  6. </head>  
  7.  
  8. <body>  
  9. </body>  
  10. <script type="text/javascript">  
  11.    /*  
  12.     1。 静态类,静态属性,静态方法,不能够创建实例,不能使用new  
  13.      在内部访问各自内容时使用this  
  14.      静态类是没有原型可言的  
  15.    */ 
  16.    var t ={    
  17.        name:"t"    
  18.     }  
  19.    t.fn = function(){  
  20.       alert(this.name);  
  21.        
  22.    }  
  23.    //new t().fn();//失败  
  24.    t.fn();//成功  返回 t  
  25.    /*  
  26.    2。给方法添加原型方法    
  27.    */ 
  28.    var o = function(){  
  29.         this.name = "o";  
  30.    }  
  31.      
  32.    o.prototype.fn = function(){  
  33.         alert(this.name);  
  34.    }  
  35.    //o.fn();//失败  
  36.    new o().fn();//成功 返回 o  
  37.      
  38.    /*  
  39.    3。v 和 v.fn 是没有任何关系的,两个是独立体  
  40.     这里是定义两个对象:定义v.fn对象和给v添加原型方法  
  41.    */ 
  42.  
  43.    var v = function(){  
  44.       this.name = "v";  
  45.       this.test = function(){  
  46.         alert("this is test fun");  
  47.       }  
  48.    }  
  49.      
  50.    v.fn = v.prototype = {  
  51.       init:function(){  
  52.         alert(this.name);  
  53.       }  
  54.    }  
  55.     
  56.    new v().init();//成功返回 v  
  57.    v.fn.init();//返回undefined  
  58.    //v.fn.test();//失败  
  59.   // new v.fn().init();//失败  
  60.     
  61.    /*  
  62.    4。 p是没有原型可言的,在本实例中  
  63.      r.prototype = p;  
  64.      是把p里面所有的属性和方法赋给r,p里面的属性和方法与r里面的属性和方法有相同时,取的是r里面的属性和方法  
  65.    */ 
  66.    var r = function(){  
  67.       this.name = "r";  
  68.       this.test = function(){  
  69.          alert("r:"+this.name);  
  70.       }  
  71.    }  
  72.    var p = {  
  73.       name:"p",  
  74.       age:"22",  
  75.       fun:function(){  
  76.         alert("p:"+this.name);  
  77.       }  
  78.    }  
  79.      
  80.    r.prototype = p;  
  81.      
  82.    new r().test();//返回 r:r  
  83.    new r().fun();//返回 p:r  
  84.    alert(new r().age);//返回22  
  85. </script>  
  86. </html>