var, let, const 차이 쉽게 정리

var, let, const 차이에서 먼저 볼 부분

현대 JavaScript에서는 기본적으로 const를 쓰고, 값이 바뀌어야 할 때만 let을 쓰는 방식이 가장 안전합니다.

const는 재할당을 막아 실수를 줄여줍니다. 값이 고정되어야 하는 이름에는 const를 쓰는 것이 읽는 사람에게도 의도를 분명히 전달합니다.

let은 반복문 카운터나 계산 결과처럼 실행 중에 값이 바뀌는 경우에 사용합니다. 필요한 범위 안에서만 선언하는 습관이 좋습니다.

var는 함수 스코프와 호이스팅 때문에 초보자가 예측하기 어려운 상황을 만들 수 있습니다. 새 코드를 작성할 때는 피하는 편이 좋습니다.

가격 계산 변수

const price = 12000;
const count = 2;
let total = price * count;

if (total >= 20000) {
  total = total - 2000;
}

console.log(total);

이 예제는 그대로 복사해서 확인하는 것보다 한 줄씩 바꿔보는 쪽이 더 도움이 됩니다. 태그 이름, 선택자, 변수 이름, 함수 실행 위치를 조금씩 바꾸면 어떤 부분이 결과에 영향을 주는지 직접 확인할 수 있습니다.

var, let, const 차이 쉽게 정리 비교 기준

잘못 작성했을 때 나타나는 흐름

JavaScript 글은 값이 언제 만들어지고 함수가 언제 실행되는지를 순서대로 따라가면 이해가 쉬워집니다.

console.log는 단순 확인용이 아니라 현재 값의 모양과 실행 흐름을 확인하는 가장 기본적인 디버깅 도구입니다.

DOM을 다루는 코드는 HTML 요소가 먼저 준비되었는지 확인해야 하며, 선택 결과가 null인지 보는 습관이 중요합니다.

브라우저에서 직접 확인하는 순서

먼저 화면에 나타나는 결과를 보고, 그다음 코드에서 방금 수정한 부분을 확인하세요. 결과가 예상과 다르다면 콘솔 오류, 파일 경로, 선택자 이름, 태그 닫힘, 실행 순서 중 하나가 흔한 원인입니다.

초보 단계에서는 정답 코드를 한 번에 외우기보다 실패한 코드와 수정한 코드를 나란히 비교하는 방식이 좋습니다. 이 글의 예제를 기준으로 작은 값을 바꿔보면 다음 글을 읽을 때도 기준이 더 선명해집니다.

실습 후 점검할 항목

• 먼저 const로 선언할 수 있는지 확인하기
• 값이 바뀌는 경우에만 let 사용하기
• 새 코드에서는 var 사용을 피하기
• 변수 이름은 역할이 드러나게 작성하기