[TypeScript/타입스크립트] 클래스 Class

[참고]

 

클래스 (Class)

// Class
class Car4 {
    color: string;
    constructor(color: string){
        this.color = color;
    }
    start(){
        console.log("start");
    }
}

const bmw = new Car4("red");

 

자바스크립트와 달리 타입스크립트에서는 클래스 작성 시 멤버 변수는 미리 선언해주어야 함. 

그렇지만 멤버 변수를 미리 선언하지 않으려면 다음과 같은 방법 이용.

• 접근 제한자 이용
• readonly 키워드 사용

 

접근 제한자(Access modifier)

class Car4 {
    public name: string = "car";
    color: string;
    constructor(color: string){
        this.color = color;
    }
    start(){
        console.log("start");
        console.log(this.name);
    }
}

// 접근 제한자 (Access modifier)
class Mercedez extends Car4 {
    constructor(color: string){
        super(color);
    }
    showName(){
        console.log(super.name);
    }
}

const b4 = new Mercedez("black");

• public
  • 자식 클래스나 클래스 인스턴스에서 접근 가능.
  • 디폴트로 지정. 아무것도 안 적으면 public.
• private
  • 자식 클래스, 클래스 인스턴스 모두 접근 불가. 해당 클래스 내부에서만 접근 가능.
  • 변수 이름 앞에 #을 붙여서 표현도 가능.
• protected
  • 자식 클래스에서 접근 가능. 클래스 인스턴스에서는 접근 불가.

 

readonly 키워드 사용

class Car4 {
    constructor(readonly color: string){
        this.color = color;
    }
    start(){
        console.log("start");
    }
}

readonly 키워드가 붙은 변수, 즉 읽기 전용 프로퍼티는 수정 불가.

수정하고 싶다면 해당 클래스의 constructor에서 해야함.

 

Static Property

static으로 선언된 정적 멤버 변수나 메서드는 this가 아닌 class 이름을 앞에 써주어야함.

class Car4 {
  public name: string = "car";
  color: string;
  static wheels = 4;
  constructor(color: string) {
    this.color = color;
  }
  start() {
    console.log("start");
    console.log(this.name);
    console.log(Car4.wheels);
  }
}

 

추상 클래스

• class 선언 시 class 앞에 abstract를 써주어서 만들 수 있음.
• 추상 클래스는 new를 이용해서 객체를 만들 수는 없음. 상속을 통해서만 사용 가능.
• 추상 클래스 내부에 추상 메서드 선언 가능. 이 경우 상속받은 클래스에서 구체적인 구현 필요.
  이렇게 하면 같은 부모 클래스를 상속받은 수많은 자식 클래스에서 이름은 같지만 각자 다른 기능을 하는 메서드 생성 가능.

// 추상 class
abstract class bike {
    color: string;
    constructor(color: string){
        this.color = color;
    }
    abstract doSomething(): void;
}

class Samba extends bike {
    constructor(color: string){
        super(color);
    }
    doSomething(): void {
        console.log("it's Samba");
    }
}

class Alton extends bike {
    constructor(color: string){
        super(color);
    }
    doSomething(): void {
        console.log("it's Alton");
    }
}

const samba = new Samba("blue");
const alton = new Alton("red");

samba.doSomething();    // it's Samba
alton.doSomething();    // it's Alton