클래스 이해하기

클래스와 메소드

• 클래스 : 객체를 위한 청사진으로 class키워드로 정의된다. 프로퍼티와 메소드를 가질 수 있다.
• 프로퍼티 : 클래스에 정의한 변수
• 메소드 : 클래스에 정의한 함수

class Person{ // 클래스
  constructor() { // 메소드
    this.name = 'Max'; // 프로퍼티
  }
  
  printMyName() {
    console.log(this.name);
  }
}

클래스 상속

클래스는 다른 클래스에 있는 프로퍼티와 메소드를 상속받을 수 있다. 상속받으면 잠재적으로 새로운 프로퍼티와 메소드를 추가한다는 뜻이 된다.

class Human { // 상위 클래스
  constructor() {
    this.gender = 'male';
  }
  
  printGender() {
    console.log(this.gender);
  }
}


class Person extends Human { // Human을 상속받음
  constructor() { // 메소드
    this.name = 'Max'; // 프로퍼티
  }
  
  printMyName() {
    console.log(this.name);
  }
}

  const person = new Person();
  person.printMyName();
  person.printGender();

결과값

super()

서브 클래스에서는 super() 생성자를 먼저 호출해야 한다. 만약 클래스를 확장하고 생성자를 실행한다면 상위클래스를 초기화해야하기 때문이다.

class Human {
  constructor() {
    this.gender = 'male';
  }
  
  printGender() {
    console.log(this.gender);
  }
}


class Person extends Human {
  constructor() { 
    super();
    this.name = 'Max';
    this.gender = 'female'; // 새로 추가한 프로퍼티
  }
  
  printMyName() {
    console.log(this.name);
  }
}

  const person = new Person();
  person.printMyName();
  person.printGender();

결과값

Human클래스의 printGender()을 호출했지만 super()에 의해 상위클래스가 초기화돼서 결국 person클래스에서 확장되었기 때문에 해당 결과값이 도출된다.