[javascript] Scope에 대해

스코프란?

변수 접근 규칙에 따른 유효 범위 ( 안쪽 스코프에서는 바깥쪽 스코프로 접근 가능 , 하지만 반대는 불가능 )  

스코프는 보통 중괄호(블록) 이나 함수로 스코프를 나눕니다. 

블록 스코프

함수 스코프

위의 예제처럼 스코프는 블록스코프, 함수스코프로 나눌 수 있습니다. 바깥쪽에서 선언된 변수는 안쪽에서 사용할 수 있지만 안쪽에서 선언된 변수는 바깥쪽에서 사용할 수 없습니다. 

 

스코프 규칙

1. 스코프는 중첩이 가능합니다. 

가장 바깥에 선언된 a 는 모든 스코프에서 사용가능하지만 scope 1에서는 안쪽 스코프의 변수를 접근할 수 없습니다. 

스코프의 중첩

여기서 가장 바깥 스코프 scope1 은 전역 스코프라고 부르고 나머지는 지역 스코프라고 부릅니다.  전역 변수 지역 변수라는 말을 많이 들어보였을 겁니다. 전역 스코프 내에 선언된 변수는 전역 변수, 지역 스코프 내에 선언된 변수는 지역 변수라고 불립니다. 

 

2. 지역 변수는 전역 변수보다 더 높은 우선순위를 가진다. 

콘솔의 출력되는 결과는 ?

김코딩 

박해커

김코딩 이 출력됩니다. 예제 코드를 살펴봅시다. 

첫 번째 출력은 첫째 줄에서 전역 변수로 선언된 name을 가져옵니다. 이는 showName 함수 안쪽에 선언된 지역변수 name은 스코프 규칙에 의해 접근 할 수 없으므로 전역 변수로 선언된 '김코딩'을 출력합니다. 

두번째 출력은 함수안에서 선언한 name 이라는 지역 변수에 접근합니다. 변수 이름이 전역 변수와 같지만 지역 변수가 전역 변수보다 우선순위가 높으므로 지역 변수로 선언된 '박해커'가 출력됩니다. 이처럼 동일한 변수 이름으로 인해 바깥쪽 변수가 안쪽 변수에 의해 가려지는 현상을 쉐도잉 (variable shadowing) 이라고 부릅니다. 

세번쨰 출력은 첫번째 출력과 동일하게 전역변수 name 인 '김코딩'을 출력합니다.

 

여기서 위의 예제에서 변수의 선언키워드인 let 을 사용하지 않는다면? 

let 키워드를 사용한 선언이 존재하지 않음

함수 내의 name ='박해커' ; 는 전역에 선언된 name 변수를 그대로 사용하겠다는 의미입니다. 지역 스코프에서 새로 선언되지 않으면 같은 변수입니다. 따라서 함수가 실행되기 전에는 김코딩 , 그 후에는 박해커가 출력됩니다. 

 

---

 

스코프의 종류 

블록 스코프	함수 스코프
중괄호를 기준으로 범위를 구분함	function 키워드가 등장하는 함수 선언식 및 함수 표현식으로 구분 함

 

여기서 화살표 함수는 블록 스코프로 취급합니다. 함수이지만 함수 스코프가 아닙니다. 

 

변수와 관련해서는 전에 포스트에서 다뤘던 변수 var ,let ,const 글을 참고하시길 바랍니다 ! 

 

오늘도 즐공!!