[javascript] 프로토타입 vs 클래스 기반 상속 언어

11 Dec 2023

javascript

프로그래밍 언어에서 상속(inheritance)은 코드를 재사용하고 구조를 유연하게 하는 중요한 기능입니다. 자바스크립트와 같은 몇몇 언어에서는 프로토타입 기반 상속을 사용하고, 다른 언어들은 주로 클래스 기반 상속을 사용합니다. 이러한 두 가지 접근 방식은 어떻게 다를까요? 이번 글에서는 두 가지 접근 방식의 장단점을 살펴봅니다.

프로토타입 언어

프로토타입 기반 언어에서는 객체가 상속을 담당합니다. 모든 객체는 다른 객체를 참조하는 내부 링크인 프로토타입을 가지고 있습니다. 만약 어떤 속성이나 메소드를 찾을 수 없을 때, JavaScript는 프로토타입 체인을 따라 위로 이동하여 해당 속성이나 메소드를 찾습니다.

아래는 JavaScript에서 프로토타입을 활용한 상속의 예시입니다:

function Animal(name) {
  this.name = name;
}
Animal.prototype.sayName = function () {
  console.log("My name is " + this.name);
};

function Dog(name, breed) {
  Animal.call(this, name);
  this.breed = breed;
}
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;
Dog.prototype.bark = function () {
  console.log("Woof!");
};

let myDog = new Dog("Fido", "Golden Retriever");
myDog.sayName(); // "My name is Fido"
myDog.bark(); // "Woof!"

위 예시에서 Dog 함수는 Animal을 상속받도록 설정되었습니다. Object.create를 사용하여 Dog의 프로토타입을 Animal의 프로토타입으로 설정합니다.

클래스 기반 언어

클래스 기반 언어에서는 클래스가 상속을 정의합니다. 자바, C++, Python과 같은 언어들이 이러한 방식을 사용합니다. 객체지향 프로그래밍(OOP)에서 클래스는 속성과 메소드를 정의하고, 이러한 클래스들은 상속 관계를 형성합니다.

아래는 TypeScript에서 클래스를 활용한 상속의 예시입니다:

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

  sayName() {
    console.log("My name is " + this.name);
  }
}

class Dog extends Animal {
  constructor(name, breed) {
    super(name);
    this.breed = breed;
  }

  bark() {
    console.log("Woof!");
  }
}

let myDog = new Dog("Fido", "Golden Retriever");
myDog.sayName(); // "My name is Fido"
myDog.bark(); // "Woof!"

위 예시에서 Dog 클래스는 Animal 클래스를 확장하여 상속받습니다. extends 키워드를 사용하여 Dog 클래스가 Animal 클래스를 상속받도록 설정합니다.

결론

프로토타입 기반 언어와 클래스 기반 언어는 객체 지향 프로그래밍의 상속을 구현하는 두 가지 주요 접근 방식입니다. 각각의 방식은 각자의 장단점을 가지고 있으며, 개발자는 해당 언어의 특성을 고려하여 상속 방식을 선택해야 합니다.

프로토타입 기반 언어는 동적이고 유연하며, 코드를 재사용하기 용이합니다. 반면에, 클래스 기반 언어는 구조화된 형태를 가지며, 상속을 명시적으로 정의할 수 있습니다.

따라서, 개발자는 각 방식의 특징을 이해하고, 해당 언어에 적합한 상속 방식을 채택해야 합니다.

참고 문헌:

[MDN Web Docs

Inheritance and the prototype chain](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain)

TypeScript Handbook - Inheritance

Keywords: 프로토타입, 클래스, 상속, 자바스크립트, TypeScript