Interface

Interface란?

데이터의 골격을 정해준다.

interface Person1 {
    name : string;
    age: number;
};

function hello1(person: Person1): void {
    console.log(`안녕하세요. ${person.name} 입니다.`);
};

const p1: Person1 = {
    name: 'Mark',
    age: 39,
};

hello1(p1);

하지만 js로 컴파일 했을 때 나타나지는 않는다. typescript를 사용할 때에만 사용하는 문법이다.

"use strict";

function hello1(person) {
    console.log(`안녕하세요. ${person.name} 입니다.`);
};

const p1 = {
    name: 'Mark',
    age: 39,
};

hello1(p1);

 

optional property

• ? : 없어도 된다.
• [] : key를 가지는 데이터를 만들 수 있다.

interface Person3 {
    name: string;
    age?: number;
    [index: string]: any;
}

• [] 사용예시

const p33: Person3 = {
    name: 'JJang',
    father: p31,
    mother: p32,
};

const a: [string] = p33['father'];

 

인터페이스 내부에 함수를 정의하는 방법

interface Person4 {
    name: string;
    age: number;
    hello(): void;
}

const p41: Person4 = {
    name: 'Mark',
    age: 39,
    hello: function(): void {
        `안녕하세요! ${this.name} 입니다.`
    }
}

 

readonly 키워드

멤버를 초기화 한 이후에 바꿀수 없도록 한다.

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


const p81: Person8 = {
    name: 'Mark',
    gender: 'male',
}

p81.gender = 'female';    // 에러발생

 

alias와 interface의 차이

함수 정의하는 방법

type EatType = (food: string) => void;

interface IEat {
  (food: string): void
}

 

배열 정의

type PersonList = string[];

interface IPersonList {
    [index: number]: string; 
}

 

intersection

interface ErrorHandling {
    success: boolean;
    error?: {message: string};
}

interface ArtistsData {
    artists: {name: string}[];
}

type ArtistsResponseType = ArtistsData & ErrorHandling;

interface IArtistsResponse extends ArtistsData, ErrorHandling {}

 

union types

interface Bird {
    fly(): void;
    layEggs(): void;
}

interface Fish {
    swim(): void;
    layEggs(): void;
}

type PetType = Bird | Fish;

interface IPet extends PetType {}  // error

class Pet implements PetType {}    // error

 

Declaration Merging

인터페이스는 가능하다

mi로 a, b필드 둘다 사용가능

interface MergingInterface {
    a: string;
}

interface MergingInterface {
    b: string;
}

let mi: MergingInterface;

alias는 불가능하다.