생성자 함수(Constructor Function)는 객체를 생성할 때 사용하는 함수이다
자바스크립트 외 다른 언어에서는 class가 있지만 자바스크립트에서는 없기 때문에 생성자 함수가 그 역할을 대신한다.
생성자 함수와 일반 함수는 기술적인 차이는 없지만 생성자 함수는 아래의 관례를 따른다는 점이 있다.
new
연산자를 붙여 실행함위에 적힌대로 생성자 함수의 관례를 따라 사람 생성자를 만들면 다음과 같이 만들 수 있다.
function.Person(name, gender){
this.name = name;
this.gender = gender;
this.sayHello = function(){
alert(this.name + 'said "hello"');
}
this.... //이러한 방식으로 사람 속성과 매서드를 더 정의할 수 있음
}
만들어진 생성자를 바탕으로 실제 사람 객체를 만들 수 있는데, 호출을 할 때에는 new
연산자를 사용하면 된다.
예를 들어 Han과 Kim라는 사람을 만들어보면 아래와 같이 만들 수 있다.
const Han = new Person('Han', 'F'); //Person {name:'Han', gender:'F'}
const Kim = new Person('Kim', 'M'); //Person {name:'Kim', gender:'M'}
Han.sayHello(); //'Han said "hello"'
Kim.sayHello(); //'Kim said "hello"'
생성자 함수를 이용하면 이렇게 하나의 Person이라는 생성자를 바탕으로 Han과 Kim이라는 두 사람 객체를 만들 수 있게되고, 이 두 객체들은 공통적으로 sayHello라는 메소드를 가지고 있게된다.
객체를 만들 때 리터널{...}
을 사용하면 객체를 쉽게 만들 수 있다.
그런데 개발을 하다 보면 유사한 객체를 여러개 만드는 상황이 생길 수 있는데, 그럴 때 new
연산자와 생성자 함수를 사용하면 위에서 본 예시처럼 유사한 객체 여러개를 쉽게 만들 수 있는 장점이 있어 생성자 함수를 사용한다.