자바스크립트 var, let, const 차이점 (1)

변수 문법을 왜 쓰는가?

- 변수는 내가 다시 사용할 데이터를 컴퓨터에게 잠시 기억시키기 위해 쓰는 문법이다.

 

 

 

자바스크립트 변수 쓰는 방법

var name = '강동욱';

변수는 자료를 임시로 저장하는 공간이다.

1. var 키워드 오른쪽에 자유롭게 작명을하고, 변수에 저장할 자료를 등호로 넣어주면 된다.

2. 객체, 배열, 함수 등 모든 자료들을 담을 수 있다.

3. 그리고 var name 이라는 부분은 선언, name = '강동욱' 이라는 부분은 값 할당이라고 표현한다. 보통 변수를 만들 땐 두개를 동시에 사용한다. 동시에 사용하는것을 초기화라고도 한다.

4. 그리고 변수를 만들 땐 var, let, const라는 3개 키워드를 이용 가능하다. 각 키워드마다 특징이 있다. 변수의 선언, 할당, 범위에서 차이가 있다.

 

 

 

변수의 선언

var name;
let age;
const gender; // const는 초기화도 해줘야함

이렇게 var, let, const 키워드를 이용해 변수를 만들겠다고 선언할 수 있다.

(등호는 안써도 변수는 만들어진다. 기본값인 undefined가 할당된다.)

그런데 var 키워드는 재선언이 가능하고

let, const 키워드는 재선언이 불가능하다.

 

let age;
let age; // 재선언x

const gender = '여자';
const gender = '남자'; // 재선언x

let, const로 만들면 이렇게 같은 이름의 변수를 두번 이상 재선언할 수 없다.

나중에 변수 이름을 실수로 중복해서 만드는 실수를 방지해주는 좋은 기능이다.

 

 

 

 

변수의 값 할당

var name;
name = '강동욱'; // 할당

2번째 줄에서 변수에 자료를 집어넣는걸 할당이라고 한다.

 

 

할당도 선언과 동시에 할 수 있다. => 초기화라고 한다.

var name = '강동욱';

선언과 할당을 동시에 하는 모습이다. 

 

 

 

근데 변수를 var, let으로 만들면 재할당이 가능하고 const로 만들면 값 재할당이 불가능하다. 

const로 변수 만들면 나중에 등호를 이용해 값 변경하는게 안된다는 소리이다. 

let name = '강동욱';
name = '손흥민';  // let 재할당o

const age = 30;
age = 40; // const 재할당x

const는 애초에 constant의 약자로 바뀌지 않는 일정한 값 즉, 상수를 뜻한다.

바뀌면 큰일날 값을 저장하고 싶을 때 사용하면 좋다. 

 

 

 

주의 - 객체 내부 값은 변경해도 에러가 안난다. 재할당만 아니면 된다. 상수지만 상수가 아니다. 상수변수라는 느낌을 가지자.

const obj = { name : '강동욱' }
obj.name = '손흥민'; //가능

위의 예제는 엄밀히 말하면 변수를 재할당한게 아니기 때문에 가능하다.

 

 

(참고)

완전 변경불가능한 오브젝트를 만들고 싶다면

Object.freeze()라는 자바스크립트 기본함수가 있다.

const obj = { name: '강동욱' };
Object.freeze(사람);
obj.name = '이천수';

console.log(obj.name); // '강동욱'

Object.freeze() 소괄호에 오브젝트를 담으시면 불변의 Object가 완성된다.

(하지만 객체 내의 객체까지 freeze해주진 않는다.)

 

 

 

 

🌈 정리

- 변수는 내가 다시 사용할 데이터를 컴퓨터에게 잠시 기억시키기 위해 쓰는 문법이다.

- const는 객체 내부의 변경은 가능하다.

- 변경 불가능한 객체를 만들고싶다면 Object.freeze() 사용하자.

- var를 사용하면 이상한 에러들을 많이 직면하게 된다. var 사용을 지양하자.