[JS] var, let, const 차이점

chaeem·2021년 5월 31일
0

JS

목록 보기
3/6
post-thumbnail

JS에서 변수를 선언할 수 있는 방법은 var, let, const가 있다.
let, const 가 없던 과거에는 var가 유일한 방법이었지만 앞선 두가지 선언자가 등장한 이후에는 var가 가지고 있던 오류나 문제점등을 개선할 수 있기 때문에 최근에는 거의 사용하지 않는 추세를 가진다.

그렇다면 어떤 오류가 발생할 수 있는것일까? 그 이유를 아래에서 코드를 작성해보며 찾아보려한다.


1. var vs let

var를 사용하여 변수를 선언하면 동일한 변수명이라도 여러번 선언할 수 있는 특징이 있다. 이것이 간단하면서 좋기도 하지만 코드량이 많아지고 작업이 복잡해지면 치명적인 오류로 번질 수 있기 때문에 나쁘기도하다. 코드로 예를 들면 이러하다.

var textOne = 'helloworld';
var textOne ='sign up please!';

console.log(textOne);

을 실행하면, 2번째로 입력했던 값인 sign up please! 가 출력된다.
변수명이 똑같은데도 오류가 발생하지 않고 적용된것을 볼 수 있다. 만약 이상황에서
let을 선언자로 사용했을 경우는 어떨까?

let textOne = 'helloworld';
let textOne ='sign up please!';

console.log(textOne);


위의 이미지와 같이 문법적 오류가 발생한다. 이미 선언된 변수 이름이라고 알려주는 경고창이 나오는것을 볼 수 있다.


오류를 수정해보면, 아래와 같다.
let textOne = 'helloworld';
let textTwo ='sign up please!';

console.log(textOne, textTwo);

코드가 정상적으로 출력되는 것을 볼 수 있다.


2. const vs let


consts는 상수를 표현한다. 'constant' 일정하다는 의미이다. 이는, 한번 선언한 변수를 변경할 수 없도록 한다. 만약 변수가 바뀌어도 괜찮다면 let을 사용해도 좋다.

let은 변수에 재할당이 가능하지만,const는 변수 재선언, 재할당 모두 불가능

let 과 consts를 비교해보자.

let a = 'practice'
let b = 'practice2'
a = 'test3'

console.log(a);

위 코드를 실행시 출력값은 변경된 값인 test3이다.
반면, const는

const a = 'practice'
const b = 'practice2'
a = 'test3'

console.log(a);

에러가 발생한다. const는 재선언이나 재할당이 필요할때는 사용할 수 없는것을 알 수 있다.

profile
FE개발 공부중

0개의 댓글