Javascript設計模式讀書筆記一
1、Javascript 類的使用。在使用幾年的Javascript中,感覺還不是很深入,只是用得比較膚淺。基本上寫的都是一些小函式，沒怎麼用過類。
比如說：
function startAnimation(){
…
}
function staopAnimation(){
…
}
上面的做法很簡單就是一個開始和結束動畫的函式，但是無法建立可以儲存狀態並且可以對內部狀態進行操作的動畫物件。下面是定義的類的實現：
var Anim=function(){
…
};
Anim.prototype.start=function(){
…
}
Anim.prototype.stop=function(){
…
}
類的使用：
var myAnim=new Anim();
myAnim.start();
…
myAnim.stop();
上面定義一個類Anim並且把兩個方法賦給類的prototype屬性。
如果更喜歡把類的定義封裝在一條宣告中，可以使用下面的程式碼：
var Anim=function(){
…
};
Anim.prototype={
Start:function(){
…
}.
Stop:function(){
…
}
};
以上程式碼還可以以另外一種風格程式碼如下：
Function.prototype.method=function(name,fn){
this.prototype[name]=fn;
};
var Anim=function(){
…
};
Anim.method(‘start’,function(){
…
});
Anim.method(‘stop’,function(){
…
});
Function.prototype.method用於為類新增新方法。第一個表示方法名稱，第二個表示用作新方法的函式。
可以進一步修改Function.prototype.method,使其可以鏈式呼叫。這隻需要讓他返回this值即可。程式碼如下：
Function.prototype.method=function(name,fn){
this.prototype[name]=fn;
return this;
};
var Anim=function(){
…
};
Anim.method(‘start’,function(){
…
}).method(‘stop’,function(){
…
});
以上就採用五種方式完成同一項工作。
2、匿名函式
(function(){
…
})()
Eg:
(function(foo,bar){
alert(foo*bar);
})(10,2)
匿名函式最有趣的用途是用來建立閉包。閉包是一個受到保護的變數空間。另外javascript具有函式級的作用域。這意味著定義在函式內部的變數在函式外部不能訪問。這就意味著函式執行在它定義的的作用域中，而不是呼叫在它的作用域中。通過這兩個因素就可以把變數包裹在匿名函式中而對其加以保護。你可以如下建立類的私有變數：
var baz;
(function(){
var foo=10;
var bar=2;
baz =function(){
return foo*bar;
};
})();
baz(); //baz可以訪問foo,bar，儘管這個方法在匿名函式的外部執行。
baz定義在閉包中，所以它能訪問foo,bar 這兩個匿名函式中的變數。
執行結果：運彈出網頁訊息20;
3、物件的易變性
在js中，一切物件都是都是易變的。這意味著你能使用在大多數的語言中不允許的技術，例如為函式新增屬性。
function displayError(message)
{
displayError.numTimesExecuted++;
alert(message);
alert(displayError.numTimesExecuted);
};
displayError.numTimesExecuted=0;
這也意味著你可以對先前定義的類和例項化的物件進行修改。
如下所示演示修改類以及例項化後修改物件：
function Person(name,age){
this.name=name;
this.age=age;
};
Person.prototype={
getName:function(){
return this.name;
},
getAge:function(){
return this.age;
}
}
//例項化物件
var alice=new Person(‘Alice’,20);
var bill=new Person(‘Bill’,30);
//修改類
Person.prototype.getGreeting=function(){
return ‘Hi’+this.getName()+’!’;
};
//修改一個特定的例項
alice.displayGreeting=function(){
alert(this.getGreeting());
}
getGreeting在例項化物件建立後建立的，但他們兩個例項仍可獲得這個方法。另外displayGreeting只有alice例項得到這個方法，其它例項就沒有。
4、繼承。繼承在js中不像另的面嚮物件語言中那樣簡單。JS使用的是基於物件的(原形式(prototypal))繼承，它可以用來模仿基於類的(類式(classical))繼承。這兩種方式以後會講。