기술 블로그
js this 본문
1. 전역 this
global객체 (window)등을 가리킴
2.함수 내 this
함수의 주인인 객체에 바인딩
디폴트 바인딩이 없다면 window
strict모드에서는 undefined
3.객체 내 함수(메서드)에서 this
함수의 주인인 객체를 가리킴
4.이밴트핸들러 안에서 this
이밴트를 받는 요소를 가리킴
5.함수가 생성자로서 쓰여질때 함수내 this
new키워드로 함수를 불러오면 그 함수는 생성자 함수가 된다.
this는 함수를 생성하는 객체로 바인딩
6.화살표 함수로 쓴 this (함수 안에서 사용하는데 window객체로 바인딩하기 싫을 때)
생성자 "함수내의 함수"의 this는 전역객체로 바인딩된다
화살표 함수 내의 this는 부모 함수나 클래스의 this를 바인딩한다.
7.명시적 바인딩을 한 this
apply() 와 call() 메서드는 Function Object에 기본적으로 정의된 메서드인데요, 인자를 this로 만들어주는 기능을 합니다.
Function.prototype.apply() - JavaScript | MDN
apply() 메서드는 주어진 this 값과 배열 (또는 유사 배열 객체) 로 제공되는 arguments 로 함수를 호출합니다.
developer.mozilla.org
function Character(name, level) {
this.name = name;
this.level = level;
}
function Player(name, level, job) {
Character.apply(this, [name, level]);
this.job = job;
}
두 생성자 함수. apply용례
function Character(name, level) {
this.name = name;
this.level = level;
}
function Player(name, level, job) {
Character.call(this, name, level);
this.job = job;
}
var me = {};
Player.call(me, 'nana', 10, 'Magician');
call용례
첫번째 인자에는 this로 사용할 객체를 지정
bind()는??
거의 동일하게 활용이 가능하지만 함수를 실행하지 않고 함수를 생성한 후 반환하는 점에서 call(), apply()와의 차이점입니다.
8. 콜백 함수 안에서의 this (중첩함수내 this는 함수생성자로 생성된 경우 global객체 가리킴)
메서드 안 콜백 함수 안 this는 window객체를 가리킨다.
화살표 함수를 사용하면 부모 객체를 가리킨다.
-화살표 함수는 호출한 함수를 기억한다.
[JS] 자바스크립트에서의 this
this는 이것을 뜻합니다! (그러니까 '이게' 뭐죠...... 😵) 자바스크립트 내에서 this는 '누가 나를 불렀느냐'를 뜻한다고 합니다. 즉, 선언이 아닌 호출에 따라 달라진다는 거죠. 그럼 각 상황별로 th
nykim.work
'프론트엔드 > Javascript' 카테고리의 다른 글
[TIL] 클로저 (0) | 2023.11.06 |
---|---|
[TIL] 깊은 복사 (0) | 2023.10.23 |
[TIL]꼬리 재귀 (0) | 2023.10.13 |
[TIL]동기와 비동기 (0) | 2023.10.13 |
상속과 프로토타입 (0) | 2023.08.07 |