[JavaScript] 생성자 함수

한서연·2022년 1월 6일
0
post-thumbnail
post-custom-banner

생성자 함수

생성자 함수(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연산자와 생성자 함수를 사용하면 위에서 본 예시처럼 유사한 객체 여러개를 쉽게 만들 수 있는 장점이 있어 생성자 함수를 사용한다.

post-custom-banner

0개의 댓글