초보자를 위한 TypeScript 인터페이스 소개

TypeScript 인터페이스는 객체의 구조를 정의하여 특정 모양 요구 사항을 준수하도록 하는 강력한 기능입니다. 이 가이드에서는 TypeScript 인터페이스의 기본 사항을 소개하며, 효과적으로 정의하고 사용하는 방법도 설명합니다.

인터페이스란 무엇인가?

TypeScript의 인터페이스는 객체의 모양을 설명하는 방법입니다. 객체가 가져야 할 속성과 메서드, 그리고 그 유형을 정의할 수 있습니다. 인터페이스는 코드에서 일관성과 명확성을 강화하는 데 도움이 됩니다.

인터페이스 정의

인터페이스를 정의하려면 interface 키워드 뒤에 인터페이스 이름과 객체 모양을 사용합니다.

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

이 예에서 Person 인터페이스는 Person 객체가 string 유형의 name과 number 유형의 age을 가져야 함을 지정합니다.

인터페이스 사용

인터페이스를 정의하면, 이를 사용하여 객체, 함수 매개변수, 반환 값을 유형 검사할 수 있습니다. 이렇게 하면 객체가 정의된 모양에 맞는지 확인할 수 있습니다.

객체와 함께 인터페이스 사용

Person 인터페이스를 사용하여 객체의 유형을 검사하는 방법은 다음과 같습니다.

const person: Person = {
  name: "Alice",
  age: 30
};

이 예에서 person 객체는 Person 인터페이스를 준수하여 올바른 유형의 name과 age을 모두 갖도록 보장합니다.

함수와 함께 인터페이스 사용

인터페이스는 함수 매개변수와 반환 값의 유형 검사에도 사용할 수 있습니다.

function greet(person: Person): string {
  return `Hello, ${person.name}!`;
}

이 예에서 greet 함수는 Person 유형의 매개변수를 받아들이고 인사말 메시지를 반환합니다.

선택 속성

인터페이스는 ? 수정자를 사용하여 선택적 속성을 포함할 수 있습니다. 이는 속성이 존재할 수도 있고 존재하지 않을 수도 있음을 나타냅니다.

interface Person {
  name: string;
  age: number;
  email?: string;
}

이 예에서 email은 Person 객체에 포함될 수도 있고 그렇지 않을 수도 있는 선택적 속성입니다.

읽기 전용 속성

속성을 읽기 전용으로 정의할 수도 있습니다. 즉, 초기화 후에는 수정할 수 없습니다.

interface Person {
  readonly name: string;
  age: number;
}

이 예에서 name 속성은 읽기 전용이며 일단 설정한 후에는 변경할 수 없습니다.

인터페이스 확장

인터페이스는 다른 인터페이스를 확장하여 기존 모양을 기반으로 빌드할 수 있습니다.

interface Employee extends Person {
  employeeId: number;
}

이 예에서 Employee 인터페이스는 Person 인터페이스를 확장하여 employeeId 속성을 추가합니다.

결론

TypeScript 인터페이스는 코드에서 객체 모양을 정의하고 적용하기 위한 기본 기능입니다. 인터페이스를 사용하면 일관성을 보장하고 코드 가독성을 개선하며 TypeScript의 강력한 유형 검사 기능을 활용할 수 있습니다. TypeScript 프로젝트에 인터페이스를 통합하여 더욱 견고하고 유지 관리하기 쉬운 코드를 만드세요.