[SEB] Today I Learn

Chipmunk_jeong·2021년 4월 18일
0

TIL

목록 보기
43/62
post-thumbnail

Prototype Object


자바스크립트는 Prototype기반의 언어이다.
JavaScript에서 함수가 정의될 때는 Constructor가 부여된다.
생성자가 부여된 함수는 new키워드를 통하여 생성할 수 있게 된다.
그리고 Prototype Object가 생성되고 이 함수를 통해 만드는 오브젝트와 Prototype 속성이 연결된다.

function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.sayHello = function() {
  console.log('hello!');
};

Person.prototype은 어떤 Prototype Object(원형객체)와 연결이 되어있다. 위 코드에서 Person.prototype.sayHello를 정의한다면 어떠한 원형객체에 sayHello라는 속성을 추가한것이고 Person은 이 원형객체와 연결되어있기때문에 sayHello를 사용할 수 있다.




Prototype Link


function Person() {}

Person.prototype.name = 'quakka'
Person.prototype.age = 29;

let quakka = new Person();
console.log(quakka.name); // 'quakka'

위의 코드에서 quakka라는 인스턴스는 아무것도 정의가 안된 Person에서 만들어진 객체인데 name이라는 속성을 가지고 있다.
그리고 위의 코드에서 prototypename속성을 정의를 했다.
이것이 prototype Link라는 개념이다. quakka를 콘솔에 찍어보자.

위에 보면 __proto__라는 속성을 볼수 있다.
이는 자신을 생성했던 함수의 속성들을 가르킨다.
마치 부모의 DNA를 자식이 물려받은것처럼...
즉, quakka.name의 속성은 부모인 Person.prototype에 정의된 name속성을 가르킨다.

이런식으로 데이터들은 연결이 계속적으로 중첩되어있다.
이것이 JavaScript를 prototype기반 언어라고 부를수있는 이유이다.

Prototype만으로 블로깅을 몇십개를 적을 수 있을정도로 많은 개념을 담고 있다. 앞으로도 꾸준히 공부를 하며 Prototype에 대하여 블로깅을 해보겠다

profile
Web Developer

0개의 댓글