TypeScript - 5

박태영·2024년 5월 24일

typescript

목록 보기
5/9

Class

  • TypeScript의 Class는 JavaScript의 클래스 문법을 확장하여 추가적인 기능과 강력한 타입 검사 기능을 제공한다.

1. 타입 주석

class Person {
  name: string;
  age: number;

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

  greet(): void {
    console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
  }
}
  • TypeScript 클래스에서는 변수, 매개변수, 메서드 반환 값 등에 타입을 지정할 수 있다.
  • 이는 코드의 가독성과 유지 보수성을 높이고, 컴파일 타임에 오류를 잡을 수 있게 해준다.

2. 접근 제한자

class Person {
  public name: string;
  private age: number;

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

  public greet(): void {
    console.log(`Hello, my name is ${this.name}`);
  }

  private getAge(): number {
    return this.age;
  }
}
  • public, private, protected 접근 제한자를 지원하여 클래스 멤버들의 접근을 제한할 수 있다.
  • javascript로 변환될때 접근 제한자 코드는 사라지며 오직 typescript의 에러 감지를 위해서만 사용된다.
  • 기본 접근 제한자는 public 이다.

3. 읽기 전용 속성

class Person {
  readonly id: number;
  name: string;

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

const person = new Person(1, "Alice");
// person.id = 2; // Error: Cannot assign to 'id' because it is a read-only property.
  • 읽기 전용 속성을 만들어 값이 바뀌는 것을 막을 수 있다.

4.인터페이스와 구현

interface Greetable {
  greet(): void;
}

class Person implements Greetable {
  name: string;

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

  greet(): void {
    console.log(`Hello, my name is ${this.name}`);
  }
}
  • 인터페이스를 사용하여 클래스의 구조를 정의할 수 있다.

5. 추상 클래스

abstract class Animal {
  abstract makeSound(): void;

  move(): void {
    console.log("Moving...");
  }
}

class Dog extends Animal {
  makeSound(): void {
    console.log("Bark");
  }
}

const dog = new Dog();
dog.makeSound(); // "Bark"
dog.move(); // "Moving..."
  • 함수이 콜 시그니처만 작성하여 추상 메소드를 선언한다.
  • 추상 클래스는 인스턴스화할 수 없고 서브클래스에서 구현해야 하는 추상 메서드를 가지도록 할 수 있다.
profile
어른 아이

0개의 댓글