this의 세계

선결론: this를 이해하려면 많은 시간이 필요할 듯 하다

 

일단 기본적으로 this는 총 다섯 가지의 경우로 나눌 수  있다고 한다.

 

1. Global Reference

이 경우에는 window 혹은 global을 가리키는 this로 쓰일 때인데 그냥 바로  this를 찾게 되면 여기로  뜬다.

 

2. Free Function Invocation

이 경우에도 마찬가지로 window 혹은 global로 바인딩이 된다. 1번이나 2번이나 그다지 유용하지는 않지만 그래도 this의 출발점은 되어주기도 한다.

 

3..call or .apply invocation

이 두 가지의 경우인 .call과 .apply에서는 자바스크립트에서 사용할 수 있는 방법이다. 인자로 this를 수동적으로 넘겨주게 되면서 this를 지정할 수  있기 때문에 나름의 편리성과 명확성을 지닌다. 많이 유용하기도 한 이 함수들은 첫번째 인자로 this를 받게 되고 두 번째 인자로 매개변수들을 담당한다. 가령 예를 들어

Math.min(1, 5, 6, 3)

위처럼 Math.min을 사용하고 싶다고 하자.

Math.min은 매개변수로 배열이 아닌 각각의 인자들을 따로 받고 거기에서 함수의 결과를 돌려준다. 하지만 배열을 사용해야 할 때가 올 수도 있는데 그 때는 .apply나 .call이 유용해지는 때이다.

배열로 그냥 주어진다고 할 때, 위 함수는

 

Math.min.apply(null, [1, 5, 6, 3])

이렇게 다시 쓸 수 있다. 이 때 눈치챘겠지만 this의 값은 아무거나 줘도 상관이 없다.

 

그 이유는 Math.min은 this를 사용하지 않고 매개변수를 이용해 다시 반환해주기 때문이다.

 

 

4. Construction Mode

네 번째 this를 binding해주는 것은 쉽게 말해 new 등의 키워드를 이용해 새로운 인스턴스를 생성할 때이다.

이 경우에는 주어진 생성자 함수에 binding이 된다.

이러한 상황이 유용한 이유는 각 인스턴스를 만드는 생성자 함수를 이용할 수 있도록 해주기 때문이라고 생각하면 이해하기가 쉬울 것이다.

 

5. Method Invocation

사실 앞서 나온 나머지 4개의 방법들은 그다지 많이 사용되지가 않기도 한다.

제일 많이 사용되는 것이 메서드를 통한 binding 인데 이 경우에는 온점 왼쪽에 있는 객체에 this가 binding된다.

아주 잘 쓰이는 그리고 거의 대부분의 this는 이렇게 사용이 된다고 볼 수 있을 정도로 중요하며 앞에서 보여줬던 global이나 function invocation 등도 사실 어떻게 보면 이 경우에 속한다고도 할 수 있다.