type과 interface의 차이

type과 interface의 차이란?

type과 interface 모두 typescript에서 타입을 지정해줄 때 사용합니다
이 두가지는 거의 비슷하게 사용되지만 약간의 차이점이 존재합니다.

차이점

1. 확장방법

• interface는 타입을 확장할 때 extends를 써서 확장을 합니다.

interface People {
  name: string
  age: number
}

interface Student extends People {
  school: string
}

• type는 타입을 확장할 때 &를 써서 확장을 합니다.

type People = {
  name: string
  age: number
}

type StudentType = People & {
  school: string
}

2.선언적확장

interface에서 할 수 있는 대부분의 기능들은 type에서 가능하지만, 한 가지 중요한 차이점은 type은 새로운 속성을 추가하기 위해서 다시 같은 이름으로 선언할 수 없지만, interface는 항상 선언적 확장이 가능하다는 것이다.

interface Animal {
  weight: number;
}

interface Animal {
  height: number;
}

const tiger: Animal = {
  weight: 100,
  height: 200,
};
console.log(tiger);

type _Animal = {
  weight: number;
};

type _Animal = {//error : 식별자가 중복됨
  height: string;
};

3.computed property name사용유무

• interface는 객체로 사용이 가능하지만 computed property name은 사용이 불가능합니다
• 하지만 type은 computed property name사용이 가능합니다
• computed property name은 인덱스 시그니쳐와 다른것입니다!

type names = 'firstName' | 'lastName'

type NameTypes = {
  [key in names]: string
}

const yc: NameTypes = { firstName: 'hi', lastName: 'yc' }

interface NameInterface {
  // error
  [key in names]: string
}