Type VS Interface

선언

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 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 둘 다 클래스를 통한 구현이 가능하다.

확장

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;
}

방법은 다르지만 ype과 interface 둘 다 확장이 가능한 것을 볼 수 있다.
여기서 차이점이 발생하는데, 인터페이스의 경우에는 선언적 확장이 가능하다는 점이다.
 
선언적 확장은 동일한 이름으로 interface를 선언해줬을 경우 자동적으로 하나로 합쳐진다.
이는 type에서는 불가능한 기능이므로 interface만 가능하다.
 
그리고 확장 기능에 있어서 성능적으로 interface 좀 더 준수한 성능을 가지고 있다고 한다!