스코프

김태형·2021년 12월 9일
0

Javascript

목록 보기
10/12

스코프(유효범위)

var var1 = 1;
if(1){
   var var2 =2;
   if(1){
     var var3 =3;
   }
}

function outer(){
  var var4 = 4;
  function inner(){
   var var5 = 5; 
  }
}

console.log(var1);//1
console.log(var2);//2
console.log(var3);//3
console.log(var4);//에러
console.log(var5);//에러

위와 같이 변수는 참조할 수 있는 범위가 정해져있다. 아무곳에서나 참조 불가능

자바스크립트는 스코프를 통해 어떠한 식별자를 참조할 것인지 결정한다. 이것이 식별자 결정 이다.

	var x = 'global';

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

	foo(); //local
	console.log(x); //global
	

위와 같이 같은 변수명이지만 출력하는 값은 다르다.

변수의 유효범위 때문이다. 만약 foo()안에 x가 없다면 외부에서 x를 찾는다.
내부에서 외부는 참조가 가능하나 외부에서 내부는 참조가 불가능하다.

코드가 어디서 실행되고, 주변에 어떠한 코드가 있는지를 렉시컬 환경이라고 부른다.

코드의 문맥은 렉시컬 환경으로 이루어진다. 이를 구현한것이 실행컨텍스트이며 모든 코드는 실행 컨텍스트에서 평가되고 실행된다. 스코프는 실행컨텍스트와 밀접한 관련이있다.

스코프가 없다면 각종 식별자의 이름이 중복되었을 때 상상할 수 없는 일이 일어난다.

스코프는 컴퓨터의 디렉토리와도 밀접한 관련이 있다. 같은 파일명은 같은 디렉토리안에 존재할 수 없다. 이것과 마찬가지.

스코프의 종류

스코프는 전역스코프, 지역스코프가 존재 한다고는 하나. 사실 전역스코프도 나는 지역스코프라고 생각한다. 전역스코프도 결국 어떠한 스코프안에 존재하는 스코프일 뿐. 그냥 내가 만들고 있는 프로젝트의 가장 root 에있는 식별자가 전역이라고 생각하자.

전역스코프 : 나의 프로젝트에 가장 바깥쪽 스코프
지역스코프 : 전역 스코프 안에 존재하는 모든 스코프

함수레벨 스코프와 블록레벨 스코프

ES5의 선언문 var 은 함수레벨 스코프를 사용하고, ES6의 let, const는 블록레벨 스코프를 사용한다.

if(true){
	var var1 = 1;
}

if(true){
	let var1 = 10;
  	let var2 = 20;
}

console.log(var1) // 1출력;
console.log(var2) // var2 is not defined

위 코드의 결과 값을보면 let 는 전역스코프에서 찾아볼수가 없다. 이는 let, const는 {} 로 구분된 모든 블록에서 지역스코프를 형성하고 var는 함수에서만 지역스코프를 형성하기 때문이다.
간단하게 var 키워드는 함수 내에서만 지역스코프를 가지고 let, const는 자신이 속해있는 모든 블록 {코드...} 에서 지역스코프를 가진다.

스코프 체인

자바스크립트 엔진은 식별자를 참조한 스코프에서부터 상위로 이동하면서 식별자를 검색한다.

var x = 1;

function foo(){
 console.log(x); 
}

foo();
// foo의 지역스코프에 x가 없기때문에 foo()가 값으로 평가될 때
// 상위스코프로 올라가서 x를 참조한다.
function foo(){
 var x = 1;
}
foo();

console.log(x); //외부에 없으니 내부에서 찾을까? 답 : X

//var x 는 foo()의 스코프에서만 생존하기 때문에 외부에서 참조가 불가능하다.
//다른 경우에도 마찬가지이다. 외부스코프에서 내부스코프는 접근이 불가능하다.

//실행 컨텍스트와 밀접한 관련이 있는듯하다..

렉시컬 환경

스코프 체인은 실행 컨텍스트의 렉시컬 환경을 단방향으로 연결한것이다.

profile
생각정리 공간

0개의 댓글

관련 채용 정보