Section2 / Unit2 : 프로토타입과 클래스

✔︎ 자바스크립트는 흔히 프로토타입 기반 언어(prototype-based language)라 불린다

-> 모든 객체들이 메소드와 속성들을 상속 받기 위한 템플릿으로써 프로토타입 객체를 가진다는 의미

 

프로토타입(prototype)

• 원형 객체를 의미
• 객체는 프로퍼티를 가질 수 있는데 프로토타입이라는 프로퍼티는 그 용도가 약속되어 있는 특수한 프로퍼티
• 프로퍼티에 저장된 속성들은 생성자를 통해서 객체가 만들어질 때 그 객체에 연결

  

    
    
    
    
  
//예시
function Person() {...}

Person.prototype.eyes = 2;
Person.prototype.nose = 1;

let kim = new Person();
let Lee = new Person();

console.log(kim.eyes);  // 2

• 프로토타입을 쓰는 이유
  -> 프로토타입과 인스턴스 객체는 proto 프로퍼티를 가지고 있기 때문에 해당 프로퍼티를 통해 상위 프로토타입에 접근 가능
  -> 상위 프로토타입의 프로퍼티 및 메서드에 접근 가능
  -> 중복된 코드를 줄일 수 있고, 재사용성을 높일 수 있음

.__proto__

• 접근하고자 하는 객체의 내부 속성인 prototype을 노출하는 접근자 속성 함수
• 모든 객체는 __proto__를 통해 자신의 프로토타입([[Prototype]] 내부 슬롯)에 접근 가능

  

    
    
    
    
  
const apple = {};
const banana = {};

apple.__proto__ = banana;
banana.__proto__ = apple;

• 하지만 [[Prototype]] 내부 슬롯에는 직접 접근이 불가하다
  -> 프로토타입 체인의 단방향을 지키기 위해서
  -> 만약 직접 접근이 가능하다면, 서로가 서로의 프로토타입이 되면서 프로토타입 체인이 무한으로 돈다
  -> 따라서 __proto__ 프로퍼티로만 접근 가능

클래스, 인스턴스, 프로토타입의 관계

자바스크립트는 클래스를 지원하지 않지만 생성자를 통해 클래스와 동일하게 사용 가능하다

클래스 기반의 객체 지향 언어들은 모두 한 클래스에 속하는 여러 객체가 있을 수 있다

이런 객체를 class의 instances라고 한다

• instances property : 한 class에 속하는 instances들의 프로퍼티
• instances method : instances property와는 달리 instances만의 사본을 가지지 않는다
  대신 instances method는 class의 모든 instances가 공유한다.
• class property : instances와 관계 없는 class에만 속한 프로퍼티다.
  class와 연관되어 논리적인 보호 영역이 있다
• class method : instances와 무관하고 class 자체를 통해서만 호출된다

class method, class property -> 전역에서 접근 가능

class method는 특정한 객체에서 작동하는 것이 아니여서 class를 통하는 함수라고 생각하면 된다

이 둘은 자바스크립트 네임스페이스에서 보호영역이 있어서 충돌을 방지한다

class method를 정의하기 위해선 함수를 생성자 함수의 프로퍼티로 만들면 된다

 

참조

https://velog.io/@wool/Javascript-%ED%94%84%EB%A1%9C%ED%86%A0%ED%83%80%EC%9E%85%EA%B3%BC-%ED%81%B4%EB%9E%98%EC%8A%A4