[TIL 18] 자바스크립트 기초 - 변수 선언

1. 변수 선언

• 자바스크립트는 느슨한 타입(loose typing)을 가진 언어이기 때문에 데이터 타입을 따로 명시하지 않고 변수를 선언할 수 있다.
• 하지만 타입이 존재하지 않는 것은 아니다. 변수를 선언할 때 타입을 명시하지 않는 것일 뿐, 내부적으로는 데이터의 종류에 따른 변수 타입을 가진다.

var a; // undefined

let b;
b = 1; // 1

var a, b, c;
let num1 = 1, num2 = 2, num3 = 3;

• 변수를 선언하고 초기화하지 않으면 undefined 값이 자동으로 할당된다.
• 하나의 선언문에서 여러 개의 변수를 선언하거나, 선언과 초기화를 동시에 하기도 한다.

1-1. var

• var로 선언된 변수는 기존에 선언된 변수의 값을 덮어쓰며, 함수 스코프 기준으로 동작한다.
• var은 스코프 내에 이미 동일한 식별자를 가진 변수가 존재한다면 해당 변수에 값을 재할당한다.
  • 이 경우, 기존에 선언된 변수의 값을 덮어쓰면 다른 코드에 영향을 주거나 버그가 발생할 때 원인을 찾기가 어렵다.

function foo() {
	var a = 1;
	console.log(a); // 1
}
console.log(a); // Uncaught ReferenceError: a is not defined

• 변수 a는 foo() 함수에 대한 스코프를 가진다. 즉, foo() 함수 내에서만 변수 a에 접근할 수 있다.

function foo() {
	for (var i = 0; i < 10; i += 1) {
		// ...
	}
	console.log(i); // 10
}
foo();

• 변수 i는 블록이 아닌 함수 스코프를 가지기 때문에 반복문이 종료되어도 접근이 가능하다.
• 만약 전역 스코프 또는 foo() 함수 내에 이미 i라는 변수가 선언되었다면 값이 덮어 씌워져 예상치 못한 문제가 발생했을 수도 있다.

1-2. let과 const

• let과 const는 var과 달리 재선언을 허용하지 않으며, 함수 스코프가 아닌 블록 스코프를 가진다.
  • 블록 스코프: 변수를 둘러싼 블록({}) 안에서만 해당 변수에 접근할 수 있다.
• 재선언 시도시 SyntaxError가 발생한다. 그래서 안정적으로 변수를 사용할 수 있다.

function foo() {
	for (let i = 0; i < 10; i += 1) {
		// ...
	}
	console.log(i); // Uncaught ReferenceError: i is not defined
}
foo();

• let은 재선언을 허용하지 않으며, for 반복문의 블록 스코프에 묶여 외부의 변수 값을 덮어쓰거나 불필요한 참조가 되는 문제를 막는다.
• let과 const의 차이
  • const는 let과 달리 값의 변경을 허용하지 않는다. 따라서 상수처럼 변하지 않는 값을 선언할 때 사용한다.