-
[Javascript] - 프로토타입(prototype)Programming/Javascript 2019. 4. 8. 16:04
- Prototype(프로토타입) -
- Prototype(프로토타입)의 정의
- 객체지향언어의 특징인 Class라는 개념을 대체하는 Javascript의 문법
- Javascript에는 Class라는 개념이 없었지만 최근 ES6문법에 Class가 추가되었다
- 다른 객체지향언어(ex.Java, Python)의 상속이라는 개념을 Javascript에서는 Prototype(프로토타입)으로 구현할 수 있다
- Javascript가 프로토타입 기반 언어라고 불리는 이유는 Prototype문법이 있기 때문이다 - Prototype(프로토타입)의 이해를 위한 예제
1234567891011<-------------------------------------------------------------------------------------->function Person() {};Person.prototype.eyes = 2;Person.prototype.nose = 1;var kim = new Person();var park = new Person():console.log(kim.eyes); // => 2console.log(park.nose); // => 1cs - Person.prototype이라는 빈 Object가 메모리 어딘가에 존재
- Person 함수로 생성된 객체인 kim과 park은 메모리 어딘가에 존재하는 Object의 들어있는 값을 참조하여 사용할 수 있다
- Prototype Object / Prototype Link -
- Prototype Object
- 객체(Object)는 항상 함수로 생성된다
1234<-------------------------------------------------------------------------------->function Person() {} // => 함수var personObject = new Person(); // => 함수로 객체를 생성cs - personObject라는 객체는 Person함수로 생성되었다
- 객체는 항상 함수에서 생성이 된다
- 함수가 정의될 때 생기는 일 2가지
1. Constructor(생성자) 자격 부여
- Constructor 자격이 부여되면 new로 객체를 생성할 수 있다
- 함수만 new 키워드를 사용할 수 있는 이유이다
2. 해당 함수의 Prototype Object생성 및 연결
- 함수가 정의되면 메모리상에 함수와 Prototype Object 두개가생성된다
- 생성된 함수는 Prototype 속성으로 Prototype Object에 접근할 수 있다
- Prototype Object는 기본적인 객체와 같으며 속성으로 Constructor와 __proto__를 갖고있다
- Constructor는 Prototype Object와 같이 생성된 함수를 가리킨다
- 쉽게 말해서 생성자가 무엇인지 가리키는 역할을 한다
- __Proto__
123456789101112<-------------------------------------------------------------------------------------->function Person() {};Person.prototype.eyes = 2;Person.prototype.nose = 1;var kim = new Person();var park = new Person():console.log(kim.eyes); // => 2console.log(park.nose); // => 1cs - 위의 예제에서 kim과 park이라는 객체는 eyes와 nose라는 속성을 가지고있지 않다
- 그치만 kim.eyes와 park.nose등 Person.prototype이 가지는 속성에 접근할 수 있는게 __proto__때문이다
- 위의 그림처럼 __proto__라는 속성이 Prototype Object를 가리키고 있기 때문이다
- __proto__는 나를 생성한 부모를 가리키게되고 그러므로 그 부모의 속성들에 접근할 수 있는 것이다
'Programming > Javascript' 카테고리의 다른 글
[Javascript] - N-Queens 구현하기 (0) 2019.04.12 - Prototype(프로토타입)의 정의