[Javascript] Var, Let, Const

1. var

•  var는 전역범위 또는 함수 범위로 지정

아래를 보면, greeting은 전역 범위에 선언되었기때문에 출력이 가능하지만,

greet()함수 안에있는 변수 greet은 함수 안에서 선언되었기 때문에 출력 되지 않습니다.

var greeting = "Hello";

function greet(){
	var greet = "Hi";
}

console.log(greeting); // 출력가능 -- Hello 출력
console.log(greet); // 출력 X  -- Undefined 출력

 

• 재선언되고, 업데이트 가능

var greeting = "hello";
console.log(greeting);

var greeting = "hi";
console.log(greeting);

greeting = "change value";
console.log(greeting);

 

• 초기 변수에 값이 지정되어있지 않을경우 Undefined 로 초기화

var greeting;
console.log(greeting); // undefined

• 이미 선언된 변수를 재선언할 수 있기 때문에, 의도치않게 다른 결과를 초래할수있음 => let과 const의 필요성

2. let

• let으로 선언된 변수는 해당 블록 내에서만 사용 가능

let greeting = "say Hi";
let number = 3;

if (number > 1) {
	let hello = "say Hello instead";
    console.log(hello);// "say Hello instead"
}
console.log(hello) // hello is not defined

• let은 업데이트 될 수 있지만, 재선언은 불가능
  * 단 다른 범위 내에서 정의 된다면 사용 가능!

let test = "Hello";
test = "change!";
console.log(test);

let replay = "Hi";
let replay = "Hi"; // error! 이미 선언되었기때문에


// 단 다른 범위내에서 정의된다면 사용 가능
let name = "kyle";
if(true) {
	let name = "Hi Kyle";
    console.log(name); // "Hi Kyle"
}
console.log(name); // "kyle"

 

3. const

• 블록범위 내에서 접근 가능
• 업데이트도, 재선언도 불가능
  * 단, 개체의 속성일 경우 업데이트 가능

const test = "Hello";
test = "Hi"; // error!

const greeting = "Hi";
const greeting = "Hello"; // error!

//단, 개체의 속성일 경우 업데이트 가능
const a = {
	firstname: "kyle";
    lastname: "hong";
}

a.firstname = "nick"; // 가능!
console.log(a);

 

정리!!

* var는 전역 범위 또는 함수 범위, let과 const는 블록 범위

* var는 업데이트 및 재선언 가능, let은 업데이트 가능, 재선언 불가능, const는 업데이트와 재선언 불가능.

* 세가지 모두 최상위로 호스팅! var변수는 undefined로 초기화, let과 const는 초기화 X

* var와 let은 초기화하지 않은 상태에서 선언 가능, const는 선언중에 초기화

 

참고자료 출처

https://www.freecodecamp.org/korean/news/var-let-constyi-caijeomeun/

Var, Let, Const의 차이점은?