프로토타입과 상속 { prototype, __proto__ }

• 자바에서는 extend 를 사용하여 상속(확장)을 만들었다. 
  
  js 에서는 프로토타입을 통해 부모와 자식 관계를 만들어 줄 수 있다. 
• __proto__ 는 모든 객체가 가지고 있는 속성이다. 
  
  prototype 은 함수 객체만 가지고 있다. 
  
  둘 다 부모를 가리키는 속성이다. 

function person() {

    this.eyes = 2;

}

let kim1 = new person();

let park1 = new person();

console.log(kim1.eyes);

// js 에서 function 은 객체처럼 취급이 된다.

// persno 이라는 funciton 이 eyes 라는 property 를 갖고 있는 형태가 된다.

// kim 과 park 이 각각 생성되면서 메모리 2개가 사용된다.

function person () {};

person.prototype.eyes = 2;

var kim2 = new person();

var park2 = new person();

console.log(kim2.eyes);

// person 의 프로토타입 객체는 한 번만 생성되므로 메모리에 1개만 사용된다

// 이게 무슨 말이냐면, person 이라는 function 개체의 prototype 은 1개가

// 생성된다. 그리고 이 prototype 을 kim2와 park2 가 참조하는 것이다.

// 그리고 kim 과 park 이 eyes = 2 라는 값을 공유해서 사용한다.

// 정확히 말하면 같은 메모리 주소를 참조하고 있다는 것을 의미한다.

// 말이 어려운데, 정리하자면 kim2.eyes 라는 것을 출력하려고 하면

// 출력이 되는 것을 알 수 있는데, 이것이 가능한 이유는 kim2 자체에는

// eyes 라는 값이 없는데, prototype 에 들어 있는 것은 참조가 가능하기 때문이다

// 따라서 메모리 사용을 줄이는 효과를 가져올 수 있다는 것이다.

 

• 프로토 타입에 있는 값을 잘 참조해서 사용한 것을 알 수 있다. 

 

const animal = {

    leg: 4,

    tail: 1

}

const dog = {

    sound: 'wang'

}

dog.__proto__ = animal; // __proto__ 를 사용하여 animal 을 부모로 지정

console.log(dog.leg);

console.log(dog.tail);

console.log(dog.sound);

 

• 여기서 재미있는 점은, 객체가 생성될 때 자동으로 prototype 이 생성되는데, 새로운 부모를 지정해줄 수 있다는 점이다. 위의 코드를 보면 __proto__ 를 사용하여 animal 객체를 dog 객체의 부모로 지정한 것을 볼 수 있다. 이렇게 되면 dog 는 animal 의 property 를 사용할 수 있게 된다.
• 말이 어려운데, 이런 것이다. dog 도 prototype 을 가지고 있는데, 이 prototype 을 dog 로 바꾸어 주는 코드가 dog.__proto__ = animal; 이었던 것이다. 결국 dog 의 prototype 이 animal 이 되었으니 dog 가 가지고 있지 않은 property 가 사용되면 자연스럽게 prototype 을 참조하게 되고 안에 있는 값을 사용하게 된다. 

 

 

const child = {

    age: 10

}

const parent = {

    firstName: '이',

    country: '한국'

}

child.__proto__ = parent;

child.__proto__.firstName = '김';

child.__proto__.country = '미국';

child.age = 20;

console.log(child.age);

console.log(child.firstName);

console.log(child.country);

 

• 위의 객체들은 모두 함수 객체가 아니었기 때문에 __proto__ 를 사용하여 값에 접근하였다. 
• 만약 함수 객체였다면 __proto__ 와 prototype 을 사용해 부모 객체에 접근할 수 있다. 
  
  음.. ? 
  
  왜 함수 객체는 2가지 방법이 있는 걸까? 쌤에게 여쭤보니 본인도 굳이 이렇게 만들어 놓은 이유를 모르겠다고 하신다. 추후에 알게되면 업데이트 하러 오겠습니다.