Interface
JS
에는 존재하지 않는다
- 객체의 타입을 정의하고 생김새(shape, 원형)를 가지도록 할 수 있다
TS
에서의 클래스 기능은 C#
에서 유래된 것이 많다
- 일부 기능은 TS에서만 존재하는 고유 문법으로 컴파일 후에 사라진다
extends
가 아닌 implements
키워드로 구현
- cf) 개방폐쇄 원칙 (Open-Closed Principle, OCP)
- 연습해 보기 1
- 객체 묘사 (인터페이스로)
- 그 객체를 묘사할 때 인터페이스 타입부터 선언
- 선언한 인터페이스 확장
- 확장한 인터페이스 구현
- 연습해 보기 2
- 베이스 컴포넌트(기본 클래스)와 그 베이스 컴포넌트를 확장하는 컴포넌트(파생 클래스)를 만들자
- 만들고 베이스 컴포넌트에 스스로 인스턴스화가 될 수 없는 방어 코드
2-2. 확장된 클래스에서 메서드 사용 강제
- 해당 클래스를 타입스크립트로 전환해 보자
- abstract 베이스 컴포넌트 생성
- implements로 확장 컴포넌트 구현
interface Animal {
name: string
}
interface Person extends Animal {
age: number
}
const person: Person = {
name: '사람',
age: 10,
}
type TPerson = {
name: string
age: number
}
두 가지 관점
- 객체 지향 (데이터 설명서)
- 메타 데이터
- Front-end에서의 유용한 사용 방법
- 예) React Component Typing
추상 클래스
- 스스로 인스턴스가 될 수 없다
interface
처럼 구현이 강제되지만 extends
아닌 implements
사용
class Component {
constructor() {
}
mount() {
}
attachEvent() {
}
}
class MyComponent extends Component {
}
abstract class Component {
constructor() {
}
mount() {
}
attachEvent() {
}
}
const React = new Component();
class MyComponent implements Component {
mount() {
}
attachEvent(){
}
}