QUESTION #0113
프론트엔드

자바스크립트 클래스의 접근제어자에 대해 설명해주세요.

자바스크립트 클래스의 접근제어자에 대해 설명해주세요.

분야: 프론트엔드


자바스크립트에서 클래스의 Public, Private, Protected 접근제어자는 클래스 멤버의 접근 범위를 제어하는 데 사용됩니다.

Public은 별도 키워드를 붙이지 않았을 때 기본 적용되는 접근제어자로, 클래스 외부에서도 자유롭게 접근 가능합니다. 예를 들어, this.name = "John”;처럼 선언된 멤버는 Public으로 간주됩니다. 이는 클래스 외부에서 객체를 통해 직접 접근할 수 있습니다.

Private은 멤버 앞에 # 키워드를 붙여 적용하는 접근제어자로, 클래스 내부에서만 접근 가능하게 됩니다. 예를 들어, this.#secret = "hidden”;처럼 선언된 멤버는 Private으로 간주됩니다 . Private 멤버는 객체를 통한 외부 접근이 불가능하며, 상속받은 클래스에서도 사용할 수 없게 됩니다.

Protected는 자바스크립트 언어 차원에서 지원하지 않지만, 관습적으로 _를 접두어로 사용해 개발자 간 약속으로 처리합니다. 예를 들어, this._secret = ‘hidden’;과 같은 방식으로 선언하여 Protected임을 나타냅니다. 이는 상속받은 클래스에서 접근하는 것은 허용하지만 클래스 외부에서는 사용하지 말라는 의미를 나타냅니다. 즉, 클래스 외부에서 객체를 통한 접근은 하지 않을 것을 개발자들 간에 약속하는 것입니다. 이는 언어 차원의 강제성은 없습니다.

접근제어자를 활용하면 코드의 캡슐화를 통해 데이터 보호와 유지보수를 향상시킬 수 있습니다.

타입스크립트에서는 접근제어자와 관련해 어떤 차이점이 존재하나요? 🤔

첫째, 타입스크립트에서는 자바스크립트에서 지원하지 않는 접근제어자 키워드들을 제공하기 때문에 더욱 명시적인 방식으로 접근제어자를 선언할 수 있습니다.

public 키워드를 이용하여 Public 멤버임을 선언할 수 있습니다. 아무 키워드를 붙이지 않을 때와 동작은 동일하지만 그 의미를 명시적으로 나타낼 수 있게 해줍니다.

# 키워드 대신 private 키워드를 이용하여 Private 멤버임을 선언할 수 있습니다.

_ 키워드 컨벤션 대신 protected 키워드를 이용하여 Protected 멤버임을 선언할 수 있습니다.

예시

class Foo {
  public a: string; // 상속 클래스 접근 O / 외부 접근 O
  private b: number; // 상속 클래스 접근 X / 외부 접근 X
  protected c: boolean; // 상속 클래스 접근 O / 외부 접근 X

  constructor(a: string, b: number, c: boolean) {
    this.a = a;
    this.b = b;
    this.c = c;
  }
}

둘째, 타입스크립트에서는 파라미터 프로퍼티(Parameter Properties) 기능을 제공합니다. 이는 생성자 매개변수에 접근제어자를 붙이면 해당 변수를 멤버로 자동 선언하고 초기화되는 기능입니다. 이로 인해 코드를 간결하게 작성할 수 있습니다.

예시

class Foo {
  constructor(public a: string, private b: number, protected c: boolean) {
    // 이 부분을 채우지 않아도 자동으로 멤버 선언 및 초기화
  } 
}

📚 추가 학습 자료를 공유합니다.