생성자 함수

저번 시간에 객체 리터럴로 객체 생성 방식을 공부했다.
요번에는 생성자 함수로 생성하는 객체 생성 방식을 보자

Object 생성자 함수

new 연산자와 함께 Object 생성자 함수를 호출하면 빈 객체를 생성하여 반환한다. 빈 객체를 생성하고 프로퍼티나 메서드를 추가하여 객체를 완성 할 수 있다.

const person = new Object();

person.name = 'Lee';
person.sayHello = function () {
  console.log('Hi! My name is ' + this.name);
};
console.log(person); // {name: "Lee", sayHello: f}
person.sayHello(); // Hi My name is Lee

이런식으로 만들 수 있는데 그냥 객체 리터럴이 가장 편한 방법이다.

Object 생성자 함수 이외에도 String,Number,Boolean등 빌트인 생성자 함수를 제공한다.

생성자 함수

객체리터럴에 의한 객체 생성 방식은 직관적이고 간편하지만 이런 리터럴로 생성하면 동일한 프로퍼티를 갖는 객체를 여러개 생성하는 경우 매번 같은 프로퍼티를 기술해야한다.

const circle1 = {
  radius: 5,
  getDiameter() {
    return 2 * this.radius;
  }
};

console.log(circle1.getDiameter()); // 10

const circle2 = {
  radius: 10,
  getDiameter() {
    return 2 * this.radius;
  }
};

console.log(circle2.getDiameter()); // 20

객체 리터럴에 메서드가 중복되는데 이른 편하게 하려고 생성자 함수를 써서 프로퍼티값이 동적으로 변하게 만들어야 한다.

생성자 함수를 사용하여 프로퍼티 구조가 동일한 객체 여러 개를 간편하게 생성 할 수 있다.

// 생성자 함수
function Circle(radius) {
  // 생성자 함수 내부의 this는 생성자 함수가 생성할 인스턴스를 가리킨다.
  this.radius = radius;
  this.getDiameter = function () {
    return 2 * this.radius;
  };
}

// 인스턴스의 생성
const circle1 = new Circle(5);  // 반지름이 5인 Circle 객체를 생성
const circle2 = new Circle(10); // 반지름이 10인 Circle 객체를 생성

console.log(circle1.getDiameter()); // 10
console.log(circle2.getDiameter()); // 20

this는 객체 자신의 프로퍼티나 메서드를 참조하기 위해 자기 참조 변수이다. this는 함수 호출 방식에 따라 동적으로 결정된다.

일반 함수로 호출할때는 전역 객체를 가리킨다. 메서드로서 호출할때는 메서드를 호출한 객체(마침표 앞의 객체)를 가리키고 생성자 함수로서 호출 할 때에는 생성자 함수가 미래에 생성할 인스턴스를 가리킨다.

[[call]]와 [[construct]]

내부 메서드 call을 갖는 함수 객체를 [[callable]]이라고 하며 내부 메서드 [[Construct]]를 갖는 함수 객체를 constructor라고 한다.

callable은 호출 할 수 있는 객체, 즉 함수를 말한다. constructor는 생성자 함수로서 호출할 수 있는 함수를 말하고 non-constructor는 객체를 생성자 함수로서 호출할 수 없는 함수를 의미합니다.

내부 메서드인 [[call]]이 없으면 호출도 할 수 없는 함수입니다.

constructor와 non-constructor

자바스크립트 엔진은 함수 정의를 평가하여 함수 객체를 생성할 때 함수 정의 방식에 따라 함수를 constructor와 non-constructor로 구분한다.

constructor는 함수 선언문, 함수 표현식, 클래스가 있고
non-constructor는 메서드 축약 표현, 화살표 함수가 있다.

new 연산자

일반 함수와 생성자 함수에 특별한 형식적 차이는 없다.
new 연산자와 함께 호출을 하면 해당 함수는 생성자 함수로 동작하고 [[call]]이 호출 되는 것이 아니라 [[construct]]가 호출이 된다.

반대로 new 연산자 없이 생성자 함수를 호출하면 일반 함수로 호출된다.
이것은 함수 객체의 내부 메서드인 [[Construct]]가 호출되는 것이 아니라 [[Call]]이 호출된다.