자바스크립트 함수의 기본 메소드(call, apply, bind)
- 선언한 함수의 호출(또는 실행) 방식?
1) 함수명 뒤에 '()' 붙여서 실행하는 방식
2) call, apply 라는 함수 기본 메소드를 사용해서 실행하는 방식
1번 방식의 경우, 우리가 가장 흔히 사용하는 방식이기 때문에 설명은 생략한다
사전지식
함수 내에서의 'this'
- 함수 생성 시, this가 자동 생성
- call, apply, bind 메소드를 실행하기 전, this는 window 객체이다.
(strict mode에서 this는 undefined)
func.call(thisArg[, arg1[, arg2[, ...]]])
첫번째 매개변수: 함수의 실행문맥의 this를 지정하는 매개변수 -> 즉, 함수 내에서 this는 call() 메소드의 첫번째 인자를 가리킨다
나머지 인수: 호출할 함수의 인수
func.apply(thisArg, [argsArray])
thisArg: 함수 내부에서 this가 가리치는 값(call() 메소드와 동일함)
argsArray: 함수에서 필요로 하는 인수를 유사배열에 넣어서 재공
--> call() 과 apply는 첫번째 인자가 this를 대체하는 것이 동일하고 뒤에 함수에 제공되는 인수들이 어떤 형식으로 제공되는지 (배열 또는 각각의 인자)의 차이가 있다
func.bind(thisArg[, arg1[, arg2[, ...]]])
thisArg: 함수의 this에 전달하는 값
arg1, arg2, ... : 대상 삼수의 인수 앞에 사용될 인수
- this는 바꾸고, 함수를 호출하지는 않는다
- bind를 통해 this를 변경하면, call로 this를 변경해도 적용되지 않는다. bind로 새로 this를 정의해줘야 함.
*일반적으로 함수에서 this를 console로 출력해보면, this는 기본적으로 전역객체 window를 가리키는데, call, apply, bind 메소드를 통해서 함수의 this를 변경할 수 있다
--> 함수 내에서 this를 통해 나타내고 있는 값 등을 call, apply, bind를 통해서 재정의해서 사용한다는 것!!! 즉, 함수에 기본 속성 arguments(유사배열)를 수정해서 사용할 수 있다.
참조
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Function/call
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Function/apply
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Function/bind
