JAVASCRIPT scope and scope chain
앞서 실행 컨텍스트 에서는 scope chain이 존재 한다고 언급하였다.
스코프와 관련된 여러 용어 부터 알아보자.
Scoping : 프로그램의 변수가 어떻게 조직되어 있고 접근 가능한 지이다. "어디서 변수들이 살고 있는지" , "어디서 특정한 변수에 접근할 수 있는지"
Lexical scoping : scoping이 함수의 위치 그리고 코드의 블럭에 따르는 것이다.
Scope : 특정한 변수가 선언된 장소나 환경이다.(variable environment 는 함수의 경우이다.) 전역 규모, 함수 규모 그리고 block 규모가 있다.
Scope of a variable : 특정한 변수에 접근 가능한 코드의 지역
스코프의 세가지 종류
자바스크립트에는 세가지 종류의 scope가 있다.
먼저 Global scope
어떠한 함수나 블럭 밖에 위치하여 있다.
global scope 에서 선언된 모든 변수들은 모든 곳에서 사용가능하다.
Function scope
1.변수들은 오직 함수 안에만 접근가능하다.
2.local scope 라고도 불린다.
Block scope
1, 변수들은 오직 block 안에서만 접근 가능하다.
2. 그러나, 오직 let 그리고 const 변수들만 적용된다.(var 은 적용 안됨)
3. 함수들은 또한 block scope 이다.
(strict mode 에서는 블럭 스코프이지만)
(strict mode 가 아닐 시 function scope 이다)
scope chain 에 대해 알아보자.
가장 먼저 global scope
1. myName = 'jonas'
그 아래엔 first() scope
1. age = 30
2. millennial = true
1. myName = 'jonas'
그 아래에는 if block scope 그리고 second() scope 가 나열 되어 있다.
if-block-scope
decade = 3
1. age = 30
2. millennial = true
1. myName = 'jonas'
second() scope
job = 'teacher'
1. age = 30
2. millennial = true
1. myName = 'jonas'
각 scope 에서 사용 가능한 변수를 모두 넣어줬다.
이처럼 안쪽 스코프에서 바깥쪽 스코프의 변수를 사용가능하게 하는 것이 scope chain 이다.
if block scope 와 second() scope 는 서로 나열 되어 있을 뿐 안쪽 바깥쪽 관계가 아니기 때문에 변수를 가져오지 못한다.
특히 block scope 는 오직 let 과 const 에만 적용 되기 때문에 if-block 안에 쓰인 var 은 first() scope 안에 있어 second() scope 에서도 사용 가능하다는 특징이 있다.
const name = 'myname';
function newname(){
const name = 'newname';
}
다음의 코드는 아무런 문제가 없다. 왜냐하면 scope chain 이 일어 난다면 문제가 생기겠지만 function scope에서 scope chain이 필요없기 때문에 아무런 문제가 없다.
let name = 'myname';
function newname(){
name = 'newname';
}
다음의 코드는 조금 다르다. function scope 안에서 name 이라는 변수는 없다. 스코프 안에 변수가 없으므로 자바스크립트 엔진은 변수를 찾을 때 까지 variable lookup 을 하게 되어 scope chain 이 일어난다 이때 첫줄의 name= 'myname'을 찾게 된다. 그리고 전역 스코프의 변수를 변경 시켜주기 때문에 위의 코드랑 아래 코드는 스코프 체인이 사용됬나 안됬나에 차이가 있다.
요약하자면
scoping은 어디에 변수가 있지 또는 어디에 우리가 변수에 접근 가능하지 어디에는 안되고? 이다.
자바스크립트에는 세가지 종류의 스코프가 있는데 global scope, scopes defined by functions , and scopes defined by block 이다.
오직 let 그리고 const 변수만이 block scope 이며 var로 선언된 변수는 가장 가까운 function scope 로 선언된다. (es6 에서 시작됨)
자바스크립트는 lexical scoping 을 사용한다. 따라서 어디서 변수에 접근하지 에 관한 룰은 정확히 함수들과 block 이 쓰여진 곳에서 사용한다.
모든 스코프는 항상 자기의 바깥 스코프의 모든 변수를 사용할 수 있다. 이것이 scope chain 이다.
변수가 현재 스코프 내에 없을 때 엔진은 스코프 체인을 살펴본다. 변수를 찾을때 까지 그리고 이것을 variable lookup 이라고 부른다.
스코프는 자기 내부의 스코프를 참조 할 수 없다.
스코프 체인은 모든 parent scope의 variables environment 합친 것과 같다.
call stack 에서 execution context 가 실행된 순서와 함수 스코프와는 무관하다.
댓글
댓글 쓰기