Variables - dead zone, bock scope

✨ Dead Zone ✨

 

var을 이용해서 이렇게 작성해 보자

console.log(myName);
var myName = 'Hwayeon';
// undefined

 

hoisting은 JS가 프로그램을 실행하기 전에 얘네들을 어딘가로 이동시킨다는 것이다.

 

무조건 위에서 아래로 이동하는 것이 아니라, 이런 것들을 가지고 가서 어딘가로 옮겨주는 것이다.

hoisted의 뜻은 프로그램이 시작될 때 variable들이 미리 top으로 끌어올려지는 것이다.

var myName;
console.log(myName);
myName = 'Hwayeon';
// undefined

이런 경우는 원래 에러를 내야한다.

 

만약 let으로 바꾼다면

console.log(myName);
let myName = 'Hwayeon';
// Uncaught ReferenceError : myName is not defined

이렇게 에러를 낸다.

죽은 것이다!

JS는 hoisting을 하지 않는데, 그 말은 top으로 끌어올리지 않는다는 말이다.

 

const와 let을 씀으로써 좀 더 엄격해졌지만, 좀 더 좋아졌다는 의미!

 

 

 

✨ Block Scope ✨

 

let과 const는 block scope가 있다.

 

scope는 기본적으로 버블이다.

이 버블들이 variable들이 접근가능한지 아닌지를 감지해 준다.

 

if(true) {
  let hello = "hi";
}

console.log(hello);

// Uncaught ReferenceError: hollo is not defined

let과 const는 if 안에서 block scoped 되어있는데, 그 block 안에서만 존재한다는 뜻이다.

block은 { } 이 두가지로 만들어져 있다.

 

해당 괄호 밖에서 hello는 존재하지 않는다.

 

만약 var을 쓴다면?

if(true) {
  var hello = "hi";
}

console.log(hello);

// hi

var을 쓰면 block scope 같은 건 없다!

if나 while, for 구문 안에서 var로 변수를 만들 수 있다.

 

var은 function scope을 가지고 있다.

그 뜻은 var가 function 안에서 접근할 수 있다는 뜻!