[TypeScript] interface

전에 봤듯이 TypeScript에서 Object 타입을 선언할 때 interface와 type을 이용한다.

TypeScript는 객체를 Object를 선언하고 바로 접근하려면 안되는 것을 볼 수 있다.

 

그래서 우리는 object에 이용할 때는 interface를 사용한다.

object만 선언하고 사용했을 때랑 다르게 UserInfo라는 interface를 선언한 후 user의 name에 접근하니 오류 메시지를 띄우지 않는다.

 

잠깐.

여기서 Interface란

상호 간에 정의한 약속 혹은 규칙을 의미하며 TypeScript에서의 인터페이스는 보통 다음과 같은 범주에 대해 약속을 정의한다고 한다.

- 객체의 속성과 속성의 타입

- 함수의 파라미터

- 삼수의 반환 타입

- 배열과 객체를 접근하는 방식

- 클레스

 

Interface는 클레스와 유사하지만 인스턴스 생성이 불가능하고 모든 메서드는 추상 메서드로 이루어져 있다. 또한 Interface의 추상 메서드는 abstract 키워드를 사용하지 않는다는 특징이 있다. 특이한건 ES6에서는 지원하지 않고 오로지 TypeScript에서만 지원한다는 것이다.

 

Interface의 사용

Interface는 변수, 함수, 클래스 타입으로 사용할 수 있다.

 

변수 타입 interface

처음에 사용한 예제이다.

함수의 파라미터 타입으로도 사용한데 이 경우에도 함수의 파라미터 타입에 지정한 인터페이스를 준수하는 파라미터를 전달해야 된다. 이렇게 사용하면 함수에 객체를 전달할 때 별도의 매개변수 체크를 생략할 수 있다는 장점이 있다.

 

함수 타입 interface

함수 타입에 interface를 사용하는 경우에는 interface에 타입이 선언 된 파라미터 리스트와 리턴 타입을 정의해주어야 한다. 변수의 경우와 마찬가지로 함수 인터페이스를 구현하는 함수는 interface를 준수하여 사용해야 된다.

 

 

클래스 타입 interface

클래스에 implements 키워드로 인터페이스를 선언하여 사용할 수 있다. 이러한 경우 해당 클래스는 선언한 interface를 반드시 구현해야 된다. 이러한 특징으로 인하여 interface는 일관성을 유지할 수 있단는 장점을 갖게 된다.

 

선택적 프로퍼티

프로퍼티는 반드시 구현 되어야 하지만 상황에 따라 선택적으로 사용해야 될 경우가 있다. 이럴때 이용하는 것이 선택적 프로퍼티(Optional Property) 이다. 프로퍼티 명 뒤에 "?"를 붙여 선택적 프로퍼티로 선언된 경우 구현시 생략하여도 에러 메시지를 보여주지 않는다.

 

interface의 상속 (확장)

extends 키워드를 이용하여 다중 interface 상속을 하거나 클래스를 상속 받아 확장이 가능하다. 이는 interface의 재사용 높은 컴포넌트로 쪼갤때 유연함을 제공해준다.

여러 interface의 조합도 만들기 가능하다.