자료구조/알고리즘 - 프로토 타입

❓ 프로토타입이란?

• 어떠한 객체가 만들어지기 위해 객체의 모태가 되는 원형 (유전자라고 생각하면 쉬움)
• 자바스크립트는 일반적인 객체지향 언어와는 다르게, 프로토 타입을 이용한 복사를 통해 새로운 객체 생성
  • 사람으로 치자면 부모의 유전자를 받아 태어나는 것과 같다.
  • 그래서 부모 객체와 같은 유전자를 가지고 있기 때문에 부모 객체에 있는 프로토타입의 사용이 가능하다.
• 일반적인 객체 생성 방식 : 속성은 생성자, 메서드는 프로토타입에서 정의
  

  X라는 프로토 타입을 정의하면, Test 생성자 프로토 타입에 추가가 되고 객체를 생성하게 되면 test 객체도 함께 사용이 가능하다는 뜻이다.
  즉, Test ➡️ x 메소드 정의 ➡️ Test에 새로운 메소드 추가 ➡️ test 객체 생성 ➡️ test 객체의 프로토 타입은 Test와 같다

---

🤔 예를 들어 우리가 sort라는 함수를 만들어 둔 적이 없는데 어떻게 사용을 할 수 있는지에 대해 생각해 본적이 있나요?

사용할 수 있는 이유는 array에서 기본적으로 프로토 타입 안에 내장되어 있는 함수이기 때문에 사용이 가능합니다.

---

🤔 그렇다면, prototype을 직접 만들어 사용할 수 있나요?

기본적으로 내장되어 있는 prototype이 아닌 새롭게 만들어 사용이 가능합니다.

// 프로토 타입 함수를 생성하는 방법
Array.prototype.newFunc = function() {}

---

💡 예제를 통해 이해하기

function Person() {
    this.name = 'kim'
    this.age = 16
}

Person.prototype.gender = 'man'

Person이라는 생성자 함수를 만들어준다. (즉, 이 생성자 함수는 부모가 되는 것)
이 생성자 함수에 prototype.gender 메소드를 새로 생성하여 추가해 준다.

let nami = new Person
console.log(nami) // 출력 : Person { name: 'kim', age: 16 }

nami라는 객체를 생성했는데, 이 객체에는 따로 프로토 타입을 넣어주지 않았다.
그래서 예상 가능하게 Person { name: 'kim', age: 16 } 이 출력이 되었다.
하지만, nami.gender 로 접근해 본다면?

console.log(nami.gender) // man

man 이 출력 되었다.
왜 그럴까?
그 이유는 자식 object에 없으면 부모 object에서 까지 찾아 출력하기 때문이다.
자세히 설명하자면,

1. 직접 자료를 가지고 있으면 출력
2. 없으면 부모 object까지 찾음
3. 없으면 부모의 부모 object까지 찾음
4. 무한 반복

이러한 순서를 가지고 prototype을 찾게 된다.
이것을 프로토타입 체이닝이라고 한다.

---

✏️ 총정리

1. 프로토 타입은 기본적으로 내장되어 있는 함수가 있다.
2. 부모 객체에 있는 프로토 타입은 자식 객체도 사용할 수 있다. (체이닝)
3. 프로토 타입 함수를 직접 생성할 수 있다.