[JS] 변수 선언 - var, let, const 비교

변수 선언 3가지

1. let

▶ ES6에 추가된 키워드

▶ 재선언은 불가능 하지만 재할당은 가능하다

▶ Read / Write 가능

 

let name = 'eunji';
console.log(name);  // eunji

 

let으로 name이라는 변수를 선언하고

선언함과 동시에 'eunji' 라는 값을 할당한 것이다.

이것을 consle창에 출력해보면 eunji라는 값을 확인할 수 있다.

 

name = 'hello';
console.log(name);  // hello

 

다시 변수 name 에 'hello'라는 값을 할당하면

console창에서 hello로 값이 변경된 것을 확인할 수 있다.

 

비어져 있는 여러개의 메모리 박스가 있다.

키워드 let 으로 변수를 선언하게 되면

하나의 메모리 박스를 가리키는 포인터가 생기게 된다.

 

 

변수 name 에 값 'eunji'를 할당하면

변수 name 이 가리키는 메모리 박스안에 값 'eunji'를 저장할 수 있다.

그리고 후에 변수 name 이 가리키는 메모리 박스 안에

다른 값을 넣어서 저장할 수도 있다.

 

 

2. cosnt

▶ 재선언, 재할당 불가능

▶ Read only

 

let으로 변수를 선언하면 하나의 메모리 박스를 가리키는 포인터가 생기고,

이 포인터를 이용해서 값을 계속 바꿀 수 있다.

하지만 const 로 변수를 선언하면 메모리 박스를 가리키는 포인터가 잠기게 된다.

그래서 변수의 재선언과 재할당이 불가능하다.

 

const를 사용해야 하는 이유: 보안성, thread 안정성, 실수 방지

 

 

3. var

▶ 웬만하면 사용하지 않는 게 좋다.

▶ 선언이 hoisting 된다.

▶ block scope을 무시한다.

 

대부분의 프로그래밍 언어에서는 변수를 선언하고 나서 값을 할당한다.

 

var age;  // (변수 선언)
age = 4;  // (변수 할당)

 

JavaScript의 var는 선언도 하기 전에 값을 할당하는 것을 가능하게 한다.

이것을 var hoisting이라고 한다.

 

hoisting 이란, 선언한 위치와 상관없이 선언을 항상 파일 제일 위로 올려주는 것이다.

 

age = 4;  // (변수 할당)
var age;  // (변수 선언)

 

심지어 값을 할당하기 전에도 출력할 수 있다.

 

console.log(age);  // undifined (변수는 정의되어 있지만, 값이 할당되지 않음)
age = 4;
console.log(age);  // 4 (값을 할당하고 나면 값이 추력이 됨)
var age;

 

var는 Block scope이 없다. block을 무시한다.

 

{
  var age;
  age = 4;
}
console.log(age);  // 4

 

 

---

변수의 유효 범위

1. Block scope

- 블록 안에서 정의된 변수

-  블럭 안에 작성된 변수는 블럭 밖에서 접근할 수 없다.

2. Global scope

- 블록 밖에서 정의된 변수

- 어느 곳에서나 접근이 가능하다.

 

let globalName = 'global name';

{
  let name = 'eunji';
  console.log(name);  // eunji

  console.log(globalName);  // global name
}

console.log(name);  // 아무값도 출력 X
console.log(globalName);  // global name

 

Block scope 변수(name)는 블록 밖에서 접근을 하게 되면

console에 아무 값도 나오지 않는다.

Global scope 변수(grobalName)는 블록 밖에서 접근해도, 안에서나 접근해도

console에서 확인할 수 있다.

 

 

---

 

변수 선언 시 보안성, 안정성 등을 위해 기본적으로 const를 사용하고,

재할당이 필요한 경우에는 let을 사용하되, 변수의 scope을 최대한 작게 하여 사용한다.

 

Global scope변수는 가능한 적게 사용하고,

필요한 부분에서만 Block scope 변수를 정의해서 사용하는 것이 좋다.

 

 

 

 

내용 출처 : 드림 코딩 by 엘리

본 포스팅은 개인 공부를 목적으로 기록한 글입니다.