interface vs. type

type키워드의 옵션 3가지

1. 오브젝트 모양을 설명하는 것

type Player1 = {
  name: "John"
};

2. type alias를 만드는 것

type Player2 = number;

3. 특정된 값으로 만드는 것

type Player3 = "1" | "2"

---

type과 interface의 공통점

• 타입스크립트에게 오브젝트의 모양과 타입을 알려주는 역할
• 추상 클래스(abstract class)를 대체한다.

//**type**
type PlayerA = {
  name: string;
};

const playerA: PlayerA = {
  name: "doe",
};

//**interface**
interface PlayerB {
  name: string;
}

const playerB: PlayerB = {
  name: "doe",
};

//class

class User implements PlayerB {
  constructor(name: string){}
}
또는
class User implements PlayerA {
  constructor(name: string){}
}

type과 interface의 차이점

type은 새 property를 추가하기 위해 다시 선언될 수 없지만
interface는 항상 상속이 가능하다.

1. 다른 클래스를 상속할 때의 차이점

//type
type PlayerA = {
  name: string;
};

type PlayerAA = PlayerA & {
  age: number;
};

const playerA: PlayerAA = {
  name: "doe",
  age: 20
};

//interface

interface PlayerB {
  name: string;
}

interface PlayerBB extends PlayerB{
  age: number;
}

const playerB: PlayerBB = {
  name: "doe",
  age: 20
};

2. 나중에 property를 타입에 추가할 때의 차이점

//type
type PlayerA = {
  name: string;
};

type PlayerAA = PlayerA & {
  age: number;
};

//🔻 추가할 프로퍼티
type PlayerAA = {
  health: number;
}; // => ❌ type을 쓸 땐 PlayerAA타입이 이미 정의돼있어서 중복된다.

const playerA: PlayerAA = {
  name: "doe",
  age: 20
};

//interface

interface PlayerB {
  name: string;
}

//🔻 추가할 프로퍼티
interface PlayerB{
  age: number;
}
interface PlayerB {
  health: number;
} // => ⭕ 인터페이스를 다시 써주고 추가할 프로퍼티를 써주면 된다.

const playerB: PlayerB = {
  name: "doe",
  age: 20
};