Web Front/JavaScript

[JavaScript] #06 JavaScript 기본 문법, 데이터 타입 완벽 정리!

TOASTDEV 2025. 10. 3. 13:00
반응형

 

 

토스트데브입니다!
오늘은 JavaScript의 핵심 개념 중 하나인 데이터 타입(Data Types)에 대해 알아보겠습니다.
프로그래밍에서 데이터 타입을 정확히 이해하는 건 변수의 처리, 연산, 로직 제어에 있어서 매우 중요해요.

 

 

📦 데이터 타입이란?

데이터 타입(Data Type)은 변수에 저장되는 값의 종류를 나타냅니다.
JavaScript는 동적 타입 언어이기 때문에 변수 선언 시 타입을 지정하지 않아도 되고, 값에 따라 자동으로 타입이 결정됩니다.

let a = 10;        // 숫자
let b = "문자열";  // 문자열
let c = true;      // 불리언

 

 

🔍 JavaScript의 기본 데이터 타입 (Primitive Types)

JavaScript에는 7가지의 기본형(원시형) 데이터 타입이 존재합니다.

1. Number

  • 정수, 실수 등 모든 숫자
  • NaN(Not a Number), Infinity도 포함
let num = 42;
let price = 99.9;

 

2. String

  • 문자 또는 문자열
  • 작은따옴표('), 큰따옴표("), 백틱(`) 모두 사용 가능
let name = "토스트";
let greeting = `안녕하세요, ${name}님`;

 

3. Boolean

  • true 또는 false 값을 가짐
let isLogin = true;

 

4. Undefined

  • 값을 할당하지 않은 변수의 타입
let x;
console.log(x); // undefined

 

5. Null

  • "값이 없음"을 명시적으로 표현하는 타입
let y = null;

❗ typeof null 은 "object"를 반환하는 오래된 버그가 있으니 주의!

 

6. Symbol (ES6)

  • 유일한 식별자를 만들 때 사용
const sym1 = Symbol("id");
const sym2 = Symbol("id");
console.log(sym1 === sym2); // false

 

7. BigInt (ES2020)

  • 정수 범위를 초과하는 아주 큰 숫자 표현
const big = 1234567890123456789012345678901234567890n;

 

 

🧱 참조 타입 (Reference Types)

기본형 외에도 객체(Object) 기반의 참조형 타입도 존재합니다.

🔹 Object

  • 키-값 쌍으로 이루어진 데이터 구조
const user = {
  name: "토스트",
  age: 30
};

 

🔹 Array

  • 순서가 있는 리스트 형태
const fruits = ["사과", "바나나", "포도"];

 

🔹 Function

  • JavaScript에서는 함수도 일급 객체이며 타입입니다.
function sayHello() {
  console.log("Hello!");
}

 

 

🧪 typeof 연산자로 타입 확인

console.log(typeof 10);           // "number"
console.log(typeof "문자열");     // "string"
console.log(typeof true);         // "boolean"
console.log(typeof undefined);    // "undefined"
console.log(typeof null);         // "object" ❗ (주의!)
console.log(typeof {});           // "object"
console.log(typeof []);           // "object"
console.log(typeof function(){}); // "function"

 

 

✅ 마무리하며

JavaScript는 유연한 만큼 타입 관련 버그가 발생하기 쉬운 언어입니다.
기본 타입과 참조 타입의 차이, 그리고 typeof의 특이점 등을 정확히 알고 있어야 더 안정적인 코드를 작성할 수 있어요!

다음 글에서는 연산자에 대해 알아보겠습니다 😊

 

#JavaScript, #자바스크립트기초, #데이터타입, #number, #string, #boolean, #object, #typeof, #프로그래밍입문, #웹개발, #ToastDev

반응형