프로토타입&프로퍼티가 헷갈린다면

binu·2023년 2월 26일
0
post-thumbnail

혹시 OOP를 공부한 적 있고, 이해가 된 상태라면 일반적인 OOP의 용어를 JavaScript의 프로토타입과 프로퍼티에 대입해보는 것도 하나의 방법이 될 것 같다.

프로토타입과 프로퍼티 개념?

프로토타입 (Prototype)

📖 사전적 정의

프로토타입은 개발 사이클의 초기 단계에서 제품 혹은 어플리케이션의 외형이나 동작을 보여줄 수 있는 모델을 의미한다.

🤓 공부 내용을 바탕으로 정리한 정의

한 단어로 요약하자면 '클래스(Class)' 느낌.
Javascript에서 프로토타입이란, 어떠한 객체(=개념)를 설계할 수 있는 수단이며 객체의 설계도(객체의 설계도 = js에서의 클래스)를 "상속" 받을 수 있는 메커니즘이다.

또한 객체의 프로토타입에 액세스하는 방법은 아래와 같다.

  • obj.__proto__
  • Object.getPrototypeOf(obj)

프로퍼티 (Property)

📖 사전적 정의

속성은 키와 값을 연결하는 객체의 구성원이며, JavaScript 객체는 속성 모음을 저장하는 데이터 구조이다.

🤓 공부 내용을 바탕으로 정리한 정의

자바 등 일반적인 OOP의 개념에서의 "멤버변수 (member variable)"와 같은 맥락이다. 참고로 멤버변수는 특정 개체와 연결되고 해당 메서드(멤버함수)에 액세스할 수 있는 변수이다. 여기에서 '특정 개체'를 '프로토타입'으로 치환하니 자바스크립트에서의 프로토타입과 프로퍼티 정의가 딱 정리되었다.


프로토타입, 프로퍼티 개념 이젠 확실해

    이번주에는 JS 토이프로젝트 과제 미션을 마무리하고, 자바스크립트의 핵심 내용을 정리한 강의를 들으며 정리했다. 이번주에 들은 이 강의로 정리한 개념들이 있는데, 그중에서도 이 내용은 머리에 💡가 켜지며 솔직히 이전에 '흠... 흐음... 음... 일단 그렇군. 이대로 기억은 하고 넘어가자'한 내용이었고, 이제는 명확하게 이해하게 되었다고 생각한다.
  OOP 공부했던 내용이 이 부분을 이해하는 데에 도움이 될 줄이야. OOP를 공부한 경험이 이해에 영향을 주는지는 사람마다 다르겠지만, 나는 일반적인 OOP 용어로 js에 적용하여 설명된 내용을 듣는데 딱 이해가 되어 고마웠다.
  그런 김에 이 공간에 기록해두는 이번주 공부기록이다. 다음 새로운 한 주도 공부로 화이팅팅이다!

참고

📚 Prototype 정의
📚 Object prototypes
📚 Property 정의
📚 멤버변수 사전적 정의

profile
예비 프론트엔드 개발자, 아기 binu

0개의 댓글