[모딥다] JS (3) - 스코프

1. 스코프

: 유효범위라고도 하며, 모든 식별자(변수 이름, 함수 이름, 클래스 이름)는 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할 수 있는 유효 범위가 결정되는 것을 스코프라고 한다. 
: 식별자가 유효한 범위를 말함

 

2. 식별자 결정
: 이름이 같은 두 개의 변수 중에서 어떤 변수를 참조해야 할 것인지를 결정해야 하는 것. 스코프

 

: 유효범위라고도 하며, 모든 식별자(변수 이름, 함수 이름, 클래스 이름)는 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할 수 있는 유효 범위가 결정되는 것을 스코프라고 한다. 

: 식별자가 유효한 범위를 말함

 

 

 

2. 식별자 결정

: 이름이 같은 두 개의 변수 중에서 어떤 변수를 참조해야 할 것인지를 결정해야 하는 것

var x = 'global';

function foo() {
    var x = 'local';
    console.log(x); // 'local'
 }
 
 foo();
 
 console.log(x) // 'global'

 

3. 렉시컬 환경

: "코드가 어디서 실행되며 주변에 어떤 코드가 있는지" 를 렉시컬 환경이라 한다. 

: 코드의 문맥은 렉시컬 환경으로 이뤄진다. 이를 구현 한 것이 실행 컨텍스트이다.

: 실행 컨텍스트에서 모든 코드가 평가되고 실행된다.

 

4. 식별자 특징

: 식별자는 어떤 값을 구별하여 식별해낼 수 있는 고유한 이름을 말하기 때문에 반드시 유일해야 하고, 중복될 수 없다.

 

5. 스코프의 종류

1) 전역

 : 코드의 가장 바깥 영역

: 전역 스코프 , 전역  변수를 일컫는다.

 

2) 지역

: 함수 몸체 내부

: 지역 스코프, 지역 변수를 일컫는다.

 

var x = 'global x';  // 전역 스코프
var y = 'global y'; // 전역 스코프

function outer() { // 지역 스코프
    var z = "outer's local z";
    console.log(x); // global x
    console.log(y); // global y
    console.log(z); // outer's local z
    
    
    function inner() { // 지역 스코프
        var x = "inner's local x";
        console.log(x); // inner's local x
        console.log(y); // global y
        console.log(z); // outer's local z
    }
    inner();
}

outer();

console.log(x); // global x
console.log(z); // Referrence Error :  z is not defined

 

6. 스코프 체인

: 함수 몸체 내부에서 함수가 정의 되는 것을 함수의 중첩이라 한다.

: 이 때 내부에서 정의된 함수를 중첩 함수, 바깥에 있는 함수를 외부 함수라고 한다.

: 스코프가 함수의 중첩에 의해 계층적 구조를 갖는 것을 의미한다.

: outer 함수가 만든 지역 스코프는 inner 함수가 만든 지역 스코프의 상위 스코프임.

: outer 함수의 상위 스코프는 전역 스코프가 될 수 있음

: 위처럼 스코프가 계층적으로 연결 된 것을 스코프 체인이라 함

: 자바스크립트 엔진은 스코프 체인을 통해 변수를 참조하는 코드의 스코프에서 시작하여 상위 스코프 방향으로 이동하여 선언된 변수를 검색 한다.

: 따라서 상위 스코프에서 유효한 변수는 하위 스코프에서 자유롭게 참조할 수 있지만 , 하위 스코프에서 유효한 변수를 상위 스코프에서 참조할 수 없다.

: 자식은 부모의 자산을 사용할 수 있지만 부모는 자식의 자산을 함부로 사용할 수 없는 상속과 유사

 

7. 함수 레벨 스코프

: 코드 블록이 아닌 함수에 의해서만 지역 스코프가 생성된다는 의미

: 대부분 프로그래밍 언어는 모든 코드 블록이 지역 스코프를 만드는데 이러한 특성을 블록 레벨 스코프라 한다.

: 하지만 var 키워드로 선언된 변수는 오로지 함수의 코드 블록(함수 몸체)만을 지역 스코프로 인정한다. 이러한 특성을 함수 레벨 스코프라 한다. 

 

8. 렉시컬 스코프 

: 자바스크립트는 렉시컬 스코프를 따르기 때문에 함수를 어디서 정의했는지에 따라 상위 스코프를 결정한다.

: 함수가 호출된 위치는 상위 스코프 결정에 아무런 영행도 주지 않는다.