Javascript #4 자바스크립트의 this

Explanation

자바스크립트의 this 는 선언 시점이 아닌 호출에 따라, 그리고 어떻게 호출했는지에 따라 가리키는 것이 달라집니다.
이글은 짧게나마, 설명보단 간단한 예로 몇가지 상황에 대해 정리해보려 합니다.

1.

가장 단순한 함수에서의 this는 전역을 가르킵니다. 전역에서의 변수 var aaawindow.aaa와 같습니다(브라우저). 하지만 엄격모드(‘use strict’) 에서는 선언되지 않은 프로퍼티로 타입 오류입니다.

2.

객체의 프로퍼티에 값으로 있는 함수 (메소드)의 this는 자신히 속한 객체를 가르킵니다.

3.

call(), apply() 메서드를 이용하여 함수를 호출하면 this를 지정한 객체로 바인딩 할 수 있습니다.

4.

new 생성자로 선언한 함수 역시 만들어지는 객체로 this가 가르킵니다.

5.

적당한 예인지는 모르겠지만 Amtn, 객체의 메서드 함수 안에 있는, 함수의 this가 객체를 가르킨다고 생각하거나 그렇게 기대하는 경우가 많은데, 기본적으로 단일 함수의 this는 전역을 가르키기 때문에 undefined, 엄격모드에서는 타입오류 입니다.

그리하여 일반적으로 var self (또는 _this, that ..) 등의 임의의 변수로 this를 참조하여 사용하는 경우가 많았던것 같습니다.

지금은 별로 중요하지 않을 수 있지만, ES6 이전에는 이 부분에 있어서 많은 이야기가 있었던거 같습니다. this를 이해하지 못한 안좋은 코드라거나 혹은 확실하게 this를 보장하는 가독성 좋은 코드라거나..

6.

ECMAScript2015(이하 ES6)에서 새롭게 추가된 구문으로 화살표 함수에서는 위에서 기대하던대로 자신만의 this를 생성하지 않고 this를 감싸고 있는 컨텍스트로부터 대상을 찾습니다.

Leave a Reply