TypeScript에서 Type Alias와 Interface의 각각의 특징을 통해 공통점과 차이점에 대해 알아보자.
1. 선언
type PositionType = {
x: number;
y: number;
};
interface PositionInterface {
x: number;
y: number;
}
// object
const obj1: PositionType = {
x: 10,
y: 1,
};
const obj2: PositionInterface = {
x: 20,
y: 2,
};일반적으로 객체 타입을 선언하는 거에 있어서 둘이 동일한 방법으로 사용할 수 있다.
선언 부분에서의 둘의 차이점은 인터페이스는 당연하겠지만 객체에서만 사용이 가능하다는 점과, Index Signature의 사용 유무이다.
이 부분에 있어서는 객체 타입에서의 Type Alias에 대해 알아보면 좋다.
[TypeScript] 객체타입 - object, array, tupple
타입 스크립트에서 사용하는 타입 중에 object, array, tupple 객체 타입에 대해 알아보자. Object object타입은 javascript에서라면 정말 흔하게 자주 사용하던 타입이나, typescript에서 사용하려면 조금 까다
mine-it-record.tistory.com
2. 구현
type PositionType = {
x: number;
y: number;
};
interface PositionInterface {
x: number;
y: number;
}
class Pos1 implements PositionType {
x: number;
y: number;
}
class Pos2 implements PositionInterface {
x: number;
y: number;
}여기서 말하는 구현은 implements를 말하는데, type과 interface 둘 다 클래스를 통한 구현이 가능하다.
3. 확장
type PositionType = {
x: number;
y: number;
};
interface PositionInterface {
x: number;
y: number;
}
// Extends
interface ZpositionInterface extends PositionInterface {
z: number;
}
type ZpositionType = PositionType & { z: number };
// only interfaces can be merged.
interface PositionInterface {
z: number;
}확장을 하는 방법은 다를지언정 type과 interface 둘 다 확장이 가능한 것을 볼 수 있다.
여기서 차이점이 발생하는데, 인터페이스의 경우에는 선언적 확장이 가능하다는 점이다.
선언적 확장은 동일한 이름으로 interface를 선언해줬을 경우 자동적으로 하나로 합쳐진다.
이는 type에서는 불가능한 기능이므로 interface만 가능하다.
그리고 확장 기능에 있어서 성능적으로 interface 좀 더 준수한 성능을 가지고 있다고 한다.
일단 내가 생각하는 가장 큰 것들은 이렇게 3가지인데, 당연히 더 있을 수 있다.
여기서 핵심은 이제 type과 interface를 각각 언제 사용하는가? 일 텐데, 결론은 팀 내 공통적으로 정해서 사용하는 게 가장 베스트이며, type과 interface의 쓰임새를 생각하고 각각에 맞게 사용해주는 게 좋다고 생각된다.
사실 객체지향적 언어에서 많이 사용되는 interface의 경우 type처럼 사용하는 경우는 없고 하나의 규격으로 클래스에 구현하는 방식으로 많이 사용되기 때문에 type은 경우 그저 interface처럼 구현을 한다기보다는 값을 담아두기 위해 사용하고, interface는 하나의 규격이기 때문에 그것을 이용해 구현하고자 할 때 사용하면 될 거라 생각한다.
뭐 이러나저러나 결국 팀 내 공통적으로 정하고 사용하는 게 가장 베스트인 것은 맞다.
그리고 type alias의 경우 버전이 낮았을 때는 기능이 처참할 정도로 없어서 interface를 많이 사용해왔다는데, 현재 버전(4.7 현재 게시글도 언제 잘못된 정보로 바뀔지 모르겠다.)에서는 type의 기능이 많이 좋아져서 좀 더 다양한 선택지가 있지 않을게 생각된다.
댓글