자바스크립트 데이터 타입과 변수: 기초부터 실전 활용까지 완벽 가이드 🚀

자바스크립트(JavaScript)는 웹 개발에서 가장 널리 사용되는 프로그래밍 언어 중 하나입니다. 특히 데이터 타입(Data Types) 과 변수(Variables) 의 개념을 정확히 이해하는 것은 효율적인 코드 작성과 유지보수에 필수적입니다.

---

📌 데이터 타입이 중요한 이유

프로그래밍에서 데이터 타입은 프로그램이 데이터를 저장하고 처리하는 방식에 직접적인 영향을 줍니다.
특히, 자바스크립트는 동적 타입 언어(Dynamically Typed Language)이므로 변수가 선언될 때 데이터 타입을 명시적으로 지정하지 않아도 됩니다. 하지만 이러한 특성은 예기치 않은 버그를 유발할 수도 있기 때문에 데이터 타입을 올바르게 이해하는 것이 중요합니다.

예제:

let num1 = "10";  // 문자열(string)
let num2 = 5;  // 숫자(number)

console.log(num1 + num2);  // "105" (문자열 결합)
console.log(Number(num1) + num2);  // 15 (올바른 숫자 변환)

이처럼 데이터 타입을 잘못 다루면 원하지 않는 결과가 발생할 수 있습니다. 그렇다면, 자바스크립트에서 사용되는 기본 데이터 타입을 하나씩 살펴보겠습니다.

---

📌 자바스크립트의 기본 데이터 타입 (Primitive Data Types)

자바스크립트에는 7가지 기본 데이터 타입이 존재하며, 각 타입은 고유한 특성과 용도를 가집니다.

1️⃣ 숫자 (Number)

자바스크립트의 Number 타입은 정수(Integer)와 실수(Floating Point Number)를 포함합니다.

예제:

let age = 30;
let height = 175.5;
let negative = -10;
console.log(typeof age);  // "number"

📍 특수한 숫자 값

• Infinity (양의 무한대)
• -Infinity (음의 무한대)
• NaN (Not a Number, 숫자가 아님)

예제:

console.log(1 / 0);  // Infinity
console.log(-1 / 0);  // -Infinity
console.log("JavaScript" * 5);  // NaN

---

2️⃣ 문자열 (String)

문자열은 텍스트 데이터를 저장하는 타입입니다.
자바스크립트에서는 작은따옴표(' '), 큰따옴표(" "), 백틱(``)을 사용하여 문자열을 정의할 수 있습니다.

예제:

let name = "홍길동";
let greeting = '안녕하세요!';
let message = `오늘의 날씨는 맑음`;

📍 템플릿 리터럴 (Template Literals)

백틱(``)을 사용하면 변수를 문자열 안에 쉽게 삽입할 수 있습니다.

let userName = "철수";
console.log(`환영합니다, ${userName}님!`);  // "환영합니다, 철수님!"

📍 문자열 관련 메서드

let text = "Hello, JavaScript!";
console.log(text.length);  // 문자열 길이 반환
console.log(text.toUpperCase());  // 대문자로 변환
console.log(text.toLowerCase());  // 소문자로 변환
console.log(text.includes("Java"));  // true (문자 포함 여부 확인)
console.log(text.replace("JavaScript", "World"));  // "Hello, World!"

---

3️⃣ 불리언 (Boolean)

불리언 값은 참(true) 또는 거짓(false)만을 가집니다.
주로 조건문 및 논리 연산에서 사용됩니다.

let isStudent = true;
let hasGraduated = false;

📍 불리언 연산 예제

let isLoggedIn = true;
let hasPermission = false;

console.log(isLoggedIn && hasPermission);  // false (AND 연산)
console.log(isLoggedIn || hasPermission);  // true (OR 연산)
console.log(!isLoggedIn);  // false (NOT 연산)

---

4️⃣ undefined

undefined는 변수가 선언되었지만 값이 할당되지 않은 상태를 의미합니다.

let x;
console.log(x);  // undefined

---

5️⃣ null

null은 값이 "없음"을 명시적으로 지정할 때 사용됩니다.

let user = null;

---

6️⃣ 심볼 (Symbol)

Symbol은 고유한 값을 생성하는 데이터 타입입니다.

const uniqueId = Symbol('id');
console.log(uniqueId);

📍 객체 속성 키로 활용

const sym1 = Symbol('key');
const obj = { [sym1]: "value" };

console.log(obj[sym1]);  // "value"

---

7️⃣ 빅인트 (BigInt)

BigInt는 매우 큰 정수를 저장하기 위한 데이터 타입입니다.

const bigNumber = 123456789012345678901234567890n;
console.log(bigNumber);

---

📌 변수 선언과 초기화

자바스크립트에서는 let, const, var 키워드를 사용할 수 있으며, 현재는 let과 const 사용이 권장됩니다.

1️⃣ let

let은 재할당 가능한 변수를 선언할 때 사용됩니다.

let count = 10;
count = 20;
console.log(count);  // 20

2️⃣ const

const는 변경할 수 없는 변수(상수)를 선언할 때 사용됩니다.

const birthYear = 1990;
// birthYear = 2000;  // 오류 발생

3️⃣ var (비추천)

var는 예측하기 어려운 동작을 초래할 수 있으므로 사용을 지양하는 것이 좋습니다.

var message = "Hello";
console.log(message);

---

📌 결론 및 요약

자바스크립트의 데이터 타입과 변수를 올바르게 이해하면 더 직관적이고 오류 없는 코드 작성이 가능합니다.

✅ 핵심 요약

✔️ 기본 데이터 타입: Number, String, Boolean, undefined, null, Symbol, BigInt
✔️ let과 const를 사용한 변수 선언이 권장됨
✔️ var는 함수 범위 문제로 인해 사용 지양
✔️ 데이터 타입을 잘 활용하면 버그를 방지하고 성능을 최적화할 수 있음