함수 매소드 .call .apply .bind

함수의 매소드중 가장 중요한 세가지에 대해 알아보자

call, apply, bind

기본적으로 세 매소드 모두 함수에서 사용되어진 this를 바꿔주는 역활을 한다.
아래를 보자

function sayhi(name){
	hi = '안녕하세요'
	console.log(`${name}님 ${this.hi}`);
}

obj = {
	hi: '방갑습니다.'
}

sayhi('하연');
sayhi.call(obj, '상연');
sayhi.apply(obj, ['중연']);
bindhi = sayhi.bind(obj, '하연');
bindhi();

하연님 안녕하세요
상연님 방갑습니다.
중연님 방갑습니다.
하연님 방갑습니다.

세 함수모두 첫번째 매개변수로 obj를 지정해 주었더니
obj의 hi(방갑습니다.)가 sayhi(안녕하세요)대신 출력 된것을 볼수 있다.

즉 세 함수들은 본래 자기자신을 가르켜야할 this를 매개변수에 들어간 객체로 변환시켜주는 역활을 한다고 볼수 있다.

그렇다면 세 함수는 어떠한 차이점을 가지고 있을까?

 

call과 apply

 

두 매소드 모두 함수의 this를 바꿔준후 실행시켜준다.

둘의 차이점은 뒤에 들어가는 기존 함수의 매개변수를 받는 방식의 차이이다.

call은 두번째 매개변수부터 기존 함수의 매개변수를 받지만

apply는 두번째 매개변수에 기존 함수의 매개변수를 배열형태(또는 유사배열형태)로 받는다는 차이점이 있다.

bind

 

bind는 call 과 같은 사용법을 가졌다.
하지만 유일한 다른점은 바로 함수를 실행시켜주지 않는다는 것이다.
그저 함수를 리턴해줘 다른 변수에 저장했다 사용하는것이 가능하다.