생성자 함수 (Constructor Function)

생성자 함수란 객체(또는 배열 등)를 생성하기 위한 특수한 함수이다. 자바스크립트에서 객체를 생성할 때 공통된 구조나 초기값을 반복적으로 설정할 수 있어, 코드 재사용성을 높이는 데 유용하다.

🤔 어디서 본 것 같은데?

객체와 배열을 생성하는 방법 중 하나이다! new 키워드와 함께 호출되며, 새로운 객체와 배열을 생성할 수 있다.

let obj = new Object();
let arr = new Array();

생성자 함수 사용 이유

동일한 구조의 객체를 여러 개 만들어야 할 때, 생성자 함수를 사용하면 중복된 코드를 줄일 수 있다.

일반 객체 리터럴 방식

const person1 = {
  name: "바켸빈",
  age: 20,
  pet: "dog",
  print: function () {
    console.log("안녕하세요" + this.name + "입니다.");
  },
};

const person2 = {
  name: "박혜빈",
  age: 30,
  pet: "cat",
  print: function () {
    console.log("안녕하세요" + this.name + "입니다.");
  },
};

• 객체를 매번 복사해서 만드는 방식은 유지보수가 어렵고 중복이 많다.
• 아래와 같이 생성자 함수를 사용하면 코드를 간단하게 작성할 수 있다.

생성자 함수 방식

function Person(name, age, pet) {
  this.name = name;
  this.age = age;
  this.job = job;
  this.print: function () {
    console.log("안녕하세요" + this.name + "입니다.");
  },
}
const person1 = new Person("바켸빈", 20, "dog")
const person2 = new Person("박혜빈", 30, "cat")

console.log(person1.name) // 바켸빈
console.log(person2.age) // 30

• 생성자 함수는 보통 첫 글자를 대문자로 작성한다 Person
• new 키워드를 사용하여 호출하면, 내부에서 this는 새롭게 만들어질 객체를 가리킨다.
• this에 프로퍼티나 메서드를 정의하면, 각 인스턴스에 그 값이 복사된다.
• 예시에서, Person 생성자 함수는 name, age, pet을 매개변수로 받아 객체를 생성하고, new Person(...)을 통해 만들어진 객체는 각각 person1, person2변수에 저장된다.

인스턴스(instance)란?

인스턴스란 생성자 함수(또는 클래스)를 이용해 실제로 만들어진 객체를 의미한다.

const person1 = new Person("바켸빈", 20, "dog");
// person1은 Person 생성자 함수의 인스턴스

• Person은 일종의 설계도이고, person1은 그 설계도를 기반으로 만들어진 인스턴스(실체)다.
• 여러 인스턴스를 생성하면 구조는 같고 내용만 다른 객체들을 효율적으로 만들 수 있다.

instanceof 인스턴스 판별

console.log(person1 instanceof Person); // true

• instanceof를 활용해 person1이 Person의 인스턴스인지 판별을 할 수 있다.