TypeScript Interface

안녕하세요. 오늘은 타입스크립트 인터페이스에 대해 알아볼게요.

 

 

 

인터페이스(Interface)

 

인터페이스는 객체의 구조(형태)를 정의하는 타입으로

 

객체가 어떤 속성과 메서드를 가져야 하는지 미리 약속하는 설계도 같은 역할을 해요.

interface IUser {
  name?: string;       // 선택적 속성 (있어도 되고 없어도 됨)
  readonly age: number; // 읽기 전용
  greet(name: string): void; // 메서드(함수) 형태 정의
}

let userA: IUser = {
  age: 50,
  greet: (name) => console.log(`${name} hello ~`),
};

userA.greet("홍길동"); // 출력: 홍길동 hello ~


? → 옵션 속성
readonly → 수정 불가 속성
void → 반환값이 없는 함수

 

 

 

클래스에서 인터페이스 구현(implements)

 

인터페이스는 클래스가 따라야 하는 규칙처럼 쓸 수도 있어요.

 

implements 키워드를 사용하면 클래스가 인터페이스의 속성과 메서드를 반드시 구현해야 해요.

class Student implements IUser {
  name!: string; // 나중에 반드시 초기화될 거라고 TS에 알림
  age: number;

  constructor(name: string, age: number) {
    this.name = name;
    this.age = age;
  }

  greet(name: string): void {
    console.log(`Hello1, my name is ${name}`);
    console.log(`Hello2, my name is ${this.name}`);
  }
}

const student1 = new Student("김삿갓", 20);
student1.greet("홍길동");
// Hello1, my name is 홍길동
// Hello2, my name is 김삿갓

name! 은 “나중에 꼭 값이 들어갈 거야!” 라는 의미의 확실한 할당 단언(Definite Assignment Assertion)

 

 

 

인터페이스 확장(extends)

 

인터페이스끼리는 상속(확장)이 가능해요.

 

새 인터페이스가 기존 인터페이스의 속성을 그대로 물려받아요.

interface Shape {
  color: string;
}

interface Square extends Shape {
  sideLength: number;
}

let square1: Square = {
  color: "red",
  sideLength: 10,
};

*** extends는 “같은 형식끼리 확장” (인터페이스 ↔ 인터페이스)

 

*** implements 는 “다른 형식끼리 연결” (클래스 ↔ 인터페이스)

 

 

 

인터페이스(interface) VS 타입 별칭(type alias)

 

인터페이스와 타입 별칭의 공통점이 존재하는데요.

 

둘 다 "사용자 정의 타입"을 만드는 기능이에요. 즉, 객체 구조나 데이터 형태를 정의할 때 사용해요.

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

type PersonType = {
  name: string;
  age: number;
};

const user: Person = { name: "Tom", age: 20 };
const user2: PersonType = { name: "Amy", age: 25 };

 

두 가지의 공통점이 있지만 각각 장점이 존재해요.

 

인터페이스는 확장이 가능해요.

 

다른 인터페이스를 상속(extends)해서 새로운 타입을 만들 수 있어요. 특히 객체 지향 프로그래밍(OOP) 스타일에 어울려요.

interface Animal {
  name: string;
}

interface Dog extends Animal {
  bark(): void;
}

 

 타입 별칭은 더 유연해요.

 

객체뿐 아니라 유니언(|), 교차(&), 원시타입 조합도 표현이 가능해요.

type ID = string | number;
type Status = "active" | "inactive";
type User = { name: string } & { age: number };

 

즉 type은 더 넓은 타입 표현이 가능하고, interface는 구조적 확장에 강점이 있어요.

 

 

 

아래는 인터페이스 와 타입 별칭의 요점표 에요.

 

개념	설명	키워드
interface	객체 구조를 정의하는 타입	interface, implements, extends
type alias	타입에 이름을 붙임	type, &, `
generic	재사용 가능한 타입	<T>, <T, U>, extends, keyof
조건부 타입	타입에 조건 부여	extends ? :

 

interface VS type alias
구분	interface	type alias
확장(extends)	✅ 가능	⚠️ 제한적(교차 타입으로 가능)
유니언/교차 타입	❌ 불가	✅ 가능
선언 병합	✅ 가능	❌ 불가
사용 목적	객체 구조 정의	다양한 타입 조합 정의

 

 

 

 

여기까지 타입스크립트의 인터페이스에 알아봤는데요.

 

인터페이스를 공부하면서 확실히 자바와 많이 공통점이 존재해서 알기가 쉬웠어요.

 

여러분들은 어떠셨나요?