this는 현재 속해있는 객체를 가르키는 참조 값을 가지는 변수다.
변수 선언 처리가 끝나면 다음은 this value가 결정된다. this value가 결정되기 이전에 this는 전역 객체를 가리키고 있다가 ****함수 호출 패턴에 의해 this에 할당되는 값이 결정된다. 전역 코드의 경우, this는 전역 객체를 가리킨다.
this 프로퍼티에는 this 값이 할당된다. this에 할당되는 값은 함수 호출 패턴에 의해 결정된다.
⇒ 동일한 함수라도 다른 객체에서 호출할 때 this가 달라진다.
⇒ 메소드가 어디에서 정의됐는지와 상관없이 this가 무엇인가에 따라 자유롭게 결정된다.
자바스크립트의 경우 함수 호출 방식에 의해 this에 바인딩할 어떤 객체가 동적으로 결정된다. 다시 말해, 함수를 선언할 때 this에 바인딩할 객체가 정적으로 결정되는 것이 아니고, 함수를 호출할 때 함수가 어떻게 호출되었는지에 따라 ****this에 바인딩할 객체가 동적으로 결정된다.
기본 바인딩
기본적으로 this는 전역객체(Global object)에 바인딩된다. 전역함수는 물론이고 심지어 내부함수의 경우도 this는 외부함수가 아닌 전역객체에 바인딩된다.
생성자 함수와 메소드를 제외한 메소드 내부 함수, 콜백 함수 등 모든 함수 내부의 this는 전역객체를 가리킨다. 브라우저 환경에서 비엄격 모드일 경우 this는 window, 엄격 모드에서는 undefined 이다.
내부함수는 일반 함수, 메소드, 콜백함수 어디에서 선언되었든 관게없이 this는 전역객체를 바인딩한다. 더글라스 크락포드는 “이것은 설계 단계의 결함으로 메소드가 내부함수를 사용하여 자신의 작업을 돕게 할 수 없다는 것을 의미한다” 라고 말한다.
⇒ 화살표 함수를 사용해서 상위 스코프의 this를 사용하게 된다.
명시적 바인딩
this를 특정 객체에 명시적으로 바인딩하는 방법도 제공된다.
call
func.call(thisArg[, arg1[, arg2[, ...]]])
**call()**메소드는 주어진 this값 및 각각 전달된 인수와 함께 함수를 호출한다.
apply
func.apply(thisArg, [argsArray])
apply()를 사용해, 새로운 객체마다 메소드를 재작성할 필요없이 한 번만 작성해 다른 객체에 상속시킬 수 있다.
bind
func.bind(thisArg[, arg1[, arg2[, ...]]])
bind()함수는 새로운 바인딩한 함수를 만든다. 바인딩한 함수를 호출하면 일반적으로 래핑된 함수가 호출 된다.
암시적 바인딩
함수가 객체의 프로퍼티 값이면 메소드로서 호출된다. 이때 메소드 내부의 this는 해당 메소드를 소유한 객체, 즉 해당 메소드를 호출한 객체에 바인딩된다.
new 바인딩
일반함수와 생성자 함수의 차이점은 호출 시 this 바인딩 방식이 다르다.
일반 함수를 호출하면 this는 전역객체에 바인딩되지만 new 연산자와 함께 생성자 함수를 호출하면 this는 생성자 함수가 암묵적으로 생성한 빈 객체에 바인딩된다.
바인딩 우선순위는 new 바인딩 > 명시적 바인딩 > 암시적 바인딩 > 기본 바인딩