본문 바로가기
바닐라코딩/Prep

바닐라코딩 prep 4주차 정리

by Dev_Dank 2021. 8. 18.

바닐라코딩의 prep 과정을 수강한 내용을 정리한 포스팅입니다.


강의

이번주의 강의는 자바스크립트의 this에 관하여 공부하는 내용이었습니다. 

주요 내용은 아래와 같습니다. 
-this는 작성된 곳이 아니라 함수 호출 방식에 따라 값이 달라진다.
-함수 호출은 크게 4가지 형태로 구분이 가능하며 다음과 같다. 

1.일반 함수 실행
=> 전역객체가 this에 바인딩 되며 strict 모드에서는 undefined가 바인딩 됩니다. 
2.메서드 호출(dot notation, bracket)
=> 메서드를 호출한 객채가 this 에 바인딩 됩니다.
3.간접 호출 (call, apply, bind)
=> 간접 호출시 인자로 전달한 객체가this 로 설정됩니다. 
4. new 키워드를 통한 생성자 함수로 호출
=> 생성자 함수가 만들게될 객체(인스턴스)가 this에 바인딩 됩니다. 

추가로 주의할점은 화살표 함수의 경우 this키워드가 존재하지 않아 렉시컬스코프를 따라 this값을 바인딩 한다는 점입니다. 

바닐라 코딩강의 외에 모던 자바스크립트 deep dive 도서의 this 챕터를 다시 읽었으며 추가로 Dmitri Pavlutin의 블로그 포스팅을 참조하여 추가 학습을 진행했습니다. 

https://dmitripavlutin.com/gentle-explanation-of-this-in-javascript/

 

Gentle Explanation of "this" in JavaScript

The value of this keyword in JavaScript is determined by how the function is called. My guide will help you effortlessly understand this.

dmitripavlutin.com

https://dmitripavlutin.com/javascript-this-interview-questions/

 

7 Interview Questions on "this" keyword in JavaScript. Can You Answer Them?

7 interview questions to challenge your knowledge on "this" keyword in JavaScript.

dmitripavlutin.com


과제

금주의 과제는 없었습니다. 


부족하다고 느낀점

지난번에 이미 도서를 통해 this키워드를 공부했었으나 역시 일정기간 사용하지 않고 다시 보니 몇몇 부분이 헷갈렸었습니다. 역시 지식은 활용하지 않으면 의미가 없다는 것을 느꼈습니다. 간간히 퀴즈를 풀면서 환기 해야할 것 같습니다. 

 

댓글