[TS] TypeScript - Class 접근 제한자(public, private, protected)

🔷 Class - 접근 제한자(Access modifier) - public, private, protected

• JavaScript ES6 에서의 Class 기본 형태

  class User {
      constructor(name, age) {
          this.name = name;
          this.age = age;
      }
  };

• TypeScript에서의 Class

  • member 변수 기입
  • ES6에서는 지원하지 않던 접근 제한자(public, private, protected)를 지원함
    • public: 자식 class, class instance 모두 접근 가능.
      • 접근 제한자를 따로 입력하지 않은 경우 default 값은 public이다.
    • private: 해당 class 내부에서만 접근 가능.
    • protected: 자식 class에서 접근 가능.

  // 1. member변수에 타입 지정하기
  
  class User {
      name :string; //member변수 타입 지정
      age :number;
      constructor(name :string, age :number) {
          this.name = name;
          this.age = age;
      }
  };
  
  // 위와 동일 함. (접근제한자 public은 default)
  class User {
      public name :string;
      public age :number;
      constructor(name :string, age :number) {
          this.name = name;
          this.age = age;
      }
  };
  
  // 2. private (#): 해당 class 내부에서만 접근 가능.
  
  class Fruits {
    private name :string = "fruits"; //#name :string;도 같은 표현식 (# = private)
    color :string;
    constructor(color :string) {
      this.color = color;
    }
    select () {
      console.log("selected...")
      console.log(this.name);
    }
  }
  
  class Apple extends Fruits {
    constructor(color :string) {
      super(color);
    }
    showName() {
      console.log(super.name); //private는 자식 클래스에서 접근 불가
      console.log(super.color);
    }
  }
  
  const apple = new Apple("red");
  console.log(apple.name); //접근제한자가 private이므로 접근 불가
  console.log(apple.color);
  
  // 3. protected: 자식 class에서 접근 가능.
  
  class Score {
    protected math :number;
    english :number;
    constructor(english :number) {
      this.english = english;
    }
    sum() {
      return this.math + this.english;
    }
    avg() {
      const sum = this.sum();
      console.log('평균: ' + sum / 2);
    }
  }
  
  class Student extends Score {
    korean :number;
    constructor(math: number, english :number, korean :number) {
      super(math);
      super(english);
      this.korean = korean;
    }
    avg() {
      const sum = super.sum() + this.korean;
      console.log('평균: ' + sum / 3);
      console.log(super.math); //protected이기에 자식 클래스에서 접근 가능
    }
  }
  
  const student = new Student(80,70,60);
  student.avg();