타입스크립트 인터페이스

타입스크립트 인터페이스란?

 

타입스크립트에서 변수의 타입을 일일히 지정해주면 기존보다 코드가 길어져서 코드의 내용이 복잡해질수 있다.

이럴때 타입스크립트에서 사용하는것이 타입 앨리어스 와 인터페이스가 있다.

오늘은 그중 인터페이스에 대해 알아보고자 한다.

 

인터페이스는 일반적으로 타입 체크를 위해 사용되며 변수, 함수, 클래스에 사용할 수 있다. 인터페이스는 여러가지 타입을 갖는 프로퍼티로 이루어진 새로운 타입을 정의하는 것과 유사하다. 인터페이스에 선언된 프로퍼티 또는 메소드의 구현을 강제하여 일관성을 유지할 수 있도록 하는 것이다.

 

이때 인터페이스를 타입으로 선언한 변수, 함수, 클래스는 해당 인터페이스를 준수하여야 한다.

 

// 인터페이스 선언
interface User {
    age: number;
    name: string;
}

// 변수에 인터페이스 활용
var seho: User = {
    age: 33,
    name: '세호'
}

// 함수에 인터페이스 활용
function getUser(user: User) {
    console.log(user);
}
const capt = {
    name: '캡틴',
    age: 100
}
getUser(capt);

// 함수의 스펙(구조)에 인터페이스를 활용
interface SumFuction {
    (a:number, b: number):number;
}

var sum: SumFuction;
sum = function(a: number, b:number):number {
    return a + b;
}

// 인덱싱
interface StringArray {
    [index: number]: string;
}

var arr : StringArray = ['a', 'b', 'c'];
arr[0] = '10' // 'a'