JavaScript面向对象（1）--属性和方法的定义

2024-04-27 14:19:26

字体：大中小

来源：转载

供稿：网友

javaScript面向对象（1）--属性和方法的定义

06 年就开始接触Javascript，那是只是用JavaScript做前端验证。随着Ajax的兴起，基于JavaScript的富客户端开始大行其道。10年的时候开始使用各种JavaScript控件，当时还模仿其他控件的实现方式写了一个公式编辑器控件，粗略的学了一点JavaScript的面向对象知识。近期闲来无事，准备重新学习JavaScipt，并记录与此。

面向对象的核心概念包括：类、对象、公有属性、私有属性、静态属性、公有方法、私有方法和静态方法。

JavaScipt作为特殊的面向对象语言（相对于Java、C#而言）也能够实现这些概念，不过有些细微区别。

1、类

JavaScript中定义类有很多方法

1 //  定义12 function Class()3 {4 }5 //定义26 Class = function ()7 {8 }

2、对象

object = new Class();

3、属性和方法

  1 function MyClass()  2 {  3     // 私有属性  4         var PRivateName = "private";  5     //注册到window对象的私有属性，可以通过Window访问，其他特性和私有方法一样  6 　　 windowName = "window";  7     // 公有属性1  8     this.publicName1 = "public1";  9      10     //私有方法 11     var privateMethod = function(executeOtherMethod) 12     { 13         alert("privateMethod"); 14         //这里的this是window 15         //可以访问私有属性 16         alert(privateName); 17         // 无法通过this访问私有属性，因为this就是window 18         //alert(this.privateName); 19         //可以访问window私有属性 20         alert(windowName); 21         // 可以通过this访问window私有属性，因为this就是window 22         alert(this.windowName); 23         // 无法访问公有属性 24         //alert(publicName1); 25         //alert(publicName2); 26         // 无法访问静态属性 27         //alert(staticName); 28  29         //可以访问私有方法 30         alert(privateMethod()); 31         alert(windowMethod()); 32         // 无法访问公有方法 33         //alert(publicMethod1()); 34         //alert(publicMethod2()); 35         // 无法访问静态属性 36         //alert(staticMethod()); 37     } 38      39     //注册到window的私有方法，可以通过Window访问，其他特性和私有方法一样 40     windowMethod = function() 41     { 42         alert("windowMethod"); 43         //这里的this是window 44         //可以访问私有属性 45         alert(privateName); 46         // 无法通过this访问私有属性，因为this就是window 47         //alert(this.privateName); 48         //可以访问window私有属性 49         alert(windowName); 50         // 可以通过this访问window私有属性，因为this就是window 51         alert(this.windowName); 52         // 无法访问公有属性 53         //alert(publicName1); 54         //alert(publicName2); 55         // 无法访问静态属性 56         //alert(staticName); 57  58         //可以访问私有方法 59         alert(privateMethod()); 60         alert(windowMethod()); 61         // 无法访问公有方法 62         //alert(publicMethod1()); 63         //alert(publicMethod2()); 64         // 无法访问静态属性 65         //alert(staticMethod()); 66     } 67      68     //调用私有方法，将在创建对象时调用 69     //windowMethod(); 70      71     //公有方法1 72     this.publicMethod1 = function() 73     { 74         alert("publicMethod1"); 75         //这里的this是类的实例对象 76         //可以访问私有属性 77         alert(privateName); 78         alert(windowName); 79         //通过this访问公有属性 80         alert(this.publicName1); 81         alert(this.publicName2); 82         //通过this.constructor访问静态属性 83         alert(this.constructor.staticName); 84          85         //可以访问私有方法 86         alert(privateMethod()); 87         alert(windowMethod()); 88         //通过this访问公有方法 89         alert(this.publicMethod1()); 90         alert(this.publicMethod2()); 91         //通过this.constructor访问静态方法 92         alert(this.constructor.staticMethod()); 93     } 94 } 95 //静态属性 96 MyClass.staticName = "staticName"; 97 // 公有属性2 98 MyClass.prototype.publicName2 = "public2"; 99 100 //公有方法2101 //注意：与类里定义的公有方法不同，无法访问私有属性和私有方法102 MyClass.prototype.publicMethod2 = function()103 {104     alert("publicMethod2");105     //这里的this是类的实例对象106     //无法访问私有属性107     //alert(privateName);108     //可以访问window属性109     alert(windowName);110     //通过this访问公有属性111     alert(this.publicName1);112     alert(this.publicName2);113     //通过this.constructor访问静态属性114     alert(this.constructor.staticName);115     116     //无法访问私有方法117     //alert(privateMethod());118     //可以访问window方法119     alert(windowMethod());120     //通过this访问公有方法121     alert(this.publicMethod1());122     alert(this.publicMethod2());123     //通过this.constructor访问静态方法124     alert(this.constructor.staticMethod());125 }126 127 //静态方法128 MyClass.staticMethod = function()129 {130     alert("staticMethod");131     //这里的this是类MyClass132     //这里的this是类的实例对象133     //无法访问私有属性134     alert(privateName);135     //可以访问window属性136     alert(windowName);137     //无法访问公有属性138     //alert(this.publicName1);139     //可以通过this.prototype访问publicName2140     alert(this.prototype.publicName2);141     //通过this.constructor访问静态属性142     alert(this.staticName);143     144     //无法访问私有方法145     //alert(privateMethod());146     //可以访问window方法147     alert(windowMethod());148     //无法访问公有方法publicMethod1149     //alert(this.publicMethod1());150     //可以通过this.prototype访问publicMethod2151     alert(this.prototype.publicMethod2());152     //通过this访问静态方法153     alert(this.staticMethod());154 }155 var object = new MyClass();156 //可以直接访问注册到window的属性和方法157 alert(windowName);158 windowMethod();159 //访问公有方法160 object.publicMethod1();161 object.publicMethod2();162 //访问静态方法163 MyClass.staticMethod();164 object.constructor.staticMethod();

从上面的代码我们可以了解到一下内容：

（1）privateName和windowName都具有私有属性的特点，即可以在类内部访问，但windowName是注册到window对象中的（是window对象的一个属性）

（2）privateMethod和windowMethod与第一条相同，windowMethod是注册到window对象中的（是window对象的一个方法）

（3）私有方法privateMethod和windowMethod能够访问私有属性和私有方法，无法访问公共属性、公共方法、静态属性、静态方法，调用时this指向window

（4）类内通过this定义的公有方法publicMethod1可以直接访问私有属性和私有方法，调用时this指向类的实例，因此可以通过this访问公有属性和公有方法，通过this.constructor访问静态属性和静态方法

（5）类外通过prototype定义的公有方法publicMethod2无法访问私有属性和私有方法，调用时this指向类的实例，因此可以通过this访问公有属性和公有方法，通过this.constructor访问静态属性和静态方法

（6）静态方法staticMethod无法访问私有属性、私有方法、类内定义的公有属性、类内定义的公有方法，可以通过this.prototype访问通过prototype定义的公有属性和公有方法，可以通过this访问静态属性和静态方法

还是用表格总结一下比较清楚

私有属性

window属性

私有方法

window方法