JavaScript/모던자바스크립트 딥다이브

[딥다이브] 17장 생성자 함수에 의한 객체생성

17.2 생성자함수

객체 리터럴에 의한 객체생성 방식은 동일한 프로퍼티를 갖는 객체를 여러개 생성해야하는 경우 매번같은 프로퍼티를 기술해야하기 때문에 비효율적이다

그에 비해 생성자 함수에 의한 객체 생성방식은 프로퍼티가 구조가 동일한 객체여러개를 간편하게 생성할수있다

new 연산자와 함께 호출하면 해당 함수는 생성자 함수로 동작한다.

 

17.2.3 생성자 함수의 인스턴스 생성과정

js엔진은 암묵적인 처리를 통해 인스턴스를 생성 및 반환한다.

 

1. 인스턴스 생성과 this 바인딩

- 암묵적으로 빈객체 생성  및 this 바인딩(식별자와 값을연결하는 과정 변수이름과 확보된 메모리공간의 주소를 연결한다.) 

2. 인스턴스 초기화 

- this에 바인딩되어있는 인스턴스(객체)를 초기화한다.

3. 인스턴스 반환

- 완성된 인스턴스가 바인딩된  this가 암묵적으로 반환된다.

- 명시적으로 return을 작성시 암묵적인 this반환이 무시된다. (return문을 생략해야한다)

 

17.2.4 내부메서드 [[Call] 과 [[Construct]]

// 함수는 객체이다
function foo() {}

// 함수는 객체이므로 프로퍼티를 소유할수있다.
foo.prop = 10;

// 함수는 객체이므로 메서드를 소유할수있다.
foo.method = function () {
  console.log(this.prop);
};

foo.method(); // 10
 

함수가 일반 함수로서 호출되면 함수 객체의 내부 메서드 [[Call]]이 호출되고 

new 연산자와 함께 생성자 함수로서 호출되면 내부 메서드 [[Construct]]가 호출된다.

생성자 함수로서 호출할 수 있는 함수를 constructor라고 한다. 

모든 함수 객체는 호출할 수 있지만(callable)

모든 함수 객체를 생성자 함수로서 호출(constructor)할 수 있는 것은 아니다.

 

 

17.2.5 construtor 와 non-constructor의 구분

함수의 정의방식에 따라 구분된다.

- constructor : 함수 선언문 . 함수표현식, 클래스

- non-constructor : 메서드 (ES6메서드 축약표현), 화살표함수 

 

ES6 이후로는 new.target을 사용으로 구분할수있다.

-new 연산자와 함께 생성자 함수로 호출 될시 : new.target은 함수 자신을 가르킨다.

-new 연산자 없이 일반 함수로 호출될시 :  new.target  = undefined