1. 程式人生 > >js 中的call apply

js 中的call apply

lai obj 初始 指針 title strong nodes type all


在javascript OOP中,我們經常會這樣定義:
function cat(){
}
cat.prototype={
food:"fish",
say: function(){
alert("I love "+this.food);
}
}


var blackCat = new cat;
blackCat.say();

但是如果我們有一個對象whiteDog = {food:"bone"},我們不想對它重新定義say方法,那麽我們可以通過call或apply用blackCat的say方法:blackCat.say.call(whiteDog);

所以,可以看出call和apply是為了動態改變this而出現的,當一個object沒有某個方法,但是其他的有,我們可以借助call或apply用其它對象的方法來操作。

用的比較多的,通過document.getElementsByTagName選擇的dom 節點是一種類似array的array。它不能應用Array下的push,pop等方法。我們可以通過:
var domNodes = Array.prototype.slice.call(document.getElementsByTagName("*"));
這樣domNodes就可以應用Array下的所有方法了。

1.call()

語法:obj1.call(obj2[,param1,param2,...])
定義:用obj2對象來代替obj1,調用obj1的方法。即將obj1應用到obj2上。
說明:call 方法可以用來代替另一個對象調用一個方法。call 方法可將一個函數的對象上下文從初始的上下文改變為由 obj2 指定的新對象。 如果沒有提供 obj2參數,那麽 Global 對象被用作 obj2。

2.apply()

語法:obj1.call(obj2[,arrArg])
定義:用obj2對象來代替obj1,調用obj1的方法。即將obj1應用到obj2上。
說明:call ()和apply()作用一樣,但是call()可以接收任何類型的參數,而apply()只能接收數組參數。

3.基本用法

[javascript] view plain copy
  1. function add(a,b){
  2. return a+b;
  3. }
  4. function sub(c,d){
  5. return c-d;
  6. }
  7. function result(){
  8. this.addValue = null;
  9. this.subValue = null;
  10. this.showResult=function(){
  11. alert(this.addValue);
  12. alert(this.subValue);
  13. }
  14. }
  15. var r = new result();
  16. r.addValue = add.call(sub,4,2); //6,將add方法應用到sub上,即sub的指針指向add方法
  17. r.subValue = sub.call(add,4,2); //2,用add對象替換sub對象,並調用sub對象的方法
  18. r.showResult(); //在js中函數也是一個Function對象,函數名即是對象引用

4.繼承特性

[javascript] view plain copy
  1. function add(a,b){
  2. return a+b;
  3. }
  4. function sub(c,d){
  5. return c-d;
  6. }
  7. function result(){
  8. this.addValue = null;
  9. this.subValue = null;
  10. this.showResult=function(){
  11. alert(this.addValue);
  12. alert(this.subValue);
  13. }
  14. }
  15. var r = new result();
  16. r.addValue = add.call(r,4,2); //6,r繼承add函數的所有特性
  17. r.subValue = sub.call(r,4,2); //2,r集成sub函數的所有特性
  18. r.showResult();

js 中的call apply