Interface 와 Type의 차이점

전병규·2023년 7월 7일
0

TypeScript

목록 보기
2/2
post-thumbnail

TypeScript 와 Type을 선언하는 와중에 어떤 차이점이 있을까? 라는 의구심이 생겼다.🤔🤔
그리하여 이참에 한번 써보자!! 라는 생각하며 적어봅니다

📌선언

🔅Type 선언

type A = {
  id : number;
  name : string;
         };

🔅Interface 선언

interface A  {
  id : number;
  name : string;
         };

기본적으로 type과 interface을 사용해 타입을 정의하고 지정하는 방법은 똑같다.

📌타입 확장 ( 상속 )

type과 interface는 타입을 확장하는 방법에 차이가 있습니다.
🙏type은 & 연산자, interface는 extends 키워드를 이용합니다.
🔅Type 선언


type UserType=  {
    id : number
    name : string
}
type UserType2 = UserType & {
    age : number;

};
const User1 : UserType2= {
    id : 1,
    name : 'gyu',
    age : 111
}
console.log(User1)

Type 💻 출력

🔅Interface 선언

interface A  {
    id : number;
    name: string;
}

//아래와 같이 동일한 이름으로 선언하여 확장할수있다.
interface A  {
	age : number;
}
//또는 extends 함수를 사용해 상속하는 경우도 있다.
interface B  extends  A {
    age : number;
} 


const num1 : A ={
    id : 0,
    name : 'jeon',
    age : 1,
};
console.log(num1);

Interface 💻 출력

📌선언적 확장

위에 설명과 같이 Interface에서 할 수 있는 대부분의 기능들은 type에서 가능하지만, 한 가지 중요한 차이점 type은 새로운 속성을 추가하기 위해서는 같은 이름으로 선언 할 수없다. 하지만 Interface는 선언적 확장이 가능하다는 것이다. 즉, 동일한 이름으로 선언을 하여 기능을 확장 할 수 있다.

느낀점

아직까진 TypeScript 많이 사용해 보지 않았고, 난 많이 부족한거같다.ㅠㅠㅠ 그러나 이제부터 공부를 시작해볼 생각이다. 이글 또한 공부한 내용들이 더 있다면 내용을 추가적으로 더 적을 예정이다.

profile
이상한 개발자

0개의 댓글