변수: let과 const

값에 이름 붙이기

프로그램에서 같은 값을 여러 번 사용하거나 나중에 바꾸려면 이름을 붙여 두면 편리합니다. 이렇게 이름을 선언하고 값을 연결한 것을 변수라고 부릅니다. let points = 10;은 points라는 이름을 선언하고 숫자 10을 처음 넣습니다. 등호는 여기서 수학의 같다는 뜻이 아니라 오른쪽의 값을 왼쪽 이름에 저장하라는 뜻입니다.

let으로 선언한 변수에는 나중에 다른 값을 다시 할당할 수 있습니다. 재할당할 때는 let을 다시 붙이지 않고 points = 15;처럼 씁니다. const도 값에 이름을 붙이지만, 선언 후 그 이름에 다른 값을 재할당할 수 없습니다. 선언 시점부터 바꿀 계획이 없는 값에는 const를 사용하면 의도가 잘 드러납니다.

실행 예제와 결과

// let은 나중에 값을 바꿀 수 있습니다.
let name = "민지";
let points = 10;
console.log("이름", name);
console.log("처음 점수", points);

// 기존 변수에 새 값을 넣습니다.
points = 15;
console.log("바뀐 점수", points);

// 오른쪽 값을 계산한 뒤 다시 저장합니다.
points = points + 5;
console.log("더한 점수", points);

// const는 다른 값을 다시 할당할 수 없습니다.
const team = "초록팀";
const bonus = 2;
console.log("팀", team);
console.log("보너스 포함", points + bonus);

name = "지우";
console.log("새 이름", name);

처음 points는 10이고 이후 15가 됩니다. points = points + 5;는 오른쪽의 현재 값 15에 5를 더한 다음 결과 20을 같은 이름에 저장합니다. points + bonus는 22를 계산해 출력하지만 points 자체를 바꾸지는 않습니다. 마지막에는 name을 지우로 바꾸므로 새 이름이 출력됩니다.

선언과 재할당에서 주의할 점

같은 범위에서 이미 선언한 이름을 let이나 const로 다시 선언하면 오류가 납니다. 값을 바꾸려는 경우에는 선언 키워드를 생략하세요. 또한 const bonus = 2; 다음에 bonus = 3;을 실행하면 오류가 발생합니다. 바뀌어야 하는 값이라면 처음부터 let으로 선언해야 합니다.

변수는 선언하기 전에 사용할 수 없으므로 먼저 선언하고 이후에 읽습니다. 이름은 뜻을 알 수 있게 짓고 대소문자를 구분하세요. 예를 들어 points와 Points는 서로 다른 이름입니다. 문자열을 넣을 때는 name = "지우";처럼 따옴표가 필요하지만, 이미 선언된 변수의 값을 읽을 때는 name처럼 따옴표를 쓰지 않습니다.

값의 변화와 계산 결과를 분리하기

변수를 이해할 때는 이름마다 현재 어떤 값이 연결되어 있는지 적어보면 좋습니다. 예제에서 points의 값이 바뀌는 곳은 처음 선언과 두 번의 재할당입니다. console.log 안에서 덧셈을 하거나 points를 읽는 동작은 그 자체로 재할당이 아닙니다.

실행한 문장	실행 직후 points	출력
let points = 10;	10	없음
points = 15;	15	없음
points = points + 5;	20	없음
console.log(points + 2);	20	22

오른쪽 식을 먼저 읽으면 마지막 두 문장의 차이가 드러납니다. 재할당에서는 현재 값으로 식을 계산한 다음 등호 왼쪽의 이름에 새 결과를 연결합니다. 출력만 하는 경우에는 계산한 값을 터미널에 보여주고 끝납니다. 계산은 했는데 원래 값이 바뀌지 않았다고 느껴진다면 저장하는 문장이 있었는지 확인하세요.

const는 이름에 다른 값을 재할당하지 못하게 합니다. 이것이 앞으로 배울 배열이나 객체의 내부까지 모두 바꿀 수 없다는 뜻은 아닙니다. 이번 강의의 숫자와 문자열에서는 재할당 여부에 집중하고, 복합 자료는 해당 강의에서 다시 구분합니다. 목적에 맞는 이름을 고르는 일도 중요합니다. points와 bonus처럼 서로 다른 역할을 별도로 두면 어떤 값을 바꿔야 할지 쉽게 판단할 수 있습니다.

연습문제와 해설

let count = 3;을 선언하고 4를 더해 다시 저장한 후 출력해 보세요. 이어서 const label = "개수";를 선언하고 이름과 숫자를 함께 출력해 보세요. 가능한 답은 count = count + 4;와 console.log(label, count);입니다. 예상 결과는 개수 7입니다.

한 걸음 더 생각해 보세요. console.log(count + 2);를 실행한 다음 console.log(count);를 실행하면 무엇이 나올까요? 첫 줄은 9이고 두 번째 줄은 여전히 7입니다. 계산 결과를 출력했을 뿐 count = ... 형태로 저장하지 않았기 때문입니다.