this 예제 정리

• 자바스크립트 this -
  기본적으로는 this는 자신이 있는 스코프 영역에서의 객체 자체를 가르킨다
  하지만 this는 함수의 생성,정의에따라 결정되는 것이 아니라 호출방법에 의해 결정

const car = {
  name:'KIA',
  getName:function(){
   console.log("car getName",this); 
  }
}

car.getName(); // {name:'KIA", getName:f}

const car = {
  name:'KIA',
  getName:function(){
   console.log("car getName",this); 
  }
}

const globalCar = car.getName;
globalCar(); // window {.....     , js 내장객체

const car = {
  name:'KIA',
  getName:function(){
   console.log("car getName",this); 
  }
}

const car2 = {
  name:'hyundai',
  getName: car.getName
  }
car2.getName(); //{name:'hyundai", getName:f}

변하는 this 고정시키기 위해선 .bind 작성

const car = {
  name:'KIA',
  getName:function(){
   console.log("car getName",this); 
  }
}

const car2 = {
  name:'hyundai',
  getName: car.getName
  }
car2.getName(); //{name:'hyundai", getName:f}
const bindGetName= car2.getName.bind(car)
bindGetName(); // {name:'KIA", getName:f}

const testCar = {
  name:'tico',
  getName:function(){
   console.log("getName",this);   // {name: 'tico', getName:f}
    const innerFunc = function (){
     console.log('innerFunc', this);  //window {...
    };
    innerFunc(); // 누가 호출했는지 앞에 지정되이있지
    		     //않으므로 this는 window 객체 가르킴
  }
}

testCar.getName();

const testCar = {
  name:'tico',
  getName:function(){
   console.log("getName",this);   // {name: 'tico', getName:f}
    //화살표함수에서의 this는 함수가 속해있는곳의 상위 this를 계승받음 
    //화살표 함수는 bind 메소드를 제공하지 않음 
    //함수 표현식이므로 호이스팅이 되지않기 때문에 상위 this를 계승받을 수 있지않을까?
    const innerFunc = () => {
     console.log('innerFunc', this);  // {name: 'tico', getName:f} 
    };
    innerFunc(); 
  }
}

testCar.getName();