공부/내배캠 TIL

[Node.js_4기] Today_I_Learn : This 복습 (24/01/12)

TUNA_K 2024. 1. 12. 22:11
목차

 

1. 학습 내용

2. 내용 정리

3. 예제

4. 생각 정리

 

1. 학습 내용 

 

상황별로 달라지는 this를 구분하기 어려워서 질문했고, 해당 질문이 QnA세션에서 답변을 받아 잊기 전에 정리하려 합니다.

 

2. 내용 정리 

 

(1) 전역 컨텍스트에서의 this 

this = 전역 객체. (브라우저에서는 windows)

 

(2) 함수에서의 this (함수로서의 호출)

일반 함수에서의 this는 전역객체.

 

(3) 메서드에서의 this (메서드로서의 호출)

메서드로서 함수가 호출될 때, this는 그 함수를 호출한 객체를 가리킴

 

(4) 이벤트 핸들러에서의 this

DOM 이벤트 핸들러에서 this는 이벤트가 발생한 요소를 가리킴.

 

(5) 생성자 함수/클래스 에서의 this

-1. 생성자 함수에서의 this는 새로 생성되는 객체를 가리킴.

-2. 클래스 인스턴스에서의 this도 마찬가지로, 새로 생성되는 객체를 가리킴.

 

(6) Arrow 함수에서의 this

화살표 함수의 this는 상위스코프의 this값을 가짐. (자기 자신만의 this가 없음)

-1. 상위스코프가 전역 객체인 경우 -> 전역 객체를 따라감

-2 객체의 메서드 내에서 화살표 함수를 사용하는 경우 -> 예제 참조.

 

3. 예제 

 

(1) 전역 컨텍스트에서의 this
(2) 함수에서의 this (함수로서의 호출)
(3) 메서드에서의 this (메서드로서의 호출)
(4) 이벤트 핸들러에서의 this
(5-1) 생성자 함수에서의 this
(5-2)클래스 에서의 this
(6-1) Arrow 함수에서의 this(상위 스코프가 전역객체)
(6-2.1)  객체의 메서드 내에서 화살표 함수를 사용하는 경우
(6-2.2) 객체의 메서드 내에서 화살표 함수를 사용하는 경우
(6-2.3)  객체의 메서드 내에서 화살표 함수를 사용하는 경우

 

4. 생각 정리 

 

다시한번 들으면서 긴가민가했던 개념들을 다시 확인해볼 수 있는 시간이였습니다.