코어자바스크립트 ch3 this 를 읽고 대충 정리한 글
ch3 후반부에 this 바인딩 부분은 나중에 추가할 예정...
상황에 따라 this 가 어떤 객체를 가리키는지가 다르다.
전역공간에서 this
- 전역 객체
method 호출 시 method 내부에서의 this
- 해당 method를 호출한 주체
함수 호출 시 함수 내부에서의 this
- 전역 객체
- (함수 내부에서 this가 전역 객체를 바라보는게 자바스크립트 설계오류라고함. 변수 선언을 통해 우회하는 방법도 있긴 있음.)
콜백 함수 호출 시 그 함수 내부에서의 this
- 콜백 함수도 함수이므로 기본적으로는 전역객체를 바라보긴 하는데,
- 콜백 함수를 호출하는 함수가 무엇이냐에 따라 다르다.
- 예를 들어 addEventListener 함수는 내부적으로 this 가 event target 에 연결되어 있다.
생성자 함수 내부에서의 this
- 자바스크립트는 함수에 생성자로서의 역할을 부여했다. new 명령어와 함께 함수를 호출하면 그 함수는 생성자로서 동작한다. 그리고 어떤 함수가 생성자 함수로서 호출된 경우 내부의 this 는 곧 새로 만들 구체적인 인스턴스 자신이 된다.
let user = new User("Jack");
이렇게 함수를 생성자로서 호출하면 아래의 과정이 동작한다.
function User(name) {
// this = {}; (빈 객체가 암시적으로 만들어짐)
this.name = name;
this.isAdmin = false;
// return this; (this가 암시적으로 반환됨)
}
'Language > JavaScript' 카테고리의 다른 글
[JS] 비동기 처리 - Callback, Promise, async/await (0) | 2021.07.24 |
---|---|
[JS] 코어자바스크립트 ch6. 프로토타입 (0) | 2021.07.04 |
[JS] 화살표함수 (0) | 2021.07.02 |
[JS] 함수 선언문과 함수 표현식 (0) | 2021.05.28 |
[JS] 얕은 복사 깊은 복사 (0) | 2021.05.14 |