javascript call與apply關鍵字的做用

apply接受兩個參數。第一個參數指定函數體內this對象的指向，第二個參數爲一個帶下標的集合。

call則是apply的語法糖，若是參數數量固定，則能夠不用帶下標的集合傳第二個參數。

1 2 3 4 5 6

var  func =  function (a,b,c) {      alert(a + b + c); } func.apply( null ,[1,2,3]); //彈出6 func.call( null ,1,2,3); //彈出6

當apply與call傳入的第一個參數爲null時，函數體內的this會指向window。

call與apply的用途

---

一、改變this的指向

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

var  obj1 = {      name =  '劉備' }   var  obj2 = {      name =  '曹操' } var  getName =  function (){      alert( this .name); }   window.name =  '三國' ; getName(); //彈出"三國" getName.call(obj1); //彈出"劉備" getName.call(obj2); //彈出"曹操"

因此，當在一些狀況下this被莫名改變指向以後，能夠使用call或apply來進行修正this的指向。

1 2 3 4 5 6 7

document.getElementById( 'div1' ).onclick =  function (){      alert( this .id); //div1      var  fun1 =  function (){          alert( this .id); //window.id 即undefined      }      fun1(); //普通函數的方式調用，this指代window,至關於window.id 即 undefined }

因爲是普通函數的方式調用，因此上面的例子中，this已經變成了window。下面看看如何使用call進行修正。

1 2 3 4 5 6 7

document.getElementById( 'div1' ).onclick =  function (){      alert( this .id);      var  fun1 =  function (){          alert( this .id);      }      fun1.call( this ); //強制函數內的this爲外層的this， }

二、調用其餘對象的函數

示例1：

1 2 3 4 5 6 7 8 9 10 11 12 13 14

var  obj1 = {      a:1,      b:2,      add: function ()      {          return  this .a +  this .b;      } } var  obj2 = {      a:1,      b:2, } var  result = obj1.add.call(obj2); //用obj1的函數來計算obj2的兩個屬性的和 alert(result); //輸出3

示例2：借用構造函數實現相似繼承的效果

1 2 3 4 5 6 7 8 9 10 11 12

var  A =  function (name) {      this .name = name; }; var  B =  function (){      A.apply( this ,arguments) } B.prototype.getName =  function (){      return  this .name; } var  b =  new  B( '劉備' ); alert(b.getName());

來源：javascript call與apply關鍵字