this

binding : 호출한 대상에 실제함수를 연결 짓는 것
올바른 객체에 올바른 메서드 묶어주기(매칭 시키기)

전역 객체 : 코드전체를 아우르는 객체
-window 객체 : 브라우저에서의 전역객체

-global 객체 : 서버사이드 환경(node.js)에서의 전역객체

 

 

 

<바인딩 되는 경우의 수>

1. 일반함수를 호출했을 때 this는 어디로 바인딩 되느냐
→일반함수의 호출과정에서의 this는 전역객체를 의미한다.


2. 객체를 호출했을때 this는 어디로 바인딩 되느냐
→객체의 메소드에서 사용된 this는 그 메소드를 호출한 객체로 바인딩 된다.

 

3. 생성자 함수를 호출했을때 this는 어디로 바인딩 되느냐
→생성되어 반환되는 객체에 바인딩

 

 

어떤 클래스 안에 있는 함수를 다른 콜백으로 전달할 때의 this는 그 함수가 포함되어져 있는 클래스의 정보가 사라진다.

그래서 클래스와 함수를 묶을 수 있는 bind()메서드를 써서 바인딩해주거나

this.onClick  = this.onClick.bind(this)

변수로 화살표 함수를 할당하면 해결된다.

onItemClick = (item) => {
    //동작
  };

*
생성자 함수 this vs 일반 함수 this

똑같이 생겼어도
new로 새로운 객체를 만들면 생성자 함수
new 없이 그냥 호출되어 쓰이면 일반 함수

 

 

 

**
내부함수의 this

내부함수에서의 this는 무조건 전역 객체(window)에 바인딩 된다.
-일반함수 : 함수 안에 또 다른 함수

-객체 내부 함수 : 객체 메소드 안에 선언된 또 다른 함수

-생성자 내부 함수 : 생성자 함수 안에 또 다른 함수