[TS] 클래스

타입스크립트에서는 클래스의 필드를 선언할 때 타입 주석으로 타입을 함께 정의해야 한다.

class Employee {
  name: string = "";
  hp: number = 0;
  position: string = "";
}

각 필드에 타입을 명시하고 초기값을 설정했다. 타입스크립트에서는 필드 선언 없이 바로 사용할 수 없으므로 반드시 클래스 본문에 필드를 먼저 정의해야 한다.

 

초기값 대신 생성자를 통해 필드를 초기화할 수도 있다.

class Employee {
  name: string;
  hp: number;
  position: string;

  constructor(name: string, hp: number, position: string) {
    this.name = name;
    this.hp = hp;
    this.position = position;
  }
  
  work() {
    console.log("일함");
  }
}

생성자의 매개변수에도 타입을 정의하고, this를 통해 필드에 값을 할당한다. 메서드도 일반 함수처럼 정의할 수 있다.

 

클래스는 타입이다

타입스크립트의 클래스는 타입으로도 사용할 수 있다.

클래스를 타입으로 사용하면 해당 클래스가 생성하는 객체의 타입과 동일한 타입이 된다.

const employeeC: Employee = {
  name: "",
  hp: 0,
  position: "",
  work() {},
};

변수 employeeC를 Employee 타입으로 선언했다. 이 변수는 name, hp, position 프로퍼티와 work 메서드를 가져야 한다.

 

흥미로운 점은 new Employee()로 생성한 객체가 아니어도 구조가 동일하면 Employee 타입으로 인정된다는 것이다. 이는 타입스크립트의 구조적 타이핑 특성 때문이다.

 

상속

타입스크립트에서도 extends 키워드를 사용해 클래스 상속을 구현할 수 있다.

class ExecutiveOfficer extends Employee {
  officeNumber: number;

  constructor(
    name: string,
    hp: number,
    position: string,
    officeNumber: number
  ) {
    super(name, hp, position);
    this.officeNumber = officeNumber;
  }
}

ExecutiveOfficer 클래스는 Employee 클래스를 상속받아 부모 클래스의 모든 필드와 메서드를 물려받는다. 여기에 officeNumber라는 새로운 필드를 추가로 정의했다.

 

생성자에서는 반드시 super()를 먼저 호출해 부모 클래스의 생성자를 실행해야 한다. 그 후에 자식 클래스의 고유한 필드를 초기화할 수 있다.