Muscardinus
this keyword - 2탄 본문
1. Regular function call (일반 함수 실행 방식)
위 코드의 결과 값은 15이다
this가 실행되는 곳은 맨 마지막 줄의 printAge 함수이다.
특별한 것 없이 함수 이름 만을 이용하여 실행하는 경우,
즉 일반 함수 실행 방식에서는 해당 함수의 this 값은 Global Object 이다. 브라우저에서는 window 객체이다.
Chrome Console 창 사용
1탄에 있었던 코드를 다시 보자 (출력 값: 15)
this가 사용되는 함수는 muscardinus라는 객체의 printAge 라는 속성으로 할당되어 있다.
하지만 항상 기억해야할것! 함수의 선언이나 할당은 this의 값과 무관하다
해당 함수의 실행되는 부분은 맨 마지막 줄이고 일반 함수 호출 방식으로 실행된다. 그렇기에 this 값은 Global Object이다
참고 (Strict Mode) this -> undefined
Strict Mode에서 함수가 일반 함수 실행 방식으로 실행되더라도, this 값은 Global Object가 아닌 undefined이다.
따라서 해당 코드에서 this는 undefined이기에 Error가 발생한다
2. Dot Notation
출력값
35
100
마지막 두 줄을 보면 결과적으로 두 줄은 같은 함수를 실행한다. 하지만 결과값은 다르다. 그 이유는 바로 함수를 실행하는 방식이 다르기 때문이다! 또 한 번 강조한다. this는 함수의 할당이나 선언과 전혀 무관하다!!!
마지막에서 두 번째 줄을 보면
printAge 앞에 muscardinus를 놓고 Dot을 가지고 있다
Dot Notation을 이용하여 함수를 실행할 경우, 해당 함수 내부의 this는 Dot 앞에 있는 객체를 가리킨다. 즉 muscardinus를 가리키게 된다. 그리고 muscardinus의 age는 35이다
문제
출력 값
'Adult'
'FrontEnd > JavaScript Basics' 카테고리의 다른 글
Writing Optimized Code (0) | 2020.11.30 |
---|---|
What is JavaScript Engine? (1) | 2020.11.30 |
this keyword - 마지막 (0) | 2020.10.19 |
this keyword - 3탄 (0) | 2020.10.15 |
this keyword - 1탄 (0) | 2020.10.13 |