생성자 함수를 사용하는 이유는 객체지향프로그래밍에서 class
를 정의해서 객체를 찍어내는 이유와 동일하다고 생각한다.
객체의 틀인 생성자함수를 한번 정의해두면 손쉽게 여러 객체들을 생성할 수 있다.
function Person(name){
this.name = name;
this.say = function () {
console.log("Hello, ", this.name);
}
}
const p1 = new Person();
const p2 = new Person();
// ... 이런식으로 쉽게 객체를 생성할 수 있다.
위의 Person()
을 예시로 사용하겠다.
function Person(name){
const this = {}; // 1
// 2
this.name = name;
this.say = function () {
console.log("Hello, ", this.name);
}
// 만약 다른 리턴문이 존재한다면 객체일 경우 그것을 반환하고, 객체가 아니면 무시하고 this를 반환한다.
return this; // 3
}
new
를 이용해서 함수 호출시 일어나는 일
1. this
가 빈 객체로 생성되며, this
에 바인딩됨
2. this
에 바딘딩되어 있는 인스턴스를 초기화함
3. this
를 반환함
자바스크립트에서 함수는 객체이다.
하지만 함수는 객체와는 다르게 "호출"이 가능하다.
그 이유는 함수는 특별한 내부 슬롯과 메서드를 가지기 때문이다.
내부 슬롯
1. [[Environment]]
2. [[FrmalParameters]]
내부 메서드
1. [[Call]]
: 일반 함수호출시 사용되는 메서드
2. [[Construct]]
: 생성자함수로 호출시 사용되는 메서드 즉, new
를 이용한 호출
여기서 알아둬야할점은 모든 함수는 [[Call]]
는 가지지만 [[Construct]]
는 안가질 수 있다.
즉, 모든 함수는 일반 함수로서 호출이 가능하지만, 생성자함수로서 항상 사용가능한것은 아니다라는 점이다.
그렇다면 [[Construct]]
를 가지지 않는 함수는 어떤것인지 알아보자
1. 화살표함수
2. ES6 메서드 축약 표현
위 두가지로 함수를 정의하는 경우에는 [[Construct]]
를 가지지않으므로 new
를 이용한 생성자 함수로 호출이 불가능하다. ( 만약 생성자함수로 호출시 에러발생
new.target
을 이용해서 생성자함수로서의 호출인지 확인이 가능하다.