본문 바로가기

프로그래밍/JavaScript

[JavaScript 요약 정리] 10. 생성자(Constructor) 함수

10. 생성자(Constructor) 함수

1) 생성자 함수 개요

- 자바의 클래스와 생성자 개념을 사용할 수 있는 함수

- 자바스크립트에도 클래스 체계가 추가되었지만 활용하지 않음

-> 생성자 함수를 구현해서 사용

- 생성자의 첫 글자는 대문자로 만드는게 관례


2) 생성자 함수 생성

- 생성 양식

function 생성자명(속성1, 속성2, 속성3...) {

this.속성1 = 속성1;

this.속성2 = 속성2;

this.속성3 = 속성3;

}

var 인스턴스1 = new 생성자(속성1, 속성2, 속성3...);

var 인스턴스2 = new 생성자(속성1, 속성2, 속성3...);


3) instanceof 키워드

- 인스턴스와 생성자의 일치 여부 반환

- 형태: 인스턴스명 instanceof 생성자명 // 일치할 경우 true 반환


4) 프로토타입(prototype)

- 모든 객체는 prototype 속성 객체를 가지고 있음

- 생성자의 prototype에 객체를 생성하면 모든 인스턴스가 공동으로 사용 가능

- getter, setter, toString 등의 메소드를 prototype에 생성하면 메모리 절약 가능


5) 캡슐화

- 값이 잘못 사용되는 것을 막기 위해 getter 와 setter를 세팅

- 조건문과 throw 혹은 return값을 이용해서 이상값 입력을 막을 수 있음

- 예시

this.setAge = function (a) {

if(age<0) { throw 'Error!' }

else { age=a }

}


6) 상속

- 기존의 생성자 함수나 객체를 기반으로 새로운 생성자 함수나 객체를 생성

- 부모 객체의 속성과 프로토타입 속성을 상속받아서 사용 가능

- 자바스크립트에서 정식으로 지원하지 않는 방식, instanceof로 확인해야함

- 사용 예시

function Unit(h, a) {

var hp = h;

var atk = a;

// getter setter 생략

}

function Marine(h, a) {

this.base = Unit;

this.base(h, a);

}

마린.프로토타입._프로토_=유닛.프로토타입;

마린.프로토타입.컨스트럭터=마린;

*구글 드라이브 에러로 인해 한글 기재