객체 지향 JavaScript — 집계 및 상속

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

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

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

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

이 기사에서는 JavaScript의 객체 지향 부분을 살펴보겠습니다.

집합

여러 개체를 새 개체로 결합하는 기능을 집계 또는 구성이라고 합니다.

여러 개의 작은 개체가 하나의 큰 개체보다 관리하기 쉽습니다.

JavaScript를 사용하는 방법에는 여러 가지가 있습니다.

확산 연산자 또는 Object.assign 메서드를 사용하여 여러 개체를 하나로 결합할 수 있습니다.
Object.assign 메서드를 사용하려면 다음과 같이 작성할 수 있습니다.

const obj1 = {
  foo: 1
}
const obj2 = {
  bar: 2
}
const obj3 = {
  bax: 3
}

const merged = Object.assign({}, obj1, obj2, obj3);

우리는 3개의 객체를 가지고 있으며 그것들을 모두 Object.assign에 전달하여 함께 병합하고 모든 속성을 가진 새 객체를 반환할 수 있습니다.

또한 다음과 같이 작성하여 스프레드 연산자를 사용할 수 있습니다.

const obj1 = {
  foo: 1
}
const obj2 = {
  bar: 2
}
const obj3 = {
  bax: 3
}

const merged = {
  ...obj1,
  ...obj2,
  ...obj3
};

이렇게 하면 3개의 개체도 함께 결합됩니다.

개체를 집계하는 또 다른 방법은 다른 개체의 속성으로 가짐으로써 자식 개체를 갖는 것입니다.

예를 들어 Book 개체는 여러 Author 개체, Publisher 개체, Chapter 개체 등을 가질 수 있습니다.

계승

상속은 기존 코드를 재사용할 수 있는 우아한 방법입니다.

우리는 객체를 생성하고 직접 상속할 수 있습니다.

그리고 우리는 서브클래스로 JavaScript 클래스를 생성할 수 있습니다.

클래스와 하위 클래스는 부모 및 자식 생성자 함수에 대한 구문 설탕입니다.

다른 객체를 프로토타입으로 사용하는 객체를 생성하려면 Object.create 메서드를 사용할 수 있습니다.

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

const obj = {
  foo: 1
}

const child = Object.create(obj);

그런 다음 child는 foo에서 obj 속성을 상속합니다.

대부분의 객체는 명시적으로 상속하지 않는 경우 프로토타입으로 Object.prototype를 갖습니다.
extends 키워드로 서브클래스를 생성할 수 있습니다.

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

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

  eat() {
    //...
  }
}

class Author extends Person {
  constructor(name, genre) {
    super(name);
    this.genre = genre;
  }
}

부모 클래스인 Person 클래스가 있습니다.

그리고 Author 클래스는 Person 클래스를 상속합니다.

모든 인스턴스 변수와 메서드는 상속됩니다.

따라서 name 속성을 얻고 eat 인스턴스로 Author 메서드를 호출할 수 있습니다.
super  로 부모 생성자를 호출합니다.

또한 부모 클래스 속성과 메서드에 액세스할 수도 있습니다.

우리는 쓸 수있다:

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

  eat() {
    //...
  }
}

class Author extends Person {
  constructor(name, genre) {
    super(name);
    this.genre = genre;
  }

  eat() {
    super.eat();
  }

  write() {
    console.log(`${super.name} is writing`)
  }
}

Person의 eat 메서드를 호출했습니다.

그리고 우리는 Person 와 함께 name 인스턴스의 super.name를 얻습니다.

결론

우리는 여러 형태로 개체를 집계할 수 있습니다.

그리고 객체와 생성자/클래스는 각각 다른 객체와 생성자/클래스로부터 상속받을 수 있습니다.