독도갈매기의 개발 블로그

[JS] 자바스크립트가 어려운 이유 Prototype 편 -끝- 본문

Javascript

[JS] 자바스크립트가 어려운 이유 Prototype 편 -끝-

독도갈매기 2020. 9. 24. 23:01

이 포스팅은 이어지는 포스팅입니다. 전편을 먼저 읽고 오시는 것을 권장드립니다.

Prototype Object

먼저 저번 코드를 가져오면

let Person = () => {}

let kim = new Person()

저희는 Person이라는 함수를 만들었고 이때 일어나는 일을 그림을 나타낸다면 ↓

상호참조

위 그림처럼 저희는 Person이라는 함수를 하나 정의했지만 실제 JS에서는
function Person() {}하나와 Person Prototype Obejct하나 총 두개가 만들어지죠
그걸로 끝나는 것이 아닌 Person의 property인 prototype은 Person Prototype Obejct의 constructor를 가르킵니다.
그와 반대로 Person Prototpye의 property인 constructor는 Person을 가르킵니다.

prototype(Person) -> constructor(PPO) -> Person
이런 현상을 Person과 Person Prototype Obejct가 상호참조한다고 합니다.

Prototype Link

코드를 조금 수정했습니다.

let Person = (name) => {
    this.name = name;
}

let kim = new Person("김철수");
let hong = new Person("홍길동");

console.log(kim.age);
console.log(hong.age);

__proto__

저번 글에서 설명했던 것이 Prototype Link가 있기에 이루어질수 있는 개념인것이죠
__proto__이 Person Prototype Obeject를 가르키기에 인스턴스에 없는 property라면 상속받아 사용하는 것입니다
이러한 개념이 Prototype Link의 개념입니다.

어떠셨나요? 처음으로 2편으로 찢어 글을 적었는데 도움이 되는 글이었나요?
도움이 되셨다면 다행이고 잘못된 개념이 있다면 아쉬움이 많이 남는 글이었던 것 같습니다.
이번 글을 작성하면서 몇일동안 고민해가며 글을 적어나갔는데 제 자신에게는 많은 도움이 된 것 같아
뿌듯합니다. 다음에도 잘 정리된 포스팅으로 찾아 뵙겠습니다. 감사합니다.

Comments