[Javascript] 프로토타입(1) 객체지향 프로그래밍과 상속

들어가기에 앞서,

객체지향 프로그래밍이 뭔지를 먼저 알아보자.

 

🧱객체지향 프로그래밍

프로그램을 여러 개의 독립적 단위(= 객체)의 집합으로 표현하려는 프로그래밍 페러다임

 

객체는 각자 속성을 가지고 있고, 이를 통해 인식이나 구별을 할 수 있다.

예를 들어, 사람은 이름, 성별, 나이, 성격 등의 다양한 속성을 가지고 있다. 이러한 속성을 구체적으로 '이름은 김자바고 나이는 20살이고 성별은 여자인 사람' 이라고 하면 특정한 사람을 구별해서 인식할 수 있다.

 

이런식의 방식을 프로그래밍에 접목시키면 다양한 속성들 중에서 프로그램에 필요한 속성만을 간추려 내는 것을 추상화라고 한다. 

const person = {
  name: 'Kim',
  address: 'Seoul'
}

이런식으로 속성을 통해 여러 개의 값을 하나의 단위로 구성한 자료구조를 객체라고 한다.

이때 독립적인 객체의 집합으로 프로그램을 표현하려는 게 객체지향 프로그래밍이다.

 

---

여기서, 자바스크립트는 객체지향 프로그래밍 언어라고 할 수 있을까?

→⭕

왜냐하면 자바스크립트를 이루고 있는 거의 모든 것이 객체이기 때문이다.(원시값 제외)

(당장 위의 코드도 자바스크립트고 객체를 나타냄 + 함수, 배열, 정규 표현식 모두 객체임)

 

const circle = {
  // 반지름: 상태를 나타냄, 프로퍼티
  radius: 5,
  
  // 지름 구하기: 동작, 메서드
  getDiameter() {
    return 2 * this.radius
  }
}

이런식으로 원을 나타내는 객체 안에 원의 상태를 나타내는 데이터인 반지름(radius)과 원의 지름을 구하는 동작(getDiameter)이 들어가 있을 때, 상태를 나타내는 것을 프로퍼티 / 동작은 메서드라고 부른다.

 

즉, 객체는 상태 데이터와 동작을 하나의 논리적인 단위로 묶은 복합적인 자료구조라고 할 수 있다.

 

---

생성자 함수를 통해 객체를 만드는 예시를 한 번 살펴보자

function Circle(radius) {
  this.radius = radius;
  this.getArea = function () {
    return Math.PI * this.radius ** 2;
  };
}

const circle1 = new Circle(1);
const circle2 = new Circle(2);

이런식으로 메서드를 포함한 객체를 여러개 생성한다고 해보자.

이때, 인스턴스마다 다른 프로퍼티를 갖기 때문에 

console.log(circle1.getArea == circle2.getArea)

해당 결과는 false가 나올 것이다.

하지만, getArea 메서드는 동일한 내용의 메서드이므로 위처럼 각 인스턴스마다 가지고 있다면 메모리가 불필요하게 낭비되고 인스턴스를 생성할 때마다 메서드 또한 생성되므로 퍼포먼스에도 악영향을 준다.

이를 해결하기 위해서 상속을 사용할 수 있다.

 

➰상속

자바스크립트는 프로토타입을 기반으로 상속을 구현한다.

위의 예시를 상속을 기반으로 다시 써보면 아까의 결과가 true가 되는 것을 확인할 수 있다.

function Circle(radius) {
  this.radius = radius;
}

Circle.prototype.getArea = function () {
  return Math.PI * this.radius ** 2;
};

const circle1 = new Circle(1);
const circle2 = new Circle(2);

console.log(circle1.getArea == circle2.getArea);   // true

 

여기서 Circle 생성자 함수를 통해 생산된 인스턴스는 자신의 프로토타입(Circle.prototype)의 모든 프로퍼티와 메서드를 상속 받는다.

 

상속을 이용해 모든 인스턴스가 공통적으로 사용할 프로퍼티나 메서드를 미리 프로토타입에 구현해두면 인스턴스들이 공유하여 사용할 수 있으므로 코드를 재사용할 수 있다는 점에서 유용하다.