상권's

var, let, const의 차이점을 간단하게 알아보자. 본문

~2022 작성 글/자바스크립트

var, let, const의 차이점을 간단하게 알아보자.

라마치 2021. 9. 30. 12:10

※ 제가 자바스크립트를 배우기 시작할 당시 변수 선언 방식을 정확하게 이해하기 많이 어려웠습니다.  이렇게 간단하게 정리를 함으로써 추가적인 학습을 하였을 때 쉽게 이해를 할 수 있었습니다.

 

입문자분들께서 이 글을 통해서 간단하게 이해를 하고 추후에 더 깊은 학습을 하셨을 때, 도움이 되셨으면 좋겠습니다.

 


 

var는 변수가 선언이 되고 할당이 되었더라고, 재선언이 가능하다. 블록 스코프를 무시할 수 있다. 단, 화살표 함수의 블록 스코프는 무시하지 않는다. - 블록 스코프의 내부에서 선언 되더라도 블록 스코프의 밖에서도 사용할 수 있다. 함수 스코프는 따른다. 블록은 내부에서 들여쓰기가 적용이 되어서 변수 선언을 쉽게 할 수 있다. 하지만 var의 경우에는 블록 스코프를 무시하기 때문에 let으로 선언하는 것이 권장된다. let는 재선언은 되지 않지만, 재할당은 된다. 재선언이 되지 않기 때문에 재선언을 할 경우에 에러가 발생한다. 이를 통해서 버그를 줄일 수 있다. 블록 및 함수 스코프에서 다 이용 가능 const는 재선언, 재할당이 안된다. 블록 및 함수 스코프에서 다 이용 가능

 

자바스크립트에는 변수 선언 방식이 var, let, const가 있습니다.

 

그렇다면 자바스크립트에는 왜 변수 선언 방식이 세가지나 있는지, 각 변수 선언 방식의 차이가 무엇인지 알아보겠습니다.

 

var - 한 코드 내에서 재선언 가능.

코드 내에서 쓰일 때 마다 선언되는 변수 다르기 때문에 코드가 바뀔 수 있습니다. 

- 이러한 이유로 사용을 지양하는 것이 좋습니다.

var name = 'sangkwon'
console.log(name)
var name = 'kim'
console.log(name)

//sangkwon
//kim

 


 

let, const - 선언할 경우, 코드 내에서 재선언이 불가능.

vscode에서 이렇게 코드를 작성하고 실행을 할 경우, name이 이미 선언되어있다고 SyntaxError 발생합니다.

이를 통해서 추후에 에러가 발생하는 것을 방지할 수 있습니다.

 

let name = 'sangkwon'
console.log(name)
let name = 'kim'
console.log(name)

SyntaxError: Identifier 'name' has already been declared

const name = 'sangkwon'
console.log(name)
const name = 'kim'
console.log(name)

SyntaxError: Identifier 'name' has already been declared

 

둘의 차이점은 let은 재할당이 되고 const는 재할이 안됩니다.

let name = 'sangkwon'
console.log(name)
name = 'kim'
console.log(name)

sangkwon
kim

-----------------------------------------------------------------------------------

const name = 'sangkwon'
console.log(name)
name = 'kim'
console.log(name)

TypeError: Assignment to constant variable.

 

결론 : var = 재선언가능, let = 재선언 불가능, 재할당 가능, const = 재선언, 재할당 둘 다 불가능.

Comments