← 홈페이지 5강 목록으로
🏷️
EPISODE 02
변수 · 함수 · void/never · 타입 추론 · as

타입 선언

변수와 함수의 타입 선언, 선택적/기본값 매개변수, void와 never의 차이, 타입 추론, 그리고 타입 단언(as)까지 익힙니다.

TypeScriptvoidneveras
소요 시간
30~45분
난이도
📊 중급
선수 조건
🎯 ts-01
결과물
타입 안전한 함수 시그니처 작성

이 강의에서 배우는 것

  • 1함수의 매개변수·반환 타입을 명시한다
  • 2?와 = 로 선택적/기본값 매개변수를 정의한다
  • 3void와 never의 차이를 안다
  • 4타입 추론을 활용해 불필요한 명시를 줄인다
  • 5as 단언이 필요한 상황과 위험을 안다

1. 변수 타입 선언

typescript
let name: string = '홍길동';
let age: number = 30;

// 타입 추론 — 초기값으로 자동 결정
let city = '서울';   // string
let score = 100;    // number

2. 함수 매개변수와 반환 타입

typescript
function add(a: number, b: number): number {
  return a + b;
}

const multiply = (a: number, b: number): number => a * b;

3. 선택적 매개변수 (?)

typescript
function greet(name: string, title?: string): string {
  if (title) return `안녕하세요, ${title} ${name}님!`;
  return `안녕하세요, ${name}님!`;
}

greet('홍길동');           // OK
greet('홍길동', '선생님');  // OK

4. 기본값 매개변수

typescript
function createUser(name: string, role: string = 'user'): object {
  return { name, role };
}

createUser('홍길동');           // { name: '홍길동', role: 'user' }
createUser('관리자', 'admin');

5. void와 never

typescript
// void: 반환값 없음
function logMessage(msg: string): void {
  console.log(msg);
}

// never: 절대 반환 안 함 (오류 던지기, 무한 루프)
function throwError(message: string): never {
  throw new Error(message);
}

function infiniteLoop(): never {
  while (true) {}
}

6. 타입 추론

typescript
let x = 10;          // number
let y = 'hello';     // string
let arr = [1, 2, 3]; // number[]

function double(n: number) {
  return n * 2;  // 반환: number 추론
}

7. 타입 단언 (as)

typescript
// HTML 요소 접근
const input = document.getElementById('username') as HTMLInputElement;
input.value = '홍길동';

// 다른 표현 (JSX 불가)
const input2 = <HTMLInputElement>document.getElementById('username');

// unknown 단언
let data: unknown = '문자열';
const str = data as string;
⚠️

타입 단언은 실제 타입을 바꾸지 않습니다 — 오남용 주의!

예제 코드 / 강의 자료

전체 강의 자료와 예제 코드는 GitHub에서 자유롭게 받아볼 수 있습니다.

GitHub에서 보기 ↗