객체: 기본 3.5 new 연산자와 생성자 함수

Eddy·2023년 6월 12일
0

코어 자바스크립트

목록 보기
26/30

♠ 객체: 기본

♣ 3.5 new 연산자와 생성자 함수

생성자 함수

생성자 함수(constructor function)와 일반 함수에 기술적인 차이는 없습니다. 다만 생성자 함수는 아래 두 관례를 따릅니다.

  1. 함수 이름의 첫 글자는 대문자로 시작합니다.
  2. 반드시 'new' 연산자를 붙여 실행합니다.

예시:

function User(name) {
  this.name = name;
  this.isAdmin = false;
}

*let user = new User("보라");*alert(user.name); // 보라
alert(user.isAdmin); // false

new User(...)를 써서 함수를 실행하면 아래와 같은 알고리즘이 동작합니다.

  1. 빈 객체를 만들어 this에 할당합니다.
  2. 함수 본문을 실행합니다. this에 새로운 프로퍼티를 추가해 this를 수정합니다.
  3. this를 반환합니다.

예시를 이용해 new User(...)가 실행되면 무슨 일이 일어나는지 살펴 보도록 하겠습니다.

function User(name) {
  *// this = {};  (빈 객체가 암시적으로 만들어짐)*// 새로운 프로퍼티를 this에 추가함
  this.name = name;
  this.isAdmin = false;

  *// return this;  (this가 암시적으로 반환됨)*}

이제 let user = new User("보라")는 아래 코드를 입력한 것과 동일하게 동작합니다.

let user = {
  name: "보라",
  isAdmin: false
};

요약

생성자 함수는 유사한 객체를 여러 개 만들 때 유용합니다.

  • 생성자 함수(짧게 줄여서 생성자)는 일반 함수입니다. 다만, 일반 함수와 구분하기 위해 함수 이름 첫 글자를 대문자로 씁니다.
  • 생성자 함수는 반드시 new 연산자와 함께 호출해야 합니다. new와 함께 호출하면 내부에서 this가 암시적으로 만들어지고, 마지막엔 this가 반환됩니다.

생성자 함수는 유사한 객체를 여러 개 만들 때 유용합니다.

0개의 댓글