apply 란?
정의
자바스크립트의 함수 객체 메서드로, 다른 객체의 컨텍스트에서 함수를 호출하는 방법이다.
function.apply(thisArg, [argsArray])- function : apply() 를 호출하는 함수 객체
- thisArg : 함수 내에서
this의 값으로 사용됨 - argsArray : 함수를 호출할 때 전달할 인자들의 배열
사용 예시
function greet(){
console.log("Hello, ${this.name}!");
}
person = {
name:"이순신";
}
greet.apply(person); //출력 : Hello, 이순신!call(), apply() 차이점
greet.apply(person)//출력 : Hello, 이순신!
greet.call(person)//출력 : Hello, 이순신!두 메서드 모두 함수를 호출할 때 this 값을 지정하는데 사용된다. 결과적으로는 두 함수모두 같은 값을 리턴한다.
function greet(message) {
console.log(`${message}, ${this.name}!`);
}
var person = {
name: "이순신"
};
// apply() 메서드 사용
greet.apply(person, ["Hello"]);
// call() 메서드 사용
greet.call(person, "Hello");두 메서드의 차이점은 매개변수를 전달하는 차이에 있다. apply()는 배열형태로 인자들을 전달하고, call 매서드는 개별 인자로 전달하게 된다.
다른 개수의 인자로 함수를 호출하기 위해 apply를 사용하자
몇개인지 모르는 숫자 값의 평균을 계산하는 average 함수가 있다고 가정해보자
average(1,2,3) //2
average(1); // 1
average(3,1,4,1,5,9,2,6,5); // 4
average(2,7,1,8,2,8,1,8); // 6.425다음과 같은 average함수는 가변 인수, 가변인자 라고 부르는 함수이다. 이 함수는 인자에 제한이 없다. 만약 고정된 인자를 받는 함수였다면 다음과 같이 배열을 받았을 것이다.
averageOfArray([1,2,3]) //2
averageOfArray([1]); // 1
averageOfArray([3,1,4,1,5,9,2,6,5]); // 4
averageOfArray([2,7,1,8,2,8,1,8]); // 6.425가변인자가 더 깔끔해 보인다. 이처럼 몇 개의 인자를전달해야 하는지 사전에 정확히 알고있다면 가변인자 함수 문법이 더 깔끔하다.
다음과 같은 scores 변수가 있다고 가정해보자
var scores = getAllScore(); //배열을 전달해 주는 함수 이 배열의 평균값을 계산하려면 어떻게 해야할까?
apply 사용 예
var scores = getAllScore();
average.apply(null, scores); //null을 입력하게 되면 apply안의 this는 window를 가리키게 된다. apply 메서드는 인자의 배열을 받아 그 배열의 각 요소가 개별인자인것 처러 함수를 호출한다.
첫번째 인자를 통해 this를 바인딩 할 수도 있지만 지금은 하지 않기 때문에 명시적으로 null을 입력했다.
apply 메서드는 가변인자 메서드에도 사용할 수 있다. 예를 들어 buffer 객체 내부의 state에 항목을 추가하기 위한 가변인자 append메서드를 포함할 수 있다.
var buffer={
state:[],
append:function(){
for(var i = 0, i < arguments.length;i++){
this.state.push(arguments[i]));
}
}
}
buffer.append("Hello, ")
buffer.append(firstName, " ", lastName, "!");
buffer.append(newline)append는 인자에 상관없이 호출할 수 있다.
this 인자를 전달해서 append를 계산된 배열 값으로 호출할 수도 있다.
buffer.append.apply(buffer, getInputStrings());여기서 buffer를 첫번째 인자로 넣지 않았다면 append 안의 this는 window를 가리킬 것이다.
즉 apply는 배열을 펼쳐서 가변인자로 전달한다!
기억할 점
- 계산된 배열 인자로 가변인자 함수를 호출하기 위해
apply메서드를 사용하자 apply의 첫 번째 인자로 가변인자 메서드를 위한 수신자 객체를 전달하자
