📌호이스팅(hoisting)이란?
자바스크립트는 런타임이 아니라 그 이전단계에서 선언한 변수와 함수를 가져가서 메모리에 기억을 해둡니다.함수가 실행되기 전 소스코드의 평가 과정에서 자바스크립트 엔진은 안에 있는 변수들을 범위의 최 상단으로 끌어올리는 것입니다.
즉 변수선언문(뿐만 아니라 모든 식별자)이 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트 고유의 특징을 변수 호이스팅이라고 합니다.
var 키워드를 사용한 변수 선언은 선언단계와 초기화 단계가 동시에 진행된다.
선언단계를 통해 변수이름을 등록하고, 초기화 단계를 통해 암묵적으로undefine를 할당해 초기화 한다.
//a선언하기 전에 호출했음
consol.log(a) //undefind
var a = 1
consol.log(a) //1
var a = 2
consol.log(a)//2변수선언은 소스코드가 순차적으로 실행되는 시점인 런타임 이전에 먼저 실행되지만 값의 할당은 소스코드가 순차적으로 실행되는 시점인 런타임에 실행된다.
let은 Temporal Death Zone(TDZ)
a가 호이스팅되는건 알지만 a가 선언하기 전에는 접근할 수 없어(a의 초기화문이 필요)
//선언되지않앗다고 에러가 나옴
consol.log(a)
let a = 1
consol.log(a)
let a = 2
consol.log(a)consts는 값을 재할당할 수 없어서 변수에 저장된 값을 변경할수 없다면 상수라고 한다.
상수는 한번 정해지면 변하지않는 값, 즉 단 한번만 할당할 수 있는 변수다.
🌱전역변수와 지역변수
for(var i = 1; i<5; i++) {
consol.log(i)
}
//i = 5
consol.log(i)자바스크립트의 포용력...
var는 함수만 지역변수로 호이스팅이 되고 나머지는 다 전역변수로 올려버린다.
🌱함수스코프
함수 스코프(Function Scope)는 변수의 유효 범위를 정의하는 개념입니다. 이는 변수가 함수 내에서 선언되었을 때 해당 함수 내에서만 유효하다는 것을 의미합니다.
JavaScript에서는 함수 내에서 선언된 변수는 함수 내에서만 접근할 수 있습니다. 함수 스코프는 또한 변수의 수명을 제어하고 외부 스코프에서 변수에 대한 접근을 제한함으로써 프로그램의 예측 가능성과 안정성을 높입니다.
🌱블록스코프
블록 스코프(Block Scope)는 변수의 유효 범위를 정의하는 개념으로, 중괄호 {}로 둘러싸인 코드 블록 내에서 변수가 선언되면 해당 변수는 그 블록 내에서만 유효합니다.
자바스크립트에서 블록 스코프는 주로 if, for, while 등의 제어 구조나 함수 내부의 중괄호 블록에서 사용됩니다.
ES6(ECMAScript 2015)에서 도입된 let과 const 키워드는 블록 스코프를 가지고 있습니다. 이전에는 var 키워드를 사용하여 변수를 선언했을 때 함수 스코프가 적용되어 함수 내에서만 유효했지만, let과 const를 사용하면 블록 스코프가 적용되어 더욱 정확한 변수 유효 범위를 제공합니다.
정리
var, let, const는 JavaScript에서 변수를 선언하는 세 가지 방법입니다. 이들 각각은 변수를 다르게 다루고 호이스팅과 관련하여 다른 동작을 합니다.
var
- var는 함수 스코프를 가집니다. 함수 내에서 선언된 변수는 함수 전체에서 유효합니다.
- 변수 호이스팅이 발생합니다. 즉, 선언 전에 변수를 참조해도 에러가 발생하지 않습니다. 선언은 호이스팅되어 함수 또는 스코프의 맨 위로 끌어올려집니다. 하지만 초기화는 그 자리에 남아있습니다.
- 재선언이 가능합니다. 이전에 선언된 변수를 다시 선언할 경우 경고가 발생하지 않고 새로운 값으로 덮어씁니다.
let
- let은 블록 스코프를 가집니다. 중괄호 {} 내에서 선언된 변수는 그 블록 내에서만 유효합니다.
변수 호이스팅이 발생합니다. 선언은 호이스팅되지만 초기화는 호이스팅되지 않습니다. 즉, 변수가 - 선언되기 전에 참조하면 에러가 발생합니다. - 재선언이 불가능합니다. 같은 스코프 내에서 같은 변수를 다시 선언하면 SyntaxError가 발생합니다.
const
- const도 let과 마찬가지로 블록 스코프를 가집니다.
- 변수 호이스팅이 발생하지만 const로 선언한 변수는 선언과 동시에 초기화해야 합니다. 따라서 호이스팅된 변수에 접근하면 초기화 전까지 ReferenceError가 발생합니다.
- 재할당이 불가능합니다. 한 번 할당된 후에는 값을 변경할 수 없습니다. 하지만 객체와 배열 같은 참조형 변수의 경우에는 해당 객체나 배열 내부의 속성이나 요소를 변경하는 것은 가능합니다.
따라서 var는 함수 스코프를 가지고 호이스팅 및 재선언이 가능하며, let과 const는 블록 스코프를 가지고 호이스팅은 하되 재선언이 불가능하고 const는 재할당이 불가능합니다.
