TIL 프로토타입

프로토타입

js는 프로토타입 기반 언어이다.
여기서 프로토타입은 원형 객체를 의미한다

class Human { // human 이라는 클래스 생성
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  sleep() { //행동 메소드
    console.log(`${this.name}은 잠에 들었습니다`);
  }
}

let kimcoding = new Human('김코딩', 30); //인스턴스 객체 생성

1.Human.prototype.constructor === Human; // 결과는 무엇일까요? 
2.Human.prototype === kimcoding.__proto__; // 결과는 무엇일까요?
3.Human.prototype.sleep === kimcoding.sleep; // 결과는 무엇일까요? 

모든 객체들이 메소드와 속성들을 상속 받기 위한 템플릿으로써 프로토타입 객체(prototype object)를 가진다는 의미입니다. 프로토타입 객체도 또 다시 상위 프로토타입 객체로부터 메소드와 속성을 상속 받을 수도 있고 그 상위 프로토타입 객체도 마찬가지입니다. 이를 프로토타입 체인(prototype chain)이라 부르며 다른 객체에 정의된 메소드와 속성을 한 객체에서 사용할 수 있도록 하는 근간이다

정확히 말하자면 상속되는 속성과 메소드들은 각 객체가 아니라 객체의 생성자의 prototype이라는 속성에 정의되어 있다

kimcoding의 프로토타입 객체인 Human()에 정의된 name,age을 볼 수 있다.

객체의 prototype(Object.getPrototypeOf(obj)함수 또는 deprecated 된 proto (en-US)속성으로 접근 가능한)과 생성자의 prototype 속성의 차이를 인지하는 것이 중요, 전자는 개별 객체의 속성이며 후자는 생성자의 속성이다 이 말은 Object.getPrototypeOf(new Foobar())의 반환값이 Foobar.prototype과 동일한 객체라는 의미이다

//1. Human prototype constructor 는 아래와 같다
//Human 또한 아래와 같기 때문에 true
class Human {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  sleep() {
    console.log(`${this.name}은 잠에 들었습니다`);
  }
}

//2. kimcoding.__proto__;은 huamn.prototype과 동일하다
/* 
constructor: class Human
sleep: ƒ sleep()
[[Prototype]]: Object
*/
//3.human 의 sleep과 kimcoding.sleep은 동일