본문 바로가기
Programming 💾

자바스크립트 var, let, const 무슨 의미일까?

by 베이비 직장인 2022. 2. 2.
반응형

자바스크립트를 하면서 var를 가장 많이 보셨을 거라고 생각합니다. 

var는 변수라고 많이들 알고 계실 거라고 생각합니다. 

 

하지만, let 그리고 const에 대해서는 알고 계신가요??

그래서 오늘은 var, let, const가 뭔지 그리고 차이점이 뭔지 설명해볼까 합니다. 

먼저, ECMAScript5까지는 "식별자에 값을 넣어 활용하기 위한 기능"이 var 키워드를 사용한 변수 밖에 없었습니다.

하지만, ECMAScript6부터는 "let키워드를 사용한 변수", "const키워드를 사용한 상수" 라는 개념이 추가되었습니다.

 

- var, let, const 선언 방법

기본적인 사용방법은 var와 동일합니다.

var data1 = 100;
let data2 = 200;
const data3 = 300;

결국에 사용하는 문법도 비슷하니까, 같은 변수라고 생각하면 되겠지.. 라고 생각하시면 안됩니다. 

그러면 지금부터 var, let, const의 차이점에 대하여 알아보겠습니다.

 

키워드 구분 선언 위치 재선언
var 변수 전역 스코프 가능
let 변수 해당 스코프 불가능
const 상수 해당 스코프 불가능

 

먼저 구분에 있는 변수와 상수에 대하여 알아보겠습니다.

변수의 경우는 말 그대로, 변할 수 있는 수를 의미합니다. 상수는 반대로 변하지 않는 값을 의미합니다.

 

var data1 = 100;
data1 = 200;
// var 가능
let data2 = 200;
data2 = 300;
// let 가능
const data3 = 300;
data3 = 400;
// const 불가능

위의 설명과 같이 var, let의 경우는 값을 변화 시킬 수 있지만, const의 경우에는 값을 변화시킬 수 없습니다. 

그래서 const의 경우에는 값이 변하지 않는 변수, 예를 들자면 IP주소, 포트 번호, 메시지 값을 입력합니다.

 

다음은 전역 스코프와 해당 스코프에 관해 설명하겠습니다. 

스코프는 특정 변수를 사용할 수 있는 유효 범위를 말합니다. 코드에서는 보통 대괄호로 묶여져 있는 곳이 스코프입니다.

 

{
    // 스코프 A
    var variable = 200;	
}
{
    {
        // 스코프 B
        alert(variable);
    }
}
// 전역 스코프
alert(variable);

var의 경우는 전역 스코프이기 때문에, 위와 같이 사용해도 에러가 발생하지 않습니다.

하지만, 아래와 같은 let을 사용하는 경우에는 에러가 발생하게 됩니다.

 

let을 사용했을 때의 결과

let은 특정 스코프 내에서만 사용할 수 있기 때문에 다음과 같이 에러가 발생합니다. 

 

마지막으로, 재선언에 관해서 입니다. 

재선언은 말 그대로, 재선언입니다. 같은 이름으로 변수나 상수를 다시 선언하는 것입니다. 

var data1 = 200;
var data1 = 200;

let data2 = 300;
let data2 = 300;

const data3 = 400;
const data3 = 400;

다음과 같이 재선언을 할 경우에는 var의 경우에는 에러가 발생하지 않습니다.

하지만 let, const의 경우에는 에러가 발생합니다. 

 

이렇게 var, let, const에 관해 알아봤습니다.

비슷하면서도 너무 다르네요. 사용법을 확실히 익혀서 필요할 때 사용하시길 바라겠습니다. 

반응형

댓글