js 변수 종류와 TDZ, hoisting

728x90

let, const

js는 그 동안 var만 존재했기 때문에 이미 만들어진 변수이름으로 재선언해도 아무런 문제가 발생하지 않았다. 그로 인해 변수 재선언 불가능한 const, let이 ES 2015 에서 추가 되었다.

const : 변수 재할당, 재선언 불가능

let : 변수 재할당 가능, 재선언 불가능 but 블록이 다를 경우 가능

let a =5 //선언
let a =7 //재선언 불가능
a = 6 //재할당 가능

let vs var

let은 볼록 명령문이나 let을 사용한 표현식 내로 쓸 수 있는 변수를 선언할 수 있다.

var은 블록을 고려하지 않고 어디에서나 접근 가능하다 (전역 범위)

let a = 6;

if (true) {let a =7;
	console.log(a); 	//7
}
 console.log(a); //6
 
 //만약 let a=7이 아닌 let a=7 이었을 경우, 7

hoisting 관련

호이스팅이란?

인터프리터가 변수화 함수의 메모리 공간을 선언 전에 미리 할당하는 것

-> 변수의 선언과 초기화를 분리한 후 ‘선언’만 코드의 최상단을 옮기는 것

name(‘동동’); // 호출

function firstname (name) {
	console.log( name + “님) } // 함수 선언
    
// 동동님

👆 자바스크립트의 호이스팅으로 함수 선언 전에 호출해도 값이 나온다

var로 선언한 변수의 경우 undefined 로 변수를 초기화 한다.

반면, let const로 선언한 변수의 경우 호이스팅시 변수를 초기화 하지 않는다.

undefined : 변수를 선언하고 할당하기 전의 형태. 아무 것도 할당받지 않은 상태, js가 변수를 초기화할때 사용하는 값

null : 의도를 가지고 변수에 null을 할당하여 값이 없다는 것을 나타냄 (타입 : object)

TDZ

: temporal dead zone

변수 선언 및 초기화 하기 전 사이의 사각지대

선언하기 전에 변수를 사용하는 것을 허용하지 않는다.

영향 받는 구문 : const, let, class

영향 안 받는 구문 : var, function, import

var 는 선언과 초기화가 동시에 이루어져서 호출-함수식 뒤바뀌어도 가능하다.

-> 하지만 이런 점이 코드가 엉키거나 오류를 일으키는 원인이 될 수 있다.

let, const 는 선언과 초기화가 나뉘어 이루어져서 뒤바뀌어도 불가능.

-> 이때 선언과 초기화 사이를 tdz라고 한다

함수식이 나오기 전에 호출을 하면 tdz에서 error를 출력

자바스크립트의 메모리 관리

👎 이런 자동메모리 관리는 잠재적 혼란의 원인인데

개발자가 메모리 관리에 대해 고민할 필요가 없다는 잘못된 인상을 줄 수 있다.

728x90

eunji