[Javascript] 프로토타입과 클래스

코드스테이즈 41기 교육 내용을 정리하고 있습니다.
틀린 부분이 있으면 댓글로 알려주시면 감사하겠습니다.

 

🐘프로토타입과 클래스

---

JavaScript는 프로토타입 기반 언어 입니다. 여기서 프로토타입(Prototype)은 원형 객체를 의미합니다.

https://developer.mozilla.org/ko/docs/Learn/JavaScript/Objects/Object_prototypes

Object prototypes - Web 개발 학습하기 | MDN

MDN문서를 읽고 이해가 잘 가지 않았다.

다른 블로그 포스팅을 보고 좋은 비유가 있어서 가져왔다.

• prototype (부모입장) : 유전자 : 자손에게 넘겨주고픈 메서드, 변수를 정의 한다
• _proto_ (자식입장) : 내가 받은 유전자 접근하기, 부모에게 유전받은 prototype을 참조할수 있다.

🦏실습

---

class Human {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

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

let steve = new Human('steve', 20);

console.log(Human.prototype);    //a
console.log(steve.__proto__);        //b

console.log(Human.prototype.constructor);    //c
console.log(Human.prototype.sleep === steve.sleep);    //d

a와 b는 동일하게 부모의 유전자 즉, prototype값을 보여준다
Human.prototype === Lee.__proto__를 입력하면 true가 반환된다

 

c는 human class가 나온다.
Human.prototype.constructor === Human를 입력하면 true가 반환된다.

 

d는 ture를 반환한다.

 

다음을 정리하면 그림과 같다.

🐾참고

---

https://www.youtube.com/watch?v=wUgmzvExL_E

https://intrepidgeeks.com/tutorial/understand-prototype-and-proto-1