본문 바로가기
📙 자바스크립트 공부

[js] 프로토타입이란? / 프로토타입 체인

by 따따시 2023. 1. 15.

프로토타입이란?

prototype은 '유전자'라고 생각하면 됌 (코딩애플 쌤이 말해주신 설명 ㅎㅅㅎ)
 
function 기계(x = "x기본값", y = "y기본값") {
  this.q = x;
  this.w = y;
}

// 콘솔창에 기계.prototype이라고 찍어보면
// 우리도 모르게 비밀공간이 생겨있음
// prototype은 '유전자'라고 생각하면 됌
기계.prototype.name = "kim";
//이 유전자에 먼가를 추가하면, 그 아래 자식들도 다 갖고있음

var nunu = new 기계("달리기", "말하기");
console.log("nunu", nunu);
// 실제로 nunu를 찍어보면 결과값은
// { q: '달리기', w: '말하기' } 이렇게 뜨지만
console.log("nunu.name", nunu.name);
//이렇게 nunu.name을 치면 유전자속에(프로토타입) 있는 name을 발견할 수 있음

 

코딩애플 강의 캡쳐화면

 

 

nunu가 실제로 자기가 쥐고있지도 않은 name이 출력될 수 잇는 원리가 뭘까?

=> 자바스크립트 작동원리!!!

자바스크립트는 nunu.name이라고 명령하면 첨에 nunu한테서 찾지만 없으면, 그 유전자까지 뒤지러감(프로토타입)

(자바스크립트가 오브젝트를 꺼낼때 여러 스탭이 있다고 보면 된다)

 

<자바스크립트가 옵줵에서 자료 뽑을때 순서> = 프로토타입 체인
1.직접 자료를 갖고있으면 그걸 출력
2.없으면 부모유전자까지 뒤진다.
3. 없으면 부모의 부모까지 가버림

 

요런 개념으로 prototype이 자주 등장하는 걸 이해할 수 있음 ㅎㅅㅎ

 

 

 

 

 

프로토타입을 이용해서

만약 내가 모든 array자료에서 자주쓰고싶은 함수가 생기면??

댓글