<aside>
✅ 자바스크립트는 프로토 타입 기반의 객체 지향 프로그래밍 언어다.
✅ 원시 타입의 값을 제외한 함수, 배열, 정규 표현식 등 자바스크립트를 이루고 있는 거의 모든 것이 객체이다.
</aside>
<aside>
</aside>
<aside>
상속을 통해 불필요한 중복을 제거하고, 기존의 코드를 재사용하여 개발 비용을 줄일 수 있다.
</aside>
// 생성자 함수
function Circle(radicus){
this.radius = radius;
this.getArea = function(){
// Mathe.PI는 원주율을 나타내는 상수이다.
return Math.PI * this.radius ** 2;
};
}
// 반지름이 1인 인스턴스 생성
const circle1 = new Circle(1);
// 반지름이 2인 인스턴스 생성
const circle2 = new Circle(2);
// Circle 생성자 함수는 인스턴스를 생성할 때마다 동일한 동작을 하는
// getArea 메서드를 중복 생성하고 모든 인스턴스가 중복 소유한다.
// getArea 메서드는 하나만 생성하여 모든 인스턴스가 공유해서 사용하는 것이 바람직하다.
console.log(circle.getArea === circle2.getArea); // false
console.log(circle1.getArea());
console.log(circle2.getArea());
get Area()메서드가 각 객체마다 개별적으로 생성되어 메모리 낭비
// 생성자 함수
functinon Circle(radius){
this.radius = radius;
}
// Circle 생성자 함수가 생성한 모든 인스턴스가 getArea 매서드를
// 공유해서 사용할 수 있도록 프로토타입에 추가한다.
// 프로토타입은 Circle 생성자 함수의 prototype프로퍼티에 바인딩 되어있다.
Circle.prototype.getArea = function(){
return Math.PI * this.radius ** 2;
};
// 인스턴스 생성
const circle1 = new Circle(1);
const circle2 = new Circle(2);
// Circle 생성자 함수가 생성한 모든 인스턴스는 부모 객체의 역할을 하는
// 프로토타입 Circle.prototype으로부터 getArea 매서드를 상속받는다.
// 즉, Circle 생성자 함수가 생성하는 모든 인스턴스는 하나의 getArea 메서드를 공유한다.
console.log(circle1.getArea === circle2.getArea); // true
console.log(circle1.getArea());
console.log(circle2.getArea());
getArea()메서드를 한번만 생성하고 모든 객체 공유
<aside>
두 코드를 비교했을 때.
<aside>
프로토타입 객체는 상속을 구현하기 위해 사용된다.
프로토타입은 어떤 객체의 상위(부모) 객체의 역할을 하는 객체로서 다른 객체에 공유 프로퍼티(메서드 포함)를 제공한다. 프로토타입을 상속받은 하위(자식)객체는 상위 객체의 프로퍼티를 자신의 프로퍼티처럼 자유롭게 사용할 수 있다.
</aside>
<aside>
모든 객체는 [[Prototype]]이라는 내부 슬롯을 가지며, 이 내부 슬롯의 값은 프로토타입의 참조다.
[[Prototype]] 에 저장되는 프로토타입은 객체 생성 방식에 의해 결정된다. 즉, 객체가 생성될 때 객체의 생성 방식에 따라 프로토타입이 결정되고 [[Prototype]]에 저장된다.
</aside>
객체와 프로토타입과 생성자 함수는 서로 연결되어있다.