본문 바로가기

Programming/javascript

[javascript] apply() & call()

apply() & call()


유효 범위의 변경

apply() 메서드와 call() 메서드를 이용하면 유효 범위를 변경할 수 있습니다.


apply() 메서드


apply() 메서드는 자신이 원하는 유효 범위로 변경할 때 사용합니다. 

메서드의 인수는 배열로 지정합니다. 다음은 apply() 메서드를 사용하는 예제입니다.


function callName(a,b){
    return this.name(a,b);
}

var Car = {
    name : function(a,b){ return “kia” +a+ b;}
};

var Car2 = {
    ame : function(a,b){return “deawoo” +a+ b;}
}

callName.apply(Car,[1,2]);    // kia12
callName.apply(Car2,[1,2]);    // deawoo12

callName.apply(Car,[1,2]);과 callName.apply(Car2,[1,2]);는 ‘Car과 Car2의 유효 범위에서 
callName() 메서드를 실행하고 그 인수는 1과 2로 지정한다’는 의미입니다.

다음 그림은 위의 예제의 유효 범위를 그림으로 표현한 것입니다. 
callName() 메서드는 메모리에 다음 그림과 같이 위치하며 this는 window 객체를 가리킵니다.


apply() 메서드를 사용하여 callName() 메서드를 Car 객체의 유효 범위에서 실행하면 
callName() 메서드의 위치는 다음 그림과 같이 바뀌고, this는 Car 객체를 가리키게 됩니다.



call() 메서드

call() 메서드는 apply() 메서드와 같이 자신이 원하는 유효 범위로 변경할 때 사용합니다. 그러나 메서드의 인수를 배열로 지정하지 않는 다는 점이 apply() 메서드와 다른 점입니다.

다음은 apply() 메서드를 사용하여 callName() 함수의 인수를 1과 2로 설정하는 예제입니다.
callName.apply(Car,[1,2]);


call() 메서드를 사용하여 callName() 함수의 인수를 1과 2로 설정하는 코드는 다음과 같습니다.
callName.call(Car,1,2);


출처 : http://dev.naver.com/tech/ajaxui/ajaxui_2.php