생성자 함수, constructor function

임재환·2021년 4월 3일
0

JavaScript

목록 보기
11/15


객체는 객체 리터럴로 간단하게 생성할 수 있지만,
생성자 함수를 사용해 객체(인스턴스)를 생성할 수도 있다.


생성자 함수

new 연산자와 함께 호출하여 객체를 생성하는 함수를 생성자 함수라고 한다.
자바스크립트는 Object, String, Boolean, Function, Array, Promise 등의 빌트인 생성자 함수를 제공한다.

생성자 함수의 장점

객체를 생성할 때 생성자 함수를 사용하면 클래스로 인스턴스를 생성하듯 프로퍼티 구조가 동일한 객체 여러 개를 간편하게 생성할 수 있다.

생성자 함수의 구조

생성자 함수의 형식은 따로 정의되어 있지 않고, 일반 함수와 같은 방법으로 생성자 함수를 정의한다.

함수를 new 연산자와 함께 호출하면 해당 함수는 생성자 함수로 동작한다.
만약 new 연산자 없이 호출하면 생성자 함수가 아니라 일반 함수로 동작한다.

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

new 연산자를 사용해 생성자 함수를 호출 시 자바스크립트는 다음과 같은 과정을 거쳐 인스턴스를 생성해 반환한다.

1. 인스턴스 객체 생성과 this 바인딩
암묵적으로 빈 객체가 생성되며 이 빈 객체가 this가 된다.

2. 인스턴스 초기화
생성자 함수의 코드가 한 줄씩 실행되며 생성된 인스턴스(this)의 프로퍼티와 메서드들을 생성한다.

3. 인스턴스 반환
생성자 함수의 모든 코드가 끝나면 완성된 인스턴스(this)가 암묵적으로 반환된다.


함수의 내부 메서드 [[Call]]과 [[Construct]]

자바스크립트의 함수는 객체이므로 일반 객체처럼 동작할 수 있다.
함수는 일반 객체의 내부 슬롯과 내부 메서드들을 모두 가지고 있기 때문이다.

함수는 객체와 다르게 호출할 수 있는데,
함수가 객체와 다르게 [[Call]][[Construct]] 내부 메서드를 가지고 있기 때문이다.

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

[[Call]] 내부 메서드를 갖는 함수를 callable이라고 한다.
callable은 호출할 수 있는 함수를 뜻하며, 모든 함수는 callable이다.

[[Conastruct]] 내부 메서드를 갖는 함수를 constructor
갖지 않는 함수를 non-constructor 라고 한다.
constructor는 생성자 함수로 호출할 수 있는 함수를 뜻한다.


constructor

자바스크립트는 함수 정의를 평가하여 constructor를 구분한다.

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

non-constructor
메서드 축약 표현으로 정의된 메서드, 화살표 함수


함수 객체의 프로퍼티

함수는 객체이므로 프로퍼티를 갖는다.

name

함수 객체의 name 프로퍼티는 함수의 이름을 나타낸다.

length

length 프로퍼티는 함수 정의 시 선언한 매개변수의 개수를 나타낸다.

argument

argument 프로퍼티 값은 argument 객체다.
argument 객체는 함수 호출 시 함수에 전달한 인수를 담고 있는 유사배열 객체다.

prototype

prototype 프로퍼티는 constructor만 가질 수 있는 프로퍼티다.
상속을 구현하는 객체다

__proto__

Object.prototype으로부터 상속받은 접근자 프로퍼티다.
내부 슬롯 [[prototype]]에 접근해 값을 가져온다.

profile
What do I do?

0개의 댓글