일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- APPEND
- var
- css기초
- IT
- AWS
- let
- node.js
- 메모이제이션
- prototype
- 생활코딩
- scope
- complexity
- 개발툴
- AWS기초
- Big-O notation
- flex기본
- 클로저
- CSS
- 재귀함수
- 기초공부
- 원본과 복사본
- AWS조사
- 리커젼
- vscode
- node.js설치
- 인터프리터
- JavaScript
- 코드스테이츠
- 스코프
- appendChild
- Today
- Total
Jveloper
__proto__, constructor, prototype 본문
Prototype Object와 Prototype Link를 제대로 구분하여 인지하자
자바스크립트에는 클래스라는 개념이 없고 대신 프로토타입이라는것이 존재한다
자바스크립트가 프로토타입기반 언어라고 불리는 이유이다
클래스가 없으니 상속기능도 없다, 그래서 프로토타입을 기반으로 상속을 흉내내도록 구현해 사용한다
● Prototype Object
객체는 언제나 함수로 생성된다
function Person() {} // -> 함수
var personObject = new Person(); // -> 함수로 객체를 생성
이렇듯 언제나 객체는 함수에서 시작된다
var obj = {};
// 이 코드는 사실 다음코드와 같다
var obj = new Object();
Object와 마찬가지로 Function, Array도 모두 함수로 정의되어있다
함수가 정의될때는 2가지 일이 동시에 이루어진다
1. 해당 함수에 Constructor(생성자) 자격 부여
Constructor 자격이 부여되면 new를 통해 객체를 만들어 낼 수 있게된다
이것이 함수만 new 키워드를 사용할 수 있는 이유이다
2.해당 함수의 Prototype Object 생성 및 연결
함수를 정의하면 함수만 생성되는 것이 아니라 Prototype Object도 같이 생성이 된다
그리고 생성된 함수는 prototype이라는 속성을 통해 Prototype Object에 접근할 수 있다
Prototype Object는 일반적인 객체와 같으며 기본적인 속성으로 constructor와 __proto__를 가지고 있습니다.
constructor는 Prototype Object와 같이 생성되었던 함수를 가리키고 있다
__proto__는 Prototype Link이다
Prototype Object는 일반적인 객체이므로 속성을 마음대로 추가/삭제 할 수 있다
생성자함수를 통해 생성되었다면 Person.prototype을 참조할 수 있게 된다
함수가 정의될 때 이루어지는 일들을 이해하는 것
Prototype Object를 이해하는 것
● Prototype Link
prototype 속성은 함수만 가지고 있던 것과는 달리
__proto__속성은 모든 객체가 빠짐없이 가지고 있는 속성이다
__proto__속성을 통해 상위 프로토타입과 연결되어 있는 형태를 프로토타입 체인이라 한다
이런 프로토타입 체인구조로 인해 모든 객체는 Object의 자식이라 불린다
__proto__와 프로토타입 체인을 이해하는것
ES6문법을 쓰면 Class문법이 있다
그러나 문법만 있지, 자바스크립트가 클래스 기반이 된것은 아니다
다음에는 ES6클래스를 정리할예정이다
참고자료 : https://medium.com/@bluesh55/javascript-prototype-%EC%9D%B4%ED%95%B4%ED%95%98%EA%B8%B0-f8e67c286b67 : 프로토타입 이해
'JavaScript' 카테고리의 다른 글
Recursion(재귀 함수) (0) | 2019.05.07 |
---|---|
Prototype (0) | 2019.05.07 |
Closure (0) | 2019.04.25 |
Scope (0) | 2019.04.23 |
Node.appendChild 와 Node.prepend (0) | 2019.04.15 |