[Typescript] 인터페이스

1. 인터페이스

인터페이스는 객체의 타입을 지정하게 하는 키워드입니다. 만약 인터페이스가 없다면, 객체 자체는 object지만, 그 내부에 속성 값과 타입이 제각각인 것들을 담게 됩니다. 이를 막고자 인터페이스가 고안되었습니다.

인터페이스는 보통 파일명 앞에 대문자 I를 붙이고 사용합니다. 안의 내용은 객체 선언하듯이 이용하면 됩니다. 그러면 인터페이스는 객체에서 마치 타입처럼 동작합니다.

interface 인터페이스명 {
  속성명: 타입;
}

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

let std: IStudent = {
    name: '마틴',
    id: 1,
}

다음과 같은 선언들은 타입과 일치하지 않아서 오류입니다.

let std: IStudent = {
    name: '마틴',
}

let std: IStudent = {
    id: 1,
}  //속성이 하나만 있음

let std: IStudent = {}  //속성이 없음

let std: IStudent = {
    name: '마틴',
    id: 1,
    email: 'a@a.net',
}  //인터페이스에 명시하지 않은 속성이 있음

 

 

 

2. 인터페이스 선택 속성

객체에 속성들을 명시한 것은 좋은데, 너무 딱딱해서 사용하기 불편하죠? 만약 어느 속성이 어떤 객체는 가지고 있을 수도 있고 없을 수도 있다면 어떻게 해야할까요?

이러한 문제점을 위해 특정 속성을 optional하게 해주는 선택 속성 구문이 있습니다. 사용법은 간단하게 인터페이스의 속성명 뒤에 ?를 붙입니다.

interface 인터페이스명 {
  속성명?: 타입;
}

interface IStudent {
    name: string;
    id?: number;
}

let std1: IStudent = {
    name: '마틴',
    id: 1,
}

let std2: IStudent = {
    name: '파룰',
}  //id가 선택 속성이라 없어도 오류가 아님!

 

 

3. 익명 인터페이스

자바스크립트의 익명 함수 기억하시나요? function 명령을 생략하고 함수명만 적어서 함수로 이용하는 것이었는데요. 인터페이스도 interface 명령을 사용하지 않고 사용할 수 있습니다.

사용법은 변수를 선언하고, 타입 부분에 인터페이스를 작성하면 됩니다.

let 변수명: { 인터페이스 작성 };

위에서 사용한 코드를 익명 인터페이스로 그대로 바꿔보겠습니다.

let std: {
    name: string;
    id?: number;
};

std = {
    name: '마틴',
    id: 1,
}

---

참조

https://www.typescriptlang.org/docs/handbook/2/objects.html

Documentation - Object Types