Typescript(7) - Class

강민혁·2023년 6월 20일
0
post-thumbnail

Class

TypeScript에서 클래스(Class)는 객체 지향 프로그래밍(OOP)의 핵심 개념 중 하나로, 객체를 생성하기 위한 템플릿 또는 청사진(blueprint)입니다. 클래스를 사용하여 객체의 상태와 행위를 정의하고, 해당 클래스로부터 여러 개의 객체(인스턴스)를 생성할 수 있습니다.

class Car {
	constructor(color){
    	this.color = color;
    }
  	start() {
    	console.log("start");
    }
}

const bmw = new Car("red");

에러를 발생합니다.

color라는 프로퍼티가 Car에 존재하지 않는다고 합니다.

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

const bmw = new Car("red");

이런식으로 color를 선언해주고 거기에 타입까지 지정해주시면 욉니다.

접근제한자 (Access modifier)

Typescript에서는 접근제한자를 사용하여 클래스의 멤버 변수와 메서드의 접근 범위를 제한할 수 있습니다. 접근제한자는 4개의 종류가 존재합니다.

public

기본적으로 모든 멤버 변수와 메서드는 public으로 간주되며, public으로 선언된 멤버는 해당 클래스 내부와 외부에서 모두 접근할 수 있습니다

private

private으로 선언된 멤버는 해당 클래스 내부에서만 접근할 수 있으며, 외부에서는 접근할 수 없습니다. private 멤버에는 클래스 외부에서 접근할 수 있는 getter와 setter 메서드를 통해 접근해야 합니다.

protected

protected로 선언된 멤버는 해당 클래스 내부와 파생 클래스에서 접근할 수 있다고합니다. 외부에서는 protected 멤버에 직접 접근할 수 없습니다. 하지만, 파생 클래스를 통해 접근할 수 있습니다.

readonly

뜻 그대로 읽기만가능 이라는 뜻입니다. readonly로 선언된 멤버 변수는 읽기 전용으로, 값을 변경할 수 없습니다. 일반적으로 클래스의 생성자에서만 초기화할 수 있습니다.

접근제한자 예제

// public : 모두 사용가능
// private : 외부에서 접근 불가능

class Car {
    private name: string = "Car";
  	color: string;
	constructor(color: string){
    	this.color = color;
    }
  	start() {
    	console.log("start");
    }
}

class Bmw extends Car {
	constructor(color:string){
    	super(color);
    }
  	showName(){
    	console.log(super.name); // error : private 때문에
    }
}

private를 표현하는 방법은 두가지가 있습니다

class Car {
	// private name = "Car";
	// #name = "Car";
}

private 혹은 # 으로 private를 설정할 수 있습니다.

결론

  • public : 모두사용가능
  • private : private이 포함된 클래스만 사용 가능
  • protected : 자식 클래스만 사용 가능
  • readonly : 수정 불가능

static

class Car {
	// private name = "Car";
	// #name = "Car";
  	static wheels = 4;
  	console.log(Car.wheels);
}

static 매서드는 this대신 클래스명을 사용합니다.
위의 클래스는 Car이기 때문에 Car 사용

추상클래스

추상클래스 내에 있는 추상클래스는 하위 클래스에서 반드시 구체적인 선언이 필요합니다.

다음포스팅에서는 제네릭에 대해서 알아보겠습니다.

profile
화이팅

0개의 댓글