개발이야기

[TIL]26.타입스크립트 Type,Interface

무서운승태 2023. 11. 20. 19:54
728x90

타입스크립트에선 타입을 개발자가 만들 수 있다. 크게 두 가지 방식이 있는데 Type키워드로 내가 원하는 명칭으로 타입을 선언할 수 있고

Interface도 비슷하게 타입을 선언할 수 있어서 두 개념에 대해 많이 혼동한다고 한다. Type과 Interface의 차이점에 대해 알아보자

 

  • Type으로만 할 수 있는 것 
    • primitive 타입으로 선언할 수 있다.
    • union 타입으로 선언할 수 있다.
    • primitive 배열, 튜플을 선언할 수 있다.
// 타입 정의하는 방법와 사용법
type MyString = string;
let mystring1: MyString = "안녕하세요".


// Type만의 특징
// primitive 타입 선언
type MyString = string;

// union 타입선언
type Mytype = string | number;
let mytype: Mytype = "10";

// primitive 배열 or 튜플의 선언
type myTuple = [string, number];

 

 

  • Interface으로만 할 수 있는 것
    • interface merging (인터페이스를 중첩시킬 수 있다. type과 가장 큰 차이점)
    • 객체의 타입을 정할 때 사용한다.
// 인터페이스 정의 방법
interface Person {
 name: string,
 age: number
}

//사용법
let person1: Person = {
 name: "lee",
 age: 10
}


// merging
// 동일한 인터페이스가 두개있을때 합쳐진다.
interface Person {
 name: stirng
}

interface Person {
 age: number
}

let person2: Person = {
 name: "lee",
 age: 10
}

 

 

Extension

  • Type의 extension
    • & 키워드를 사용한다
    • 중첩이 가능하다
type DogName = {
 name: string
}

type DogAge = {
 age: number
}

type Dog = DogName & DogAge;

let dog: Dog = {
 name: "바둑이"
 age: 10
}

 

  • Interface의 extension
    • extends 키워드를 사용한다
    • 중첩이 가능하다
interface CatName = {
 name: string
}

interface CatAge = {
 age: number
}

interface Cat extends CatName, CatAge {
	catInfo: string
}

let cat: Cat = {
 name: "야옹이",
 age: 10,
 catInfo: "수컷입니다."
}