JS에서 this

this 키워드의 경우 javascript뿐만 아니라 다른 언어들에도 존재를 합니다만 특히, javascript에서 이 this키워드는 다른 언어와 조금 다르게 동작합니다.

또한 이 this키워드는 javascript 내부적으로도 엄격모드와 비엄격모드에서 조금 다르게 동작을 하며 다른 언어들보다 조금 더 어려운 개념을 가지고 있습니다.

this는 스코프와 연결이 있습니다.

this의 값이란?

this는 함수의 런타임에 따라, 함수가 호출되는 시점에 따라 그 값이 다르기 때문에 개발자의 의도와 다르게 코드를 작성하는 시점과 실제로 this가 동작하는 시점에서 차이가 있을 수 있습니다.

이러한 불편 때문에 ES5에서 부터는 함수를 어떻게 호출했는지 상관하지 않고 this값을 설정할 수 있는 bind메소드를 도입되었습니다.

이번 시간에는 이 this가 상황에 따라 어떻게 동작하는지에 대해 자세히 알아보도록 하겠습니다.

scope, this, 실행 컨택스트의 동작 원리는 모두 이해해야 this를 이해했다고 할 수 있기 때문에 집중해 공부를 해보면 좋겠습니다.

1. 전역공간에서의 this

Node.js 환경에서의 this는 global입니다. 이 global객체는 node.js답게 node.js를 실행하는데 필요한 실행환경들을 갖추고 있습니다.

브라우저에서의 this는 window로 브라우저에서 실행하는데 필요한 객체들이 주로 담겨져 있습니다.

window.alert('Hello');
this.alert('Hello');

두 코드의 실행 결과는 undefined로 같습니다. 즉 전역공간에서의 this는 window를 바라보는 것을 확인할 수 있습니다.

하지만 node.js환경에서는 alert이 존재하지 않습니다. 결국 같은 this고 같은 전역공간에서도 제공되는 this가 다르게 되는 것입니다.

2. 함수에서의 this

함수에서의 this는 window를 가르키게 됩니다. <u>즉, 함수에서의 this는 전역공간을 가르키게 됩니다.</u>