타입스크립트 베이직 - 7: 인터섹션

인터섹션 타입 Intersection

Intersection은 여러 인터페이스의 프로퍼티를 합친 타입을 의미한다.
& 연산자를 이용한다.

interface Id {
	id: string;
}

interface Timestamp {
	createdAt: Date;
  	updatedAt: Date;
}

type Product = Id & {
	name: string;
  	price: number;
  	membersOnly?: boolean;
  	// 	id: string; => 생략
}

type User = Id & Timestamp & {
	// 	id: string; => 생략
  	username: string;
  	email: string;
  	// 	createdAt: Date; => 생략
  	// 	updatedAt: Date; => 생략
}

여러 객체타입을 합칠때 사용한다.

그러나 인터페이스 상속으로도 마찬가지로 구현 가능하다.

// 인터섹션
interface Entity {
  id: string;
  createdAt: Date;
  updatedAt: Date;
}

type Product = Entity & {
  name: string;
  price: number;
  membersOnly?: boolean;
}

// 인터페이스와 상속
interface Entity {
  id: string;
  createdAt: Date;
  updatedAt: Date;
}

interface Product extends Entity {
  name: string;
  price: number;
  membersOnly?: boolean;
}

유니언 타입과 인터섹션 타입의 차이점

유니언: "A | B라고 하면 "A 타입이거나 B 타입이다"

Type Narrowing을 통해서 각 타입의 범위로 좁혀들어갈 수도 있다.

function printAUnionB(arg: A | B) {
  // 여기서는 타입 A | B

    if ('a' in arg) {
    // Type Narroing을 통해 타입 A의 프로퍼티에 접근
    console.log(arg.a);
  }

    if ('b' in arg) {
    // Type Narroing을 통해 타입 B의 프로퍼티에 접근
    console.log(arg.b);
  }
}

type A = "A" | "B";
type B = "A" | "C";
type C = A | B;

C는 "A"와 "B"이거나 "A"와 "C"이다.

인터섹션: "A & B라고 하면 "A 타입이랑 B 타입을 합친 것이다"

function printAIntersectionB(arg: A & B) {
  console.log(arg.a); // 모든 프로퍼티에 접근 가능
  console.log(arg.B);  // 모든 프로퍼티에 접근 가능
}