JavaScript_01) 변수

학습 목표

• JavaScript의 변수 선언 방법 이해하기
• var, let, const의 차이점 파악하기
• JavaScript의 데이터 타입 분류 및 특징 학습하기
• 네이밍 규칙과 베스트 프랙티스 습득하기

---

<JavaScript 변수 선언>

- var의 문제점과 사용 금지 이유

JavaScript에서 var는 초기 변수 선언 방식이지만, 현재는 사용하지 않는다. 가장 큰 문제점은 중복 선언이 가능하다는 점이다.

var name = "정진우";
var age = 55;
age = "오십"; // 타입 변경 가능
var name = "김수민"; // 중복 선언 허용
console.log(name); // "김수민"

실행 결과:

김수민

- let과 const의 도입

let과 const는 ES6에서 도입된 새로운 변수 선언 방식이다.

let name2 = "jae";
name2 = "meon"; // 값 재할당 가능

// let name2 = "jaemeon"; // 오류 발생 - 중복 선언 불가

const PI = 3.14; // 상수 선언
// PI = 3.141; // 오류 발생 - 재할당 불가

---

<JavaScript 네이밍 규칙>

- 변수명 작성 규칙

1. 문자와 숫자 모두 사용 가능
2. 특수문자는 언더스코어(_)와 달러($)만 허용
3. 숫자로 시작 불가
4. 키워드 사용 불가

- 케이스 컨벤션

• 변수명, 함수명: camelCase
• 클래스, ID 속성: kebab-case

let userName = "정진우"; // camelCase
let user_age = 25; // snake_case (권장하지 않음)

---

<JavaScript 데이터 타입>

JavaScript는 동적 타입 언어로, 6개의 원시 타입과 1개의 객체 타입을 제공한다.

- 원시 타입 (Primitive Types)

1) Number 타입

모든 숫자를 하나의 타입으로 처리한다.

const age2 = 55;
const temp = -10.5;
const pi = 3.14;
console.log(typeof age2); // "number"
console.log(Infinity); // Infinity
console.log(typeof Infinity); // "number"

실행 결과:

55 -10.5 3.14
number
number
number
Infinity
number

2) String 타입

문자열 데이터를 표현한다.

const name3 = "최지원 66살";
const age3 = 55;
console.log(typeof name3); // "string"
console.log(age3 == "55"); // true (타입 변환 후 비교)
console.log(age3 === "55"); // false (타입까지 엄격 비교)

3) Boolean 타입

참/거짓 값을 나타낸다.

const isTrue2 = true;
const isFalse = false;
console.log(typeof isTrue2); // "boolean"

4) undefined 타입

개발자가 초기화하지 않은 변수의 기본값이다.

let num2;
console.log(num2); // undefined
console.log(typeof num2); // "undefined"

5) null 타입

개발자가 명시적으로 빈 값을 할당할 때 사용한다.

let init = 10;
init = null;
console.log(init); // null

6) Symbol 타입

유일무이한 값을 생성하는 타입이다.

const tmp1 = '1';
const tmp2 = '1';
console.log(tmp1 === tmp2); // true

const symbol1 = Symbol('1');
const symbol2 = Symbol('1');
console.log(symbol1 === symbol2); // false - 각각 고유한 값

실행 결과:

tmp1 === tmp2 : true
Symbol(1) Symbol(1)
symbol1 === symbol2 : false

- 객체 타입 (Object Types)

1) Object 타입

key: value 형태의 구조를 가진다.

const jiwon = {
    name: "최지원",
    age: 47,
    address: "경기도 안양시",
    job: "강사"
}

console.log(jiwon.name); // "최지원"
console.log(jiwon.address); // "경기도 안양시"
jiwon.age = 15; // 값 변경 가능
console.log(typeof jiwon); // "object"

2) Array 타입

값을 리스트로 나열할 수 있는 타입이다.

const arr = ["초록색", "노란색"];
arr.push("빨간색"); // 배열 끝에 요소 추가
arr.push("파란색");
arr.push(50); // 다른 타입도 추가 가능
console.log(arr); // ["초록색", "노란색", "빨간색", "파란색", 50]

console.log(arr.pop()); // 50 (마지막 요소 제거 후 반환)
console.log(arr[0]); // "초록색" (인덱스 접근)
console.log(arr[10]); // undefined (존재하지 않는 인덱스)

---

정리 및 요약

JavaScript의 변수 선언에서는 const를 우선 사용하고, 재할당이 필요한 경우만 let을 사용한다.

var는 호이스팅과 중복 선언 문제로 인해 잘 사용하지 않는다.

데이터 타입은 크게 원시 타입 6개와 객체 타입 1개로 구분되며, JavaScript의 동적 타입 특성으로 인해 실행 시점에 타입이 결정된다.

타입 비교시에는 ===를 사용하여 엄격한 비교를 수행하는 것이 안전하다.