LeanX

데이터 타입과 논리 기초

코드에서 다루는 모든 값은 문자열·숫자·불리언·null 같은 기본 타입과 배열·객체 같은 컬렉션 타입 중 하나이며, if 조건문과 반복문은 데이터를 분기하고 처리하는 논리의 뼈대로, 이 개념을 알면 AI가 만든 코드의 흐름을 읽을 수 있습니다.

콘텐츠: LeanX · 최초 공개 2026.07.08 · 콘텐츠 기준일 2026.08.14

AI가 만든 코드를 보면 string, number, boolean, [], {} 같은 표시가 곳곳에 등장합니다. 이것들이 데이터 타입(data type)입니다. 코드가 다루는 정보의 종류를 구분하는 방식으로, 이 개념을 알면 에러 메시지도 읽히고 코드 흐름도 보입니다.

기본 데이터 타입 4가지

  • 문자열(String): 따옴표로 감싼 텍스트. '안녕하세요', '김바이브@email.com', '42' — 숫자처럼 보여도 따옴표 안에 있으면 문자열입니다.
  • 숫자(Number): 따옴표 없는 숫자. 42, 3.14, -10. 더하기·빼기 같은 수학 연산이 가능합니다.
  • 불리언(Boolean): 참(true) 또는 거짓(false), 딱 두 가지 값만 가집니다. 로그인 여부, 프리미엄 여부, 체크박스 상태 등에 씁니다.
  • null / undefined: '값이 없음'을 나타냅니다. null은 의도적으로 비워둔 것, undefined는 아직 값이 할당되지 않은 것입니다.

컬렉션 타입 — 여러 값을 담는 그릇

기본 타입 하나하나는 데이터 한 조각입니다. 여러 조각을 묶어서 담는 그릇이 배열(Array)과 객체(Object)입니다.

TypeScript 데이터 타입 예시

// 기본 타입
const name: string = '김바이브';
const age: number = 28;
const isPremium: boolean = true;
const address: null = null;

// 배열(Array): 같은 종류 값의 목록 — 대괄호로 감쌈
const skills: string[] = ['React', 'TypeScript', 'Supabase'];
const scores: number[] = [95, 87, 92, 100];

// 객체(Object): 이름(key)과 값(value)의 쌍 — 중괄호로 감쌈
const user = {
  id: 1,
  name: '김바이브',
  email: '[email protected]',
  isPremium: true,
  skills: ['React', 'TypeScript'],
};

// 객체 배열 — 가장 흔한 API 응답 형태
const users = [
  { id: 1, name: '김바이브', isPremium: true },
  { id: 2, name: '이코딩', isPremium: false },
];

조건문 if — 분기점 만들기

if는 '만약 ~라면 이것을 하고, 아니라면 저것을 해'라는 분기 명령입니다. 코드의 흐름을 나눠주는 가장 기본적인 논리 구조입니다.

조건문과 반복문 예시

// if 조건문
const isPremium = true;

if (isPremium) {
  console.log('프리미엄 콘텐츠에 접근할 수 있습니다.');
} else {
  console.log('업그레이드가 필요합니다.');
}

// 배열 반복 — forEach
const skills = ['React', 'TypeScript', 'Git'];
skills.forEach((skill) => {
  console.log('배우는 기술: ' + skill);
});

// 배열 변환 — map (각 요소에 같은 작업을 적용)
const upperSkills = skills.map((skill) => skill.toUpperCase());
// ['REACT', 'TYPESCRIPT', 'GIT']

// 배열 필터 — filter (조건에 맞는 것만 남기기)
const premiumUsers = users.filter((user) => user.isPremium === true);

TypeScript의 타입 선언이란?

TypeScript는 JavaScript에 타입 표시를 추가한 언어입니다. 변수나 함수 옆에 ':string', ':number' 같이 쓰면 '이 값은 반드시 이 타입이어야 한다'고 선언하는 것입니다. AI가 이 규칙을 어기면 빨간 밑줄 에러가 나고, 컴파일이 안 됩니다.

AI가 타입 에러를 냈을 때 에러 메시지를 보면 'Type string is not assignable to type number' 같은 식으로 나옵니다. 번역하면 '문자열은 숫자 타입 자리에 쓸 수 없다'는 뜻입니다. 이 에러 메시지를 그대로 AI에게 주면 바로 고쳐줍니다.

바이브코딩할 때: AI에게 '이 데이터의 타입은 어떻게 되나요? TypeScript 타입을 정의해줘'라고 요청하면 코드의 구조를 이해하는 데 큰 도움이 됩니다. 타입이 명확할수록 AI가 다음 코드를 더 정확하게 만들어 줍니다.