728x90

✅ 1. 시작하기
타입 호환성(Type Compatibility)은 타입스크립트가 한 타입을 다른 타입에 할당할 수 있는지 판단하는 규칙입니다. 구조적 타입 시스템(structural type system)을 사용합니다.
interface Person {
name: string;
}
let p: Person = { name: 'John' };
let obj = { name: 'Doe', age: 30 };
p = obj;
console.log('p:', p);
✅ 2. 두 함수 비교
함수의 매개변수와 반환 타입이 호환되는지를 비교합니다.
let f1 = (a: number) => 0;
let f2 = (b: number, s: string) => 0;
// f1 = f2; // error: f2 has mor parameters then f1
f2 = f1; // ok
console.log('f2(1, "test"):', f2(1, 'test')); // f2 can be called withe fewer parameters
✅ 3. 함수 매개변수 Bivariance
함수 매개변수는 기본적으로 contravariant(반공면)이나, 타입스크립트는 bivariance(양방향)로 동작할 수 있습니다.
type Handler = (a: number | string) => void;
let handle: Handler = (a: number | string) => {
console.log('handle:', a);
}; // Ok
handle(123); // handle: 123
✅ 4. 선택적 매개변수와 나머지 매개변수
선택적 매개변수와 나머지 매개변수도 호환성에 영향을 줍니다.
function fn1(a: number, b?: number) {
console.log('fn1', a, b);
}
function fn2(a: number, b: number, c?: number) {
console.log('fn2', a, b, c);
}
fn1(1); // Ok
fn2(1, 2); // Ok
✅ 5. 오버로드 함수
오버로드된 함수의 호환성은 모든 오버로드 시그니처가 호환되어야 합니다.
function pickCard(x: { suit: string; card: number }[]): number;
function pickCard(x: number): { suit: string; card: number };
function pickCard(x: any): any {
if (typeof x === 'number') {
console.log('Number of cards:', x);
return { suit: 'Hearts', card: x };
}
console.log('pickCard array:', x);
return 0;
}
console.log(pickCard(5)); // { suit: 'Hearts', card: 5 }
console.log(
pickCard([
{ suit: 'Hearts', card: 1 },
{ suit: 'Diamonds', card: 2 },
])
);
✅ 6. 열거형(Enums)
서로 다른 열거형은 호환되지 않습니다.
enum Status {
Ready,
Waiting,
}
enum Color {
Red,
Green,
}
let s: Status = Status.Waiting; // enum 타입은 enum 값으로 초기화
let c: Color = Color.Red; // enum 타입은 enum 값으로 초기화
console.log('Status:', s, 'Color:', c);
✅ 7. 클래스(Classes)
클래스는 인스턴스 멤버만 비교하며, private/protected 맴버가 호환되지 않습니다.
class Animal {
feet: number = 4;
}
class Size {
feet: number = 2;
}
let a: Animal = new Size();
console.log('Animal:', a);
// 출력: Animal { feet: 2 }
✅ 8. 제네릭(Generics)
제네릭 타입은 타입 파라미터가 사용되지 않으면 호환됩니다.
interface Empty<T> {}
let x: Empty<number> = {};
let y: Empty<string> = {};
x = y;
console.log('Generic x:', x, 'Generic y:', y); // 출력: Generic x: {} Generic y: {};
GitHub - Koras02/typescript-bloging
Contribute to Koras02/typescript-bloging development by creating an account on GitHub.
github.com
728x90
LIST
'Front-End > TypeScript' 카테고리의 다른 글
| [TypeScript] 24장 - DOM 조작 (0) | 2025.08.19 |
|---|---|
| [Typescript] 23장 타입 추론 (1) | 2025.08.11 |
| [Typescript] 21장 심볼 (1) | 2025.08.09 |
| [Typescript] 20장 타입스크립트 모듈과 네임스페이스 (2) | 2025.08.04 |
| [Typescript] 19장 네임스페이스 (0) | 2025.04.07 |