本文轉載于javaeye(
http://www.javaeye.com/wiki/Object_Oriented_JavaScript/1279-javascript-object-oriented-technology-one),只進行了重新排版以便收藏。
文中所有英文語句(程序語句除外)，都引自<<javascript-the definitive guide,5th edition>>。
------------------------------------------------------------------------------------
類變量/類方法/實例變量/實例方法
先補充一下以前寫過的方法:
在javascript中，所有的方法都有一個call方法和apply方法。這兩個方法可以模擬對象調用方法。它的第一個參數是對象，后面的參數表示對象調用這個方法時的參數(ECMAScript specifies two methods that are defined for all functions, call() and apply(). These methods allow you to invoke a function as if it were a method of some other object. The first argument to both call() and apply() is the object on which the function is to be invoked; this argument becomes the value of the this keyword within the body of the function. Any remaining arguments to call() are the values that are passed to the function that is invoked)。比如我們定義了一個方法f()，然后調用下面的語句：
f.call(o, 1, 2);
作用就相當于
o.m = f;
o.m(1,2);
delete o.m;
舉個例子：
1
function Person(name,age) 
{ //定義方法
2
this.name = name;
3 this.age = age;
4
}
5
var o = new Object(); //空對象
6alert(o.name + "_" + o.age); //undefined_undefined
7
8Person.call(o,"sdcyst",18); //相當于調用:o.Person("sdcyst",18)
9alert(o.name + "_" + o.age); //sdcyst_18
10
11Person.apply(o,["name",89]);//apply方法作用同call,不同之處在于傳遞參數的形式是用數組來傳遞
12alert(o.name + "_" + o.age); //name_89
---------------------------------
實例變量和實例方法都是通過實例對象加"."操作符然后跟上屬性名或方法名來訪問的，但是我們也可以為類來設置方法或變量，
這樣就可以直接用類名加"."操作符然后跟上屬性名或方法名來訪問。定義類屬性和類方法很簡單：
1Person.counter = 0; //定義類變量,創建的Person實例的個數
2function Person(name,age) {
3 this.name = name;
4 this.age = age;
5 Person.counter++; //沒創建一個實例,類變量counter加1
6};
7
8Person.whoIsOlder = function(p1,p2) { //類方法,判斷誰的年齡較大
9
if(p1.age > p2.age) {
10 return p1;
11 } else {
12 return p2;
13
}
14}
15
16var p1 = new Person("p1",18);
17var p2 = new Person("p2",22);
18
19alert("現在有 " + Person.counter + "個人"); //現在有2個人
20var p = Person.whoIsOlder(p1,p2);
21alert(p.name + "的年齡較大"); //p2的年齡較大
prototype屬性的應用:
下面這個例子是根據原書改過來的.
假設我們定義了一個Circle類，有一個radius屬性和area方法，實現如下:
1function Circle(radius) {
2 this.radius = radius;
3 this.area = function() {
4 return 3.14 * this.radius * this.radius;
5 }
6}
7var c = new Circle(1);
8alert(c.area()); //3.14
假設我們定義了100個Circle類的實例對象，那么每個實例對象都有一個radius屬性和area方法。實際上，除了radius屬性，每個Circle類的實例對象的area方法都是一樣，這樣的話，我們就可以把area方法抽出來定義在Circle類的prototype屬性中，這樣所有的實例對象就可以調用這個方法，從而節省空間。
1function Circle(radius) {
2 this.radius = radius;
3}
4Circle.prototype.area = function() {
5 return 3.14 * this.radius * this.radius;
6 }
7var c = new Circle(1);
8alert(c.area()); //3.14
現在，讓我們用prototype屬性來模擬一下類的繼承：首先定義一個Circle類作為父類，然后定義子類PositionCircle。
1function Circle(radius) { //定義父類Circle
2 this.radius = radius;
3}
4Circle.prototype.area = function() { //定義父類的方法area計算面積
5 return this.radius * this.radius * 3.14;
6}
7
8function PositionCircle(x,y,radius) { //定義類PositionCircle
9 this.x = x; //屬性橫坐標
10 this.y = y; //屬性縱坐標
11 Circle.call(this,radius); //調用父類的方法,相當于調用this.Circle(radius),設置PositionCircle類的
12 //radius屬性
13}
14PositionCircle.prototype = new Circle(); //設置PositionCircle的父類為Circle類
15
16var pc = new PositionCircle(1,2,1);
17alert(pc.area()); //3.14
18 //PositionCircle類的area方法繼承自Circle類,而Circle類的
19 //area方法又繼承自它的prototype屬性對應的prototype對象
20alert(pc.radius); //1 PositionCircle類的radius屬性繼承自Circle類
21
22/**//*
23注意:在前面我們設置PositionCircle類的prototype屬性指向了一個Circle對象,
24因此pc的prototype屬性繼承了Circle對象的prototype屬性,而Circle對象的constructor屬
25性(即Circle對象對應的prototype對象的constructor屬性)是指向Circle的,所以此處彈出
26的是Circ.
27*/
28alert(pc.constructor); //Circle
29
30/**//*為此,我們在設計好了類的繼承關系后,還要設置子類的constructor屬性,否則它會指向父類
31的constructor屬性
32*/
33PositionCircle.prototype.constructor = PositionCircle
34alert(pc.constructor); //PositionCircle