코어 자바스크립트 03 | this

yuriyaam·2021년 1월 29일
0
post-thumbnail

객체지향 언어에서 this는 클래스로 생성한 인스턴스 객체를 의미하며, 클래스에서만 사용할 수 있다.
반면, 자바스크립트에서의 this는 어디서든 사용할 수 있다.


01. 상황에 따라 달라지는 this

자바스크립트에서 this는 기본적으로 실행 컨텍스트가 생성될 때 함께 결정된다. 실행 컨텍스트는 함수를 호출할 때 생성되므로, this는 함수를 호출할 때 결정된다고 볼 수 있다.

02. 전역 공간에서의 this

  • 전역 공간에서 this는 전역 객체를 가리킨다.
  • 전역 객체는 자바스크립트 런타임 환경에 따라 다른 이름과 정보를 가지고 있다.
    ex) 브라우저 환경에서 전역객체 : window / Node.js 환경에서 : global

03. 함수와 메서드

함수와 메서드는 정의한 동작을 수행하는 코드 뭉치로, 이 둘을 구분하는 유일한 차이는 독립성이다.

  • 함수 : 그 자체로 독립적인 기능을 수행
  • 메서드 : 자신을 호출한 대상 객체에 관한 동작을 수행

⭐⭐ 매우 중요 !

  • 함수 내부에서의 this : 전역객체
    => this가 지정되지 않은 경구 this는 전역 객체를 바라보기 때문.
  • 메서드 내부에서으l this : 함수명(프로퍼티명) 앞의 객체

04. 콜백함수와 생성자

  • 콜백함수에서의 this : 콜백함수도 함수이기 때문에 기본적으로 this가 전역객체를 참조하지만, 제어권을 받은 함수에서 콜백함수에 별도로 this가 될 대상을 지정한 경우에는 그 대상을 참조하게 된다.
  • 생성자에서의 this : 생성될 인스턴스를 참조한다.


05. 명시적 this 바인딩

1) call, apply 메서드는 this를 명시적으로 지정하면서 함수 또는 메서드를 호출한다.
2) bind 메서드는 this 및 함수에 넘길 인수를 일부 지정해서 새로운 함수를 만든다.
3) 요소를 순회하면서 콜백함수를 반복 호출하는 내용의 일부 메서드는 별도의 인자로 this를 받기도 한다.

0개의 댓글