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

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객체를 가리킨다.

화살표 함수를 사용하면 부모 객체를 가리킨다.

-화살표 함수는 호출한 함수를 기억한다.

 

 

https://nykim.work/71

[JS] 자바스크립트에서의 this