내가 보려고 만든 개발 공부 일지

Javascript - 프로토타입? 본문

Javascript

Javascript - 프로토타입?

kwangsunny 2021. 7. 12. 23:10

Javascript 객체

먼저, 자바스크립트에서 객체란 무엇인지부터 간략히 정리해보자.

js 에서 모든 객체는 언제나 함수에 의해 생성된다.

function Person(){}    // 함수 정의
var kim = new Person() // 함수로 객체를 생성

이런식으로 말이다.

흔히 쓰는 var obj = {} 이런 코드도 함수랑 전혀 상관없어 보이지만 사실 var obj = new Object() 같은 코드다. (Object js 기본 함수)

Object 아니라 Function, Array 모두 마찬가지다 (new Function(), new Array())

, js에서는 기본타입인 number, string, boolean 과 특수값 null, undefined 빼고는 모두 객체다.

사용자가 정의한 함수도 객체, new 생성된 것도 객체.

 

 

Prototype

자바스크립트는 prototype 기반 언어이다. prototype으로 자바의 클래스처럼 상속을 흉내낼 있다.

(클래스 문법이 생기긴했지만 여전히 기반은 prototype이다.)

예제)

function Person(){}
Person.prototype.eyes = 2;
Person.prototype.nose = 1;

var kim = new Person();
var ham = new Person();

kim.eyes //-->  2
ham.eyes //-->  2
ham.nose //-->  1

예제에서 kim ham 둘다 eyes nose Person prototype 에서 정의해놓은 값을 그대로 쓸수 있게된다.

근데 만약 Person.prototype.eyes = 2 아니라

function Person(){ this.eyes = 2 } 이렇게 하면, new 통해 객체를 만들때마다 메모리에 eyes 할당되는데,

prototype은 eyes 값을 공유해서 쓰는것이기 때문에 메모리에 한번 할당되면 new 객체를 계속 생성해도 메모리에 계속 할당되지 않는다.

(생성된 객체들은 모두 자신을 만든 함수의 prototype 객체의 속성을 공유해서 수있다.)

 

상속을 흉내낸다는게 이렇게 값을 공유해서 쓰는 방식을 두고 말하는 것이다.

'Javascript' 카테고리의 다른 글

Javascript - Prototype object  (0) 2021.07.16
Javascript - in vs hasOwnProperty  (0) 2021.07.12
call() 과 apply() 의 this 바인딩  (0) 2021.07.02
Falsy / Truthy 한 값  (0) 2021.07.02
Tagged Templates  (0) 2021.07.02
Comments