[JavaScript] var, let, const 차이점

🐣 var · let · const 에 대해서 살펴보자!

---

Javascript 변수를 선언할 때 사용하는 var let const ! 자바스크립트 기초 개념 중에 빼 놓을 수 없는 것에 대해서 다뤄보기로 하자! 

 

var 이제는 varvar

 

🐣 var 

---

1. 개념 및 특징

함수 스코프를 갖고 있으며 변수를 중복 선언해도 에러가 발생하지 않는다.

 

함수 스코프 / 전역 스코프

var의 경우 let, const와 달리 블록 스코프가 존재하지 않음. 함수 스코프이거나 전역 스코프! 따라서 함수가 아닌 블록 안에서 var 변수를 정의하면 해당 블록 밖에서도 이 변수에 접근할 수 있다.

 

var는 중복선언

var는 중복선언이 가능하지만 두번째 선언은 무시되며, 에러는 발생하지 않음.

 

2. 코드

function varExample() {
    var 변수 = 1;
    if (true) {
        var 변수 = 2; // 같은 변수
        console.log(변수); // 2
    }
    console.log(변수); // 2
}
varExample();

var 변수2 = 10;
var 변수2 = 20; // 오류 없음

console.log(변수2); // 20

 

🐣 let

---

1. 개념

블록 스코프

let과 const는 블록 스코프를 갖는다. 

 

중복선언 X

let과 const는 중복선언이 불가능하고 에러가 발생한다.

 

재선언X, 재할당 O

let과 const는 모두 재선언이 불가능하다. 즉 같은 스코프 내에서 같은 변수 이름으로 변수를 다시 선언하는 것이 허용되지 않는다.

let의 경우 재할당이 가능하기 때문에 한번 선언한 변수에 다른 값을 할당할 수 있다.

 

만약 선언과 할당에 대한 개념이 부족하다면, 게시물 참고!

[JavaScript] 변수의 선언, 초기화, 할당

 

 

2. 코드

function letExample() {
    let x = 1;
    if (true) {
        let x = 2; // 다른 변수
        console.log(x); // 2
    }
    console.log(x); // 1
}
letExample();

let y = 10;

// let y = 20; // 오류: 'y'라는 식별자가 이미 선언됨
y = 20; // 재할당은 허용

console.log(y); // 20

 

🐣 const

---

1. 개념

블록 스코프

let과 const는 블록 스코프를 갖는다. 

 

중복선언 X

let과 const는 중복선언이 불가능하고 에러가 발생한다.

 

재선언X, 재할당 X

let과 const는 모두 재선언이 불가능하다. 즉 같은 스코프 내에서 같은 변수 이름으로 변수를 다시 선언하는 것이 허용되지 않는다.

const의 경우 상수로서 한 번 값이 할당되면 재할당이 불가능하다.

 

2. 코드

function constExample() {
    const x = 1;
    if (true) {
        const x = 2; // 다른 변수
        console.log(x); // 2
    }
    console.log(x); // 1
}
constExample();

const y = 10;

// const y = 20; // 오류: 'y'라는 식별자가 이미 선언됨
// y = 20; // 오류: 상수 변수에 값을 할당할 수 없음

console.log(y); // 10

 

 

🐣 var · let · const  요약!

---

var
함수 스코프를 갖고 있으며 변수를 중복 선언해도 에러가 발생X

let
블록 스코프를 갖고 있으며 중복 선언은 허용되지 않고, 변수의 값을 변경 O(재선언X, 재할당O)

const
블록 스코프를 갖고 있으며 상수로, 한 번 선언하고 나면 재할당이 불가능하며 값을 변경 X
(재선언X, 재할당X)

 

 

 

 

 

오늘도 뾰로롱! var은 이제 varvar!