자바스크립트 scope, 스코프 스코프체인, 블록스코프 hoisting

울라불라데덴네·2022년 12월 23일
1

JS의 알쏭달쏭

목록 보기
4/4

스코프 🔍

(Scope, 범위)이다. 자바스크립트와 같은 모든 프로그래밍 언어에는 기본적인 개념이다.
즉, "변수에 접근 할 수 있는 범위" JS에서는 global(전역) 과 local(지역)이 있다.
전역스코프는 말 그대로 전체 영역에서 어디서든 접근이 가능한 것
지역스코프는 해당하는 지역에서만 접근이 가능하다는 것이다.

이해를 돕기 위해 추가적으로 설명하자면 공동냉장고개인냉장고로 볼 수 있다.

****뉴진스 냉장고(공동)개인 냉장고(하니)개인 냉장고(해린)
예시 변수김치, 밥사과레몬

공동 냉장고에서는 모두 김치와 밥을 꺼낼 수 있지만
하니 냉장고에서는 하니만이 사과를 꺼낼 수 있고
해린 냉장고에서는 해린만이 레몬을 꺼낼 수 있다.
고로,
해린은 하니냉장고에서 사과를 꺼낼 수 없다.
하니도 해린냉장고에서 레몬을 꺼낼 수 없다.

하지만
해린과 하니 모두 공동 냉장고에서 김치와 밥은 꺼낼 수 있다.

블록스코프 (block scope)?

ES6에 나온 개념으로 {}로 감싸져 있는 블록내에서만 접근할 수 있는 scope를 의미한다.
가장 큰 특징은 "let"과 "const"로 선언된 변수에만 적용된다는 것이다.
자바스크립트에 var만 있었을 당시에는 블록스코프의 적용을 받지 않아 외부에서도 접근이 가능해 충돌이 일어났었다. 하지만 let과 const에 개념이 들어오면서 블록스코프의 적용을 받는다.

스코프 체인 (scope chain)?

스코프체인은 스코프가 어떻게 연결되고 있는지 보여주는 것이다. scope안에서부터 바깥으로 차례대로 검색해나가는 것이다. 여러 scope에서 동일한 식별자를 선언한 경우에는 무조건 scope chain상에서 가장 먼저 발견되 식별자에게 접근이 가능하다.

호이스팅 (hoisting)?

변수가 선언된 시점보다 앞에서 사용되는 "현상"이다. 선언이 상단으로 끌어올려지는 것 같은 span style="color:red">현상이다. 끌어올려진 것 같은 현상이기때문에 에러가 난다.
❗️에러가 나는 것이 호이스팅이 되지 않은 것이 아니라 호이스팅이 발생했기 때문에 에러가 발생된 것으로 봐야한다.

1단계 : 선언단계
2단계 : 초기화단계
3단계 : 할당단계

varletconst
초기화:undefined초기화되지않음초기화되지않음
profile
Get ready with me

0개의 댓글