JavaScript에서 함수를 호출하는 방법 중에서도 특별한 기능을 제공하는 메소드입니다. 모두 함수를 호출할 때 this 값을 설정하는 방법을 제공하는 특징을 갖고 있습니다. (this 소실방지)
call()
함수를 호출할 때 this 값을 설정하고, 함수 인자를 개별적으로 전달합니다. call 메소드를 사용하면 객체의 메소드를 다른 객체에서 사용하거나, 함수를 호출할 때 동적으로 this 값을 설정할 수 있습니다.
function greet(name, age) {
console.log("Hello, my name is " + name + " and I am " + age + " years old!");
}
greet.call(null, 'yuni', 30); // Hello, my name is yuni and I am 30 years old!
apply()
함수를 호출할 때 this 값을 설정하고, 함수 인자를 배열 형태로 전달합니다. apply 메소드를 사용하면 call과 마찬가지로 객체의 메소드를 다른 객체에서 사용하거나, 함수를 호출할 때 동적으로 this 값을 설정할 수 있습니다.
function greet(name, age) {
console.log("Hello, my name is " + name + " and I am " + age + " years old!");
}
greet.call(null, ['yuni', 30]); // Hello, my name is yuni and I am 30 years old!
bind()
함수를 호출할 때 this 값을 영구히 설정하고, 새로운 함수를 반환합니다. bind 메소드를 사용하면 함수를 호출할 때마다 동일한 this 값을 유지하며, 새로운 함수를 반환하여 나중에 호출할 수 있습니다.
function greet(name, age) {
console.log("Hello, my name is " + name + " and I am " + age + " years old!");
}
var yuni = greet.bind(null,'yuni',30)
yuni() // Hello, my name is yuni and I am 30 years old!
마무리
-
call()
call 메소드는 매개변수 개수가 고정되어 있지 않은 가변 인자 함수를 호출할 때 매우 유용합니다. -
apply()
apply 메소드는 함수 매개변수의 개수가 고정되어 있지 않은 가변 인자 함수를 호출할 때 매우 유용합니다. 배열 형태로 인자를 전달해야 하는 특징이 있습니다. -
bind()
bind 메소드는 함수를 미리 설정해 놓고, 나중에 호출해야 하는 경우에 매우 유용합니다. 또한, 새로운 함수를 생성하는 것이므로, 이전 함수와는 별개의 함수를 생성하게 됩니다. 하여 함수 안의 내용을 실행하려면 변수에 할당을 해야합니다.
따라서, call 메소드는 즉시 함수를 호출하면서 this 값을 설정할 때, apply 메소드는 함수 인자를 배열 형태로 전달할 때, bind 메소드는 함수를 미리 설정해 놓고 나중에 호출해야 할 때 사용하는 것이 좋겠습니다.
