[typescript] type Vs interface

타입을 지정할 때 사용할 수 있는 방법은 2가지가 있습니다.

type과 interface

//interface 방법
interface Point{
	x:number;
	y:number;
}

//type 방법
type Point = {
	x:number;
	y:number;
}

 

공식문서의 조언

대부분의 경우 interface와 type을 사용할 수 있습니다만, 잘모르겠다면 interface를 먼저 사용하고 이후 문제가 발생하면 type을 사용하길 권장합니다.

 

1. 주요한 차이점은 확장하는 방법과 새 필드를 추가하는 법입니다.

 

확장하는 방법

//interface
interface Animal{
	name:string
}
interface Dog extends Animal{
	leg:number
}


//type
type Animal = {
	name:string
}

type Dog = Animal & {
	leg:number
}

새 필드를 추가하는 방법

//interface
interface Animal{
	name:string;
}
interface Animal{
	leg:number;
}


//type ==> ERROR
type Animal = {
	name:string;
}

type Animal = {
	leg:number;
}

 

2. 인터페이스는 기존의 원시타입에 별칭을 부여하는데 사용할 수 없습니다.

//can
type a = string

//cant
interface a extends string

 

3.유니온을 사용하려면 type을 사용해야 합니다.

//can
type Fruit = 'apple' | 'banana'

 

 

결론

필드를 새로 추가할 수 있는 부분에서 interface가 더 확장성이 있는 것 같습니다.

따라서 공식문서에서도 interface를 더 권장하는건가 싶습니다.

 

 

래퍼런스

https://levelup.gitconnected.com/typescript-what-is-the-difference-between-type-and-interface-9085b88ee531

TypeScript: What is the difference between type and interface?

https://www.typescriptlang.org/docs/handbook/2/everyday-types.html

Documentation - Everyday Types