[TS] 타입스크립트 인터페이스(Interface)

 

인터페이스란? 

일반적으로 변수, 함수, 클래스에 타입 체크를 위해 사용된다.

직접 인스턴스를 생성할 수 없고 모든 메서드는 추상 메소드이다. (내부 로직은 포함X)

인터페이스에 선언된 프로퍼티 또는 메서드는 무조건 구현을 강제 하여 일관성을 유지할 수 있도록 한다.

 

변수와 인터페이스

// 인터페이스 정의
interface Person {
    name: string;
    age: number;
}

let person: Person = {
    name: 'john',
    age: 20
}

인터페이스는 상호간의 정의한 약속이기때문에 선언한 변수들은 무조건 구현해야한다.

 

인터페이스 옵션

interface Person {
    name: string;
    age: number;
    gender?: string;
    readonly adress: string;
    
}

let person: Person = {
    name: 'john',
    age: 20,
    adress: 'seoul'
}

인터페이스로 정의되어 있는 속성을 다 사용하지 않고 선택적으로 필요한 경우 프로퍼티명 뒤에 ?를 붙이면 생략해도 에러가 발생하지 않는다.

프로퍼티명 앞에 readonly를 붙이면 처음 생성될 때만 값 설정이 가능하며 이후 수정이 불가능하다.

 

 

함수와 인터페이스

// 함수 인터페이스 정의
interface Add {
    (num1: number, num2: number): number;
}

const add: Add = function(x, y) { // 매개변수 명은 인터페이스와 상관 없이 지어도 됨 
    return x + y;
}

add(10, 20); //30

add(10, '20'); //Argument of type 'string' is not assignable to parameter of type 'number'.ts(2345)
add(10, 20, 30); //Expected 2 arguments, but got 3.ts(2554)

정의한 프로퍼티 값을 누락되거나 정의 하지 않는 값 또는 타입을 인수로 전달 시 컴파일 에러가 발생한다.

 

클래스와 인터페이스

interface Animal {
    makeSound(): void;
}

class Dog implements Animal {
    makeSound():void {
    	console.log('멍멍');
    }
}

클래스명 뒤에 implements 키워드와 인터페이스명을 적어야 하며, 인터페이스에 정의된 모든 속성과 메서드를 구현해야 한다.

 

인터페이스 확장

interface Animal {
    makeSound(): void;
}

interface Dog extends Animal { // Animal의 속성을 그대로 받고 추가로 정의할 수 있음
    speed: number;
}

class Bulldog implements Animal {
    speed: number;
    makeSound():void {
    	console.log('멍멍');
    }
}

클래스와 마찬가지로 인터페이스도 인터페이스 간 확장이 가능하다.

 

Refernece

• 엘리스