Scope (스코프)
참조 대상 식별자 (변수, 함수 이름과 같이 다른 대상과 구분해 식별하는 이름)를 찾기 위한 규칙.
js는 이 규칙으로 식별자 찾음.
이름 같은 변수 2개 있을 때, 무엇을 참조하고 어떻게 식별할 지 정할 때 필요.
-> 식별자에 접근할 수 있는 범위.
스코프의 구분
1. 전역 스코프 (global scope)
전체 범위. 코드 어디서든 참조 가능한 스코프.
2. 지역 스코프 (local scope)
해당 지역에서만 접근 가능.
js에서 함수 선언하면 새로운 스코프 생성, 함수 안에서 선언한 변수는 함수 밖에서 접근 X.
-> 이게 함수 스코프. (함수 스코프는 지역 스코프.)
모든 변수는 스코프를 가짐.
변수 관점에서 스코프는 선언 지역에 따라 전역 변수와 지역 변수로 나뉨.
var a = 1; // 전역 스코프, 전역 변수
function print() { // 지역 스코프
var a = "hello" // 지역 변수
console.log(a); // hello
}
print();
console.log(a); // 1타 언어와의 차이
대부분 C 기반 언어들은 블록 레벨 스코프 (block-level).
- 블록은 하나 이상의 구분 그룹 시 사용, {} 안에 있는 코드.
- if, for, while 등등
But, js는 함수 레벨 스코프 (function-level) 따름.
함수 레벨 스코프 (function-level scope)
함수 레벨 스코프는 함수의 코드 블록만을 스코프 범위로 함.
함수 내에서 선언된 변수는 함수 내에서만 접근 가능하고 외부에서는 X.
함수 외부에서 선언한 변수는 모두 전역 변수가 됨. -> 전역 변수 남발할 가능성 주의해야 함.
var로 선언된 변수들은 오직 함수 스코프만을 따름.
블록 레벨 스코프 (block-level scope)
함수 레벨 스코프는 모든 코드 블록 (if, for, while 등) 내에서 선언된 변수는 코드 블록 내에서만 유효하며 코드 블록 외부에서는 참조 불가능.
코드 블록 내부에서 선언한 변수는 지역 변수.
기존 js에서는 함수 스코프만 따랐지만, ES6부터 let, const 키워드가 추가되면서 블록 키워드 따를 수 있게 됨.
let a = 123; // 전역 변수
{
let a = 456; // 지역 변수
let b = 456; // 지역 변수
}
console.log(a); // 123
console.log(b); // ReferenceError: b is not definedvar, let, const
js의 변수 선언 방식 3가지.
ES6 이후 let, const 주로 사용.
중복 선언과 재할당
var
var는 중복 선언, 재할당 모두 가능.
var a = 1;
console.log(a); // 1
var a = 2;
console.log(a); // 2
a = 3;
console.log(a); // 3let
let은 재할당 가능, 중복 선언은 허용 X.
let a = 1;
console.log(a);
a = 2;
let a = 3;
console.log(a); // SyntaxError: Identifier 'a' has already been declaredconst
const는 재할당 허용 X, 중복 선언 허용 X.
상수 선언하는 키워드.
const a = 1;
console.log(a);
a = 2; // TypeError: Assignment to constant variable.
const a = 3;
console.log(a); // SyntaxError: Identifier 'a' has already been declared스코프 범위
var : 함수 범위 스코프, var 변수는 함수 내부에서만 참조 가능.
let, const : 블록 단위 스코프, {} 블록 내부에서 선언된 변수는 외부에서 참조 X.
호이스팅
var는 호이스팅 발생.
<참고>
