객체내 this가 어떻게 바인딩되는지 알아보자
this란 무엇인가?
반드시 메소드내에 존재해야 하며 런타임에 메소드를 호출하는 객체를 가리키는 지시자.
let user = {
firstname:'lee',
age:this.firstname,
}
console.log(user.age);위 설명에 this는 반드시 메소드내에 존재해야 한다고 했는데 위 this는 함수내에 있지 않고 객체내에 있다. 잘못된 코드로 에러를 발생할것 같다.....?
실행하면 에러없이 undefined가 출력된다....?
에러가 없다는 것은 문법에 어긋나지 않는 코드라는 것이다.
this에 가장 가까운 함수가 무엇인가? 함수가 없다면 에러가 날 것이다.
가장 가까운 함수는 전역함수이며 전역함수는 window객체에의해 호출되는 것으로 window.firstname을 찾기때문에 undefined가 출력된 것이다.
this에 가장 가까운 함수를 찾는 것이 객체를 찾는 첫번째 방법이라는 것이다.
결코 this를 감싸는 객체가 this객체가 아니다라는 것이다.
위 코드는 this.firstname 즉 'lee'값을 age프로퍼티에 할당하려는 의도이지만 this가 어떻게 결정되는지 전혀 모르고 this가 객체를 가리키니 user객체내에 있으면 user객체를 가리킬것같은 나이브한 생각으로 작성한 코드인 것이다.
let user = {
getName:function(){
console.log(this);
}
};
user.getName();this가 어디에 있는가? 객체메소드내부에 있다.
this를 가진 getName메소드가 어떤 객체와 연결되는지 찾으면 된다.
user.getName();
속성접근자는 user객체의 getName프로퍼티에 접근하여 메모리에있는 값을 반환하는 것으로 할일을 다한것이다.
(); 함수실행연산자가 있으므로 getName프로퍼티가 함수이면 실행하는 것이다.
자바스크립트에서 객체 프로퍼티는 프로퍼티일뿐 그이상 그이하도 아니다.
user.getName의 getName이 어디에 누구의 프로퍼티로 있는것인지 중요하지 않다. ( 이것이 자바스크립트의 유연성이다 )
프로퍼티가 접근 가능하면 속성접근자가 알아서 객체와 연결해준다.
this는 메소드내부에 있어야하고 메소드는 객체와 연결된다.
this는 자신을 소유한 함수에 연결된 객체를 참조하게 된다.
