1. 程式人生 > >apply和call用法

apply和call用法

apply語法


func.apply(name, [array])
  • 第一個引數指定函式體內this物件的指向.
  • 第二個引數為一個帶下標的集合,可以是陣列或類陣列,apply方法把這個集合中的元素作為引數傳遞給被呼叫的函式

var func = function(a, b, c) {
  console.log([a, b, c]); // [1,2,3]
}
func.apply(null, [1,2,3])

call語法

  • 第一個引數:代表函式體內this指向
  • 第二個引數:數量不固定,每個引數依次傳入函式 ```javascript

```

當使用call或則apply的時候, 如果我們傳入的第一個引數是null. 函式體內的this會指向預設的宿主物件,在遊覽器中則是window

var func = function( a, b, c ){
  alert ( this === window );    // 輸出true
};
func.apply( null, [ 1, 2, 3 ] );

但如果是在嚴格模式下,函式體內的this還是為null:


var func = function( a, b, c ){    
  "use strict";    
  alert ( this === null );     // 輸出true
}
func.apply( null, [ 1, 2, 3 ] );

有時候我們使用call或者apply的目的不在於指定this指向,而是另有用途,比如借用其他物件的方法。
那麼我們可以傳入null來代替某個具體的物件:


Math.max.apply( null, [ 1, 2, 5, 3, 4 ] )    // 輸出:5

call和apply的用途


var obj1={
  name: '李小龍'
}
var obj2={
  name: '蕭薰'
}
window.name = 'window'
var getName = function(){
  console.log(this.name)
};
getName(); //輸出:window
getName.call(obj1); //輸出:李小龍
getName.call(obj2); //輸出:蕭薰

當執行getName.call( obj1 )這句程式碼時,getName函式體內的this就指向obj1物件

this 錯誤的情況


document.getElementById( 'div1' ).onclick = function(){    
alert( this.id );            // 輸出:div1    
var func = function(){       
  alert ( this.id );        // 輸出:undefined    
}    
func();
};

修正this


document.getElementById( 'div1' ).onclick = function(){    
var func = function(){        
  alert ( this.id );        // 輸出:div1    
}    
func.call( this );
};

原文連結: http://www.jianshu.com/p/c942d58659c6