1. this

• this는 기본적으로 실행 컨텍스트가 생성될 때 함께 결정된다.
  실행컨텍스트는 함수 호출할때 생성되므로 this는 함수를 호출할 때 결정 된다고 볼수있다.

---

2. 전역 공간에서의 this

• 전역 공간에서 this는 전역 객체를 가르킨다.
• 브라우저상 전역객체 → window || NodeJs환경 전역객체 → global

var a = 1;
console.log(a);         // 1
console.log(window.a);  // 1
console.log(this.a);    // 1

• 자바스크립트의 모든 변수는 특정객체의 프로퍼티로 동작한다.
  → 특정객체란 실행 컨텍스트의 Lexical Environment 이다.
  → 실행 컨텍스트는 변수를 수집해서 Lexical Environment 의 프로퍼티로 저장 한다.
  → window.a 와 this.a가 1로 출력되는 이유: 전역객체의 Lexical Environment 를 가르킴
  → a가 1로 출력되는 이유: 스코프 체인을 통해 전역객체의 Lexical Environment에 접근하기 때문

---

3. 메서드로서 호출할 때 그 메서드 내부에서의 this

3-1) 함수 vs 메서드

• 함수와 메서드를 구분하는 유일한 차이는 독립성 이다.
  → 함수는 그 자체로 독립성을 수행하는 반면, 메서드는 자신을 호출한 객체에 관한 동작을 수행한다.
  → 객체의 프로퍼티에 할당된다고 해서 무조건 메서드가 아니라 객체의 메서드로 호출된 경우만
  메서드로 동작한다.

3-2) 메서드 내부에서의 this

• 함수 앞에 (.)이 있어 객체로 통해 호출된 경우에만 메서드로 호출한 것 이다.
• 메서드로 호출할 경우 this의 호출주체는 (.)앞의 객체 이다.

var obj = {
		methodA:function (){
			console.log(this);
		}
		inner:{
			methodB:function(){
			console.log(this);
		}
	}
};

obj.methodA();            // {methodA: f, inner:{...}}
obj.['methodA']();        // {methodA: f, inner:{...}}
obj.inner.methodB();      // {methodB:f }
obj.inner.['methodB']();  // {methodB:f }

3-3 함수 내부에서의 this

• this가 지정되지 않은 경우 this는 전역객체를 가리킵니다.
• 메서드가 아닌 함수에서의 호출시에는 무조건 this가 전역객체를 가리킵니다.

var obj1 = {
	outer:function(){
		console.log(this);    //(1)
		
		var innerFunc = function(){
			console.log(this);   //(2),(3)
		}
		innerFunc();         //(2) 함수로서의 호출 => window(전역객체)

		var obj2= {
			innerMethod:innerFuc
		};
		obj2.innerMethod();  //(3) 메서드로서의 호출 = obj2
	}
};

obj1.outer();           //(1)메서드로서의 호출 => obj1

3-4 메서드 내부함수에서 this를 우회하는 방법

• 임의의 변수에 this를 담아 넘겨줌 으로써 변경할 수 있다.
  → ex) var test = this;
• 화살표 함수를 활용함으로써 스코프체인상 가장 가까운 this에 접근할 수 있다.

var obj = {
		outer: function(){
			console.log(this);
			var innerFunc = () =>{
				console.log(this);
			};
			innerFunc();  //(2)obj -> 함수 호출이지만 화살표 함수여서
		}               // this가 전역객체(window)가 아닌 상위 스코프의 this인 obj를 기리킴
};

obj.outer();       //(1)obj

콜백함수 호출시 내부에서의 this

• 대상이 될 객체를 명시적으로 지정하지 않은 경우 일반적으로 전역객체를 가리킨다.

생성자 함수 내부에서의 this

• 어떤 함수가 생성자 함수로써 호출된 경우 내부에서의 this는 새로 생성될 인스턴스 자신이 된다.

---

4. 명시적으로 this를 바인딩하는 방법

4-1 call과 apply메서드

• 호출 주체인 함수를 즉시 실행하도록 하는 명령어 이다.
• 첫번째 인자를 this로 바인딩하고 그 이후의 인자들을 호출할 함수의 매개변수로 사용합니다.
• call메서드는 첫번째 인자를 제외한 모든 인자를 매개변수로 지정하지만
  apply메서드는 두번째 인자를 배열로 받아 그 요소들을 매개변수로 지정 한다.

var func = function(a,b){
		console.log(this, a,b);
}

func(1,2);                 //Window{...} 1 2
func.call({x:1}, 4, 5);    //{x: 1} 4 5
func.apply({x:1}, [4,5]);  //{x: 1} 4 5

4-2 bind메서드

• call과 비슷하지만 즉시 호출하지않고 넘겨받은 this 및 인수를 바탕으로 새로운 함수를 반환하는 메서드
• this를 미리 적용하는것 과 부분적용함수를 구현하는 두 가지 목적을 지닌다.

var func = function (a,b,c,d){
		console.log(this,a,b,c,d,);
}
func(1,2,3,4)           //Window{ ... } 1 2 3 4 

var bindFunc1 = func.bind({x:1});
bindFunc1(5,6,7,8,);    //{x: 1} 5 6 7 8     <- this를 미리 적용
var bindFunc2 = func.bind({x:1},4,5);
bindFunc2(6,7);         //{x: 1} 4 5 6 7.    <- 부분적용함수