ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • var, let, const 차이점
    JavaScript/JS 변수 2023. 12. 28. 20:11

    변수 선언 방식

    1. var : 중복 선언 가능

    var name = 'javascript';
    console.log(name); // javascript
    
    var name = 'flutter';
    console.log(name); // flutter
    • var로 선언한 변수는 동일한 이름으로 여러번 중복해서 선언이 가능함. 이와 같은 경우, 마지막에 할당된 값이 변수에 저장된다.
    • 장점으로는 필요할 때마다 변수를 유연하게 사용할 수 있다는 점이고,
    • 단점으로는 기존에 선언해둔 변수의 존재를 잊고 값을 재할당하는 등의 실수가 발생할 가능성이 있다는 점이다.
      위와 같은 단점을 보완하기 위해 ES6부터 추가된 변수 선언 방식이 let 과 const 이다.

    2. let : 중복 선언 불가능, 재할당 가능

    let name = 'javascript';
    console.log(name); // javascript
    let name = 'flutter';
    console.log(name); // Uncaught SyntaxError: Identifier 'name' has already been declared
    name='dart';
    console.log(name); // dart
    • var 와 다르게 let은 해당 변수가 이미 선언되었다는 에러 메시지가 출력된다.
    • name = 'dart' 와 같이 변수 선언 및 초기화 이후 반복해서 다른 값을 재할당 할 수 있다.

    3. const : 중복 선언 불가능, 재할당 불가능

    const name = 'javascript';
    console.log(name); // javascript
    
    const name = 'flutter';
    console.log(name);
    // Uncaught SyntaxError: Identifier 'name' has already been declared
    
    name = 'dart';
    console.log(name);
    // Uncaught TypeError: Assignment to constant variable
    • let 과 const의 차이점은 immutable(불변)의 여부이다. let은 변수에 다른 값을 재할당할 수 있지만, const는 재할당 시 에러 메시지가 출력된다.

    const를 기본으로 사용하여 불필요한 변수의 재사용을 방지하고, 재할당이 필요한 경우 let을 사용하는 것이 좋다.

    스코프 (Scope)

    • Scope란 유효한 참조 범위를 뜻하며, 기존의 방법인 var로 선언한 변수와 let 또는 const로 선언한 변수의 스코프는 다르다.

    1. var : 함수 레벨 스코프 (function-level scope)

    function func() {
        if (true) {
            var a = 5;
            console.log(a); // 5
        }
        console.log(a); // 5
    }
    
    func(); // 5
    console.log(a); // ReferenceError: a is not defined
    • 함수 내에서 선언된 변수는 함수 내에서만 유효하며, 함수 외부에서는 참조할 수 없다.
      함수 내부에서 선언한 변수는 지역 변수, 함수 외부에서 선언한 변수는 전역 변수로 취급

    2. let, const : 블록 레벨 스코프 (block-level scope)

    function func() {
        if (true) {
            let a = 5;
            console.log(a); // 5
        }
        console.log(a); // ReferenceError: a is not defined
    }
    
    console.log(a); // ReferenceError: a is not defined
    • founction, if문, for문, while문, try/catch문 등의 모든 코드 블록 ({...}) 내부에서 선언된 변수는 코드 블록 내에서만 유효하다.
      코드 블록 내부에서 선언한 변수는 지역 변수로 취급

    참고 사이트

    https://80000coding.oopy.io/e1721710-536f-43f2-823b-663389f5fbfa

    'JavaScript > JS 변수' 카테고리의 다른 글

    module, exports, require  (1) 2024.01.30
    JS Console 활용  (1) 2024.01.28
Designed by Tistory.