Execution Context

var point = 100;

var Foo =function(){
    this.point = 1;
    this.setPoint = function(point){
        this.point = point
    };
    this.getPoint = function(){
        // return this.point;
        return point;
    };
}

console.log(foo.getPoint()) // 100 출력

생성시점은 실행 가능한 코드를 만났을 때이다. 

상태 컴포넌트의 3가지 유형

1. 정적 환경 컴포넌트

2. 변수 환경 컴포넌트

3. this 바인딩 컴포넌트

 

정적 환경 컴포넌트는 실행 컨택스트에서 함수 안의 함수와 변수들을 기록한 것이다.

변수 환경 컴포넌트는 초기값 복원을 할 때 사용하는 것으로 정적 환경 변수와 같은 레벨로 설정한다.

this 바인딩 컴포넌트는 this로 참조할 오브젝트만 바인딩시킨다.

var point = 100;

//참조할 객체의 this 바인딩
var Foo =function(){
    this.point = 1;
    this.setPoint = function(point){
        this.point = point
    };
    this.getPoint = function(){
        return this.point;
    };
}
foo.setPoint(200);
console.log(foo.getPoint()); // 200 

만약 여기서 getPoint()의 반환값에 this를 사용하지않는다면

this 객체로 바인딩시켜주지 않기 때문에 참조 대상이 없기에 전역 변수의 값을 가져올것이다

var point = 100;

var Foo =function(){
    this.point = 1;
    this.setPoint = function(point){
        this.point = point
    }
    this.getPoint = function(){
        // return this.point;
        return point;
    };
}
console.log(foo.getPoint()); //100