ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • 변수 type var, let, const의 장단점과 사용상 주의점
    Javascript 2023. 3. 5. 20:27

    var, let, const는 모두 변수를 선언하기 위해 사용되는 키워드입니다. 각각의 키워드는 서로 다른 특징을 가지고 있으며, 적절한 상황에 적절한 키워드를 사용해야 합니다.

    var

    • 호이스팅이 발생합니다.
    • 함수 스코프를 가집니다.
    • 재선언과 재할당이 모두 가능합니다.
    • 다른 블록에서도 접근이 가능합니다.

    var는 ES6 이전에 사용되던 변수 선언 키워드입니다. 호이스팅이 발생하기 때문에, 변수를 선언하기 전에 사용해도 에러가 발생하지 않습니다. 함수 스코프를 가지므로, 함수 내에서 선언된 변수는 함수 외부에서는 접근이 불가능합니다. 재선언과 재할당이 모두 가능하므로, 변수의 값이 여러번 변경되는 경우에 적합합니다.

    하지만 var는 재선언이 가능하기 때문에, 실수로 같은 변수를 두 번 선언하는 경우가 발생할 수 있습니다. 또한, 다른 블록에서도 접근이 가능하기 때문에, 의도치 않은 변수값 변경이 발생할 수 있습니다. 이러한 문제점 때문에 ES6에서는 let과 const라는 새로운 변수 선언 키워드가 도입되었습니다.

    // 예제 1: var의 사용
    function foo() {
      if (true) {
        var x = 1;
      }
      console.log(x); // 1
    }
    
    foo();

    위 예제는 var를 사용한 경우입니다. if문 내부에서 변수 x를 선언하고 값을 할당한 후, 함수 내에서 x를 출력합니다. 결과값은 1이 출력됩니다. 이는 var가 함수 스코프를 가지기 때문입니다. 따라서, 함수 내부에서 선언된 변수는 함수 외부에서도 접근할 수 있습니다.

     

    let

    • 호이스팅이 발생하지 않습니다.
    • 블록 스코프를 가집니다.
    • 재선언이 불가능하며, 재할당은 가능합니다.
    • 변수의 값이 자주 변경되는 경우에 적합합니다.

    let은 ES6에서 도입된 변수 선언 키워드입니다. 호이스팅이 발생하지 않으므로, 변수를 선언하기 전에 접근하면 에러가 발생합니다. 블록 스코프를 가지므로, 블록 내에서 선언된 변수는 블록 외부에서 접근이 불가능합니다. 재선언이 불가능하므로, 같은 변수를 두 번 선언하는 실수를 방지할 수 있습니다.

    // 예제 2: let의 사용
    function foo() {
      if (true) {
        let x = 1;
      }
      console.log(x); // ReferenceError: x is not defined
    }
    
    foo();

    위 예제는 let을 사용한 경우입니다. if문 내부에서 변수 x를 선언하고 값을 할당한 후, 함수 내에서 x를 출력합니다. 하지만, 결과값은 ReferenceError가 발생합니다. 이는 let이 블록 스코프를 가지기 때문입니다. 따라서, 블록 내부에서 선언된 변수는 블록 외부에서 접근할 수 없습니다.

     

     

    const

    • 호이스팅이 발생하지 않습니다.
    • 블록 스코프를 가집니다.
    • 재선언과 재할당이 모두 불가능합니다.
    • 변수의 값이 자주 변경되지 않는 경우에 적합합니다.

    const는 let과 비슷하지만, 변수의 값이 변하지 않는 상수를 선언할 때 사용됩니다. 재할당이 불가능하므로, 한번 할당된 값은 변경할 수 없습니다.

    // 예제 3: const의 사용
    const PI = 3.14;
    PI = 3.141592; // TypeError: Assignment to constant variable.
    
    let x = {name: 'John', age: 30};
    x.name = 'Mike';
    console.log(x); // {name: 'Mike', age: 30}

    위 예제는 const와 let을 사용한 경우입니다. 첫번째 예제에서는 상수 PI를 선언한 후, 재할당을 시도했을 때 TypeError가 발생합니다. 이는 const가 재할당이 불가능하기 때문입니다. 두번째 예제에서는 변수 x를 선언한 후, 객체를 할당한 뒤, name 속성의 값을 변경하고 출력합니다. 결과값은 {name: 'Mike', age: 30}입니다. 이는 const와 달리 let은 재할당이 가능하기 때문입니다. 따라서, 변수의 값이 자주 변경될 경우 let을 사용하고, 값이 변하지 않는 상수를 선언할 때는 const를 사용합니다.

Designed by Tistory.