<TypeScript: Type Alias vs Interface>

0

<TypeScript: Type Alias vs Interface>

type Alias와 Interface 어느 상황에 쓰는게 좋을까? when we use Type alias or Interface?

드림코딩 타입스크립트 편을 참조해서 정리하였습니다.

Type Alias

  • Type alias can use computed propeties!( 객체의 index 값을 정의 할 수 있다.)
  • 주로 데이터를 무엇을 담을지에 대한 모습인 타입을 결정하기 때문에 데이터를 담을 목적이 있다고 할 수 있다.
// 😆 Type aliases can use computed properties
  type Person = {
    name: string;
    age: number;
  };
  type Name = Person["name"]; // person타입의 이름은 string이므로 이 타입은 결국 string이 왼다.

  type NumberType = number; // 새로운 타입도 만들 수 있음
  type Direction = "left" | "right"; // 유니온 타빕은 interface로는 불가
}

Interface

  • 객체 간의 상호 작용할 수 있게 해주는 계약서와 같은 설계도 라고 생각해 볼 수 있다.(규격 사항)
  • 반면에, type은 주로 데이터를 담을 목적이 좀 더 크다고 볼 수 있다.
// only interfaces can be merged. 
 interface PositionInterface {
    x: number;
    y: number;
  }

  interface PositionInterface { // 위의 인터페이스에 동일하게 다시 선언을 해줬다고 하면, 그전 꺼에 덧붙여 지게 된다 
    z: number;  // 즉 x,y,z의 세가지 타입이 들어가 있는 규격사항 된다고 볼 수 있다.
  }

// type의 경우는 동일하게 같은 이름을 선언해줄 경우 , 중복되지 않고 동일 이름이라는 에러가 발생할 것이다.

Extends Type

  • 인터페이스는 extends를 명시해줘서 확장이 가능하고, type의 경우 && 연산자를 활용하여 기존타입과 하나의 타입으로 묶어줄 수 있다.
	// 위와 같은 타입과 인터페이스가 있다고 하면,
	type PositionType = {
    x: number;
    y: number;
  };
  interface PositionInterface {
    x: number;
    y: number;
  }

  // Extends
  interface ZPositionInterface extends PositionInterface { //
    z: number;
  }
  type ZPositionType = PositionType & { z: number }; // // 기존 타입과 하나의 타입을 묶어줄 수 있음!

Conclusion

인터페이스는 규격사항으로서 활용을 많이 하지만, 둘 중 무엇을 쓸 지는 회사마다 다 다르다!

profile
문과생 개발자되다

0개의 댓글