자바스크립트를 허용해주세요.
[ 자바스크립트 활성화 방법 ]
from Mohon Aktifkan Javascript!
 

[Typescript] 22장 타입 호환성

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