很久之前就在用JavaScript了，只是用的比較表層，會寫幾個函數而已，也沒有深入的研究過。最近一段時間，由于項目的需要，看了一些關于JavaScript的書，也寫了不少的JavaScript的代碼，慢慢開始對這個東東著迷了。現在JavaScript在Web應用中的比重越來越大，各種好用的庫也層出不窮，即使對JavaScript了解的比較淺顯，也可以利用各種利器做出很不錯的作品。但是，較為深入的了解一下JavaScript的特性，對于更熟練的使用它肯定還是有很大的幫助的。
JavaScript是一種基于原型（prototype-based）的語言，而Java是基于類（class-based）的語言。對于我這種先學習Java再學習JavaScript的人來說，總是會不自覺的用一些Java的概念去往JavaScript上套用。比如說，我就很想在JavaScript中使用類似Java中super.someMethod()。但是很多JavaScript的資料上最常見的寫法是：
someObject.prototype.someMethod = function(){…};
這樣就是完全改寫了父類的方法，是無法滿足需求的。
借助JavaScript中的apply或者call，就可以實現在子類中調用父類方法。
假設如下場景：根據不同的數據對生成的圖形進行不同形式的填充。父類負責生成基本的圖形，子類根據需求對父類生成的圖像進行填充。
代碼如下：
<html>
<head>
<meta content="text/html; charset=UTF-8"/>
<script type="text/javascript">
Shape = function() {
this.id = null;
this.picture = null;
this.draw = function(canvas){
this.picture = "由父類產生的圖像已經生成在畫布上了";
};
};
CommonShape = function(){};
CommonShape.prototype = new Shape();
CrossFillShape = function(){
this.draw = function(canvas){
CrossFillShape.prototype.draw.apply(this, arguments);
this.picture = this.picture + ", 然后被子類 CrossFillShape 填充";
};
};
CrossFillShape.prototype = new Shape();
SolidFillShape = function(){
this.draw = function(canvas){
SolidFillShape.prototype.draw.apply(this, arguments);
this.picture = this.picture + ", 然后被子類 SolidFillShape 填充";
};
};
SolidFillShape.prototype = new Shape();
function test1() {
var s = new CommonShape();
s.draw();
console.debug(s.picture);
var cs = new CrossFillShape();
cs.draw();
console.debug(cs.picture);
var ss = new SolidFillShape();
ss.draw();
console.debug(ss.picture);
}
</script>
</head>
<body>
<input type="button" value="test1" onclick="test1()"/><br/>
</body>
</html>
（上面代碼中的console對象是Firefox的Firebug插件提供的，在這里為Firebug插件做個廣告，那是相當的好用啊！）
這里通過apply來調用父類方法。
JavaScript中的apply和call
在JavaScript中，一個對象方法代碼中的this并不是一直指向這個對象，通過apply或者call就可以方便的切換this指向的方法。或者說，apply和call方法的最直接的作用就是切換this的指向，并由此可以引發很多非常靈活的用法（可以看看prototype庫的代碼，有很多apply和call）。apply和call的區別在于調用時參數傳入的方式不同:第一個參數都是對象指針（也就是說把原來代碼中的this指向哪個對象），apply的第二個參數是數組，call從第二個參數開始是實際的函數調用參數
可以用下面的式子表達：
foo.call(this, arg1,arg2,arg3) == foo.apply(this, arguments) == this.foo(arg1, arg2, arg3)
posted on 2010-04-29 20:43
YODA 閱讀(4964)
評論(1) 編輯 收藏