클래스(Class)

클래스(Class)

1. 클래스(Class)

  • 이번엔 클래스(Class)에 대해 배워보겠습니다.
  • 클래스란? 데이터와 해당 데이터를 처리하는 메서드(함수)의 모음입니다.
  • TypeScript클래스를 선언할 때, 다음 예제와 같이 선언합니다.
class Car {
    color: string;
    constructor(color: string) {
        this.color = color;
    }
    start() {
        console.log("start");
    }
}

const bmw = new Car("red");

 

2. 접근 제한자(Access Modifier)

  • TypeScript에서는 접근 제한자를 지정해 줄 수 있습니다.
  • 이를 통해 정보 은닉 및 캡슐화를 지원할 수 있습니다.
  • TypeScript에서는 세 가지 주요 접근 제한자(Access Modifier)를 사용할 수 있습니다.

  1) public

  • 이는 기본적인 접근 제한자입니다. (기본값)
  • 멤버에 대한 어떠한 제한도 없이 어디서든 접근할 수 있습니다.
  • 요약 : 자식 클래스, 클래스 인스턴스 모두 접근 가능

  2) private

  • 해당 멤버는 클래스 내부에서만 접근할 수 있습니다.
  • 클래스 외부에서는 접근할 수 없습니다.
  • 요약 : 자식 클래스에서 접근 가능

  3) protected

  • 해당 멤버는 클래스 내부와 클래스를 상속한 서브클래스에서 접근할 수 있습니다.
  • 클래스 인스턴스에서는 직접 접근할 수 없습니다.
  • 요약 : 해당 클래스 내부에서만 접근 가능

 

  • 예시를 들어보겠습니다.

    → brand는 기본적으로 public이므로 어디서든 접근할 수 있습니다.

    → speedprivate이므로 클래스 외부에서 접근할 수 없습니다.

    →  fuelLevelprotected이므로 클래스 내부와 해당 클래스를 상속한 서브클래스에서만 접근할 수 있습니다.

class Car {
    public brand: string; // 기본적으로 public
    private speed : number;
    protected fuelLevel: number;

    constructor(brand: string, speed: number, fuelLevel: number) {
        this.brand = brand;
        this.speed = speed;
        this.fuelLevel = fuelLevel;
    }

    accelerate() {
        this.speed += 10;
    }

    checkFuel() {
        console.log(`Fuel level: ${this.fuelLevel}`);
    }
}

class ElectricCar extends Car {
    chargeBattery() {
        this.fuelLevel += 10; // protected 멤버에 접근 가능
    }
}

let myCar = new Car("Bmw", 60, 50);
console.log(myCar.brand); // 접근 가능 (public)

// console.log(myCar.speed) 에러 : 접근 불가 (private)
// console.log(myCar.fuelLevel) 에러 : 접근 불가 (protected)

myCar.accelerate(); // 메서드 호출 가능
myCar.checkFuel(); // 메서드 호출 가능

let myElectricCar = new ElectricCar("Tesla", 70, 60);
// console.log(myElectricCar.fuelLevel); 에러 : 접근 불가 (protected)
myElectricCar.chargeBattery(); // 서브클래스의 메서드 호출 가능

 

3. static

  • static 키워드는 클래스 멤버(메서드 or 프로퍼티)를 정의할 때 사용됩니다.
  • 해당 멤버는 클래스 자체에 속하게 되며, 클래스의 인스턴스화 없이도 접근할 수 있습니다.
  • 정적 메서드를 사용하면 클래스의 인스턴스와 상관없이 해당 메서드를 호출할 수 있습니다.
  • 또한, 정적 프로퍼티를 사용하면 클래스의 단일 인스턴스에서 값을 공유할 수 있습니다.
  • 정적 멤버인스턴스에 속하는 것이 아니므로, 정적 메서드 내에서 this 키워드를 사용할 수 없습니다. 대신 클래스 이름은 사용하여, 정적 멤버에 엑세스해야 합니다.
  • 예시를 들어보겠습니다.

    → PIstatic 키워드로 정적 프로퍼티로 정의되었습니다.

    → 이는 클래스의 인스턴스를 만들지 않고도 MathUtil.PI와 같이 클래스 자체에서 직접 접근할 수 있습니다.

    → add 메서드도 static 키워드로 정의되었습니다.

    → MathUtil.add(5, 3)와 같이 인스턴스를 직접 만들지 않고도 메서드를 호출할 수 있습니다.  

class MathUtil {
    static PI: number = 3.14;

    static add(x: number, y: number): number {
        return x + y;
    }
}

console.log(MathUtil.PI); // 정적 프로퍼티에 접근 (3.14)

let result = MathUtil.add(5, 3); // 정적 메서드 호출
console.log(result) // 8

 

4. 추상 클래스

  • 이번엔 추상(Abstract) 클래스에 대해 알아보겠습니다!
  • 추상 클래스란? 하나 이상의 추상 메서드를 포함하는 클래스를 말합니다. 추상 메서드는 구현이 없는 메서드로, 해당 메서드를 상속받는 클래스에서 반드시 구현해야 합니다.
  • 추상 클래스를 정의할 때는 abstract 키워드를 사용하며, 인스턴스 생성이 불가능합니다.
  • 다음 예제를 살펴보겠습니다.

    → Animal 클래스추상 클래스로 선언되어 있습니다.

    → 이 메서드는 추상 메서드 makeSound( )를 정의하고 있습니다. 이 메서드는 파생 클래스에서 구현되어야 합니다.

    → Dog 클래스는 Animal 클래스를 상속하고 추상 메서드 makeSound( )를 구현하였습니다.

    → 따라서, Dog 클래스는 추상 클래스를 상속하여 구현한 것으로 유효한 클래스입니다.

abstract class Animal {
    // 추상 메서드
    abstract makeSound(): void;

    // 일반 메서드
    move(): void {
        console.log("Moving...");
    }
}

class Dog extends Animal {
    // 추상 메서드의 구현
    makeSound(): void {
        console.log("Woof! Woof!");
    }
}

// 추상 클래스는 직접 인스턴스화할 수 없습니다.
// const animal = new Animal(); // 오류 발생

// 파생 클래스의 인스턴스 생성
const dog = new Dog();
dog.makeSound(); // "Woof! Woof!" 출력
dog.move(); // "Moving..." 출력

 

5. 정리하며

  • 지금까지 클래스, 접근 제한자, static, abstract에 대해 알아보았습니다.
  • 지금까지 제네릭(Generics)에 대해 알아보았습니다.
 

제네릭(Generics)

제네릭(Generics) 1. 제네릭(Generics) 이번엔 제네릭(Generics)에 대해 알아봅시다! 제네릭이란? 코드를 재사용하고 유연성을 높이는 데 사용되는 강력한 도구입니다. 제네릭을 사용하면 함수, 클래스,

newbean-j.tistory.com

 

※ 코딩앙마님의 유튜브 강좌를 참고하였습니다.

'Front-End Study > TypeScript' 카테고리의 다른 글

유틸리티 타입  (0) 2024.02.21
제네릭(Generics)  (0) 2024.02.20
함수 (function)  (0) 2024.01.31
인터페이스 (interface)  (0) 2024.01.29
기본 타입  (0) 2024.01.26