객체 지향 JavaScript — 클래스 상속

https://www.amazon.com/John-Au-Yeung/e/B08FT5NT62에서 Amazon에서 내 책을 확인하십시오.

지금 http://jauyeung.net/subscribe/에서 내 이메일 목록을 구독하십시오.

JavaScript는 부분적으로 객체 지향 언어입니다.

JavaScript를 배우려면 JavaScript의 객체 지향 부분을 배워야 합니다.

이 기사에서는 JavaScript 하위 클래스, 믹스인 및 다중 상속을 살펴보겠습니다.

서브클래싱

JavaScript 클래스에서 하위 클래스를 만들 수 있습니다.

예를 들어 다음과 같이 작성할 수 있습니다.

class Animal {
  constructor(name) {
    this.name = name;
  }

  speak() {
    console.log(`${this.name} speaks`);
  }
}

class Dog extends Animal {
  speak() {
    console.log(`${this.name} woofs`);
  }
}

const mary = new Dog('mary');

Animal 클래스를 생성합니다.
speak 메서드는 Animal 클래스에 있습니다.
Animal 메서드가 있는 Dog라는 speak의 하위 클래스를 만들었습니다.
Dog 인스턴스를 생성하면 speak의 Dog 메서드가 사용됩니다.

따라서 다음과 같이 작성하면

mary.speak();

우리는보다:

mary woofs

클래스의 수퍼클래스에 액세스하는 방법에는 여러 가지가 있습니다.
super()를 호출하여 슈퍼클래스를 호출하고 부모 생성자의 인수를 전달할 수 있습니다.

또한 super.<parentClassMethod>를 호출하여 부모 클래스의 메서드를 호출할 수 있습니다.
super.<parentClassProp>를 사용하면 상위 클래스 속성에 액세스할 수 있습니다.

따라서 다음이 있는 경우:

class Parent {}

class Child extends Parent {
  constructor(name) {
    this.name = name;
  }
}

const child = new Child('james')

오류가 발생합니다.

Uncaught ReferenceError: Must call super constructor in derived class before accessing 'this' or returning from derived constructor

이는 super 의 속성을 설정하기 전에 부모 생성자를 호출하기 위해 먼저 this 를 호출해야 하기 때문입니다.
constructor에서 Child를 생략하면 암시적으로 수행할 수 있습니다.

우리가 가지고있는 경우 :

class Parent {}

class Child extends Parent {}

const child = new Child()

그러면 기본 생성자가 제공되므로 오류가 발생하지 않습니다.

기본값은 다음과 같습니다.

constructor(...args) {
  super(...args);
}

믹신

JavaScript는 단일 상속만 지원하므로 표준 JavaScript 구문을 사용하여 여러 클래스의 속성을 상속할 수 없습니다.

대신, 우리는 여러 클래스를 기능이 있는 하나로 구성해야 합니다.

우리는 쓸 수있다:

class Person {}

const BackgroundCheck = Tools => class extends Tools {
  check() {}
};

const Onboard = Tools => class extends Tools {
  createEmail() {}
};

class Employee extends BackgroundCheck(Onboard(Person)) {}

BackgroundCheck 클래스의 하위 클래스를 반환하는 Tools 클래스가 있습니다.

따라서 Person는 Tools 함수에서 Onboard입니다.

그리고 Onboard(Person)는 Tools 함수에서 BackgroundCheck입니다.

이런 식으로 check 및 createEmail 메서드가 모두 있는 클래스를 반환하고 결과 클래스를 사용하여 Employee 하위 클래스를 만들 수 있습니다.

결론

extends 키워드로 서브클래스를 생성할 수 있습니다.

또한 클래스를 반환하는 함수를 만들고 여러 클래스에서 상속할 수 있도록 구성할 수 있습니다.