JS 문법 - 생성자 함수

Class: 제로베이스
Created: December 1, 2022 10:47 PM
Type: Javascript
강의 명: 이론부터 실전까지 모든 것을 담은 자료구조/알고리즘

생성자 함수

유사한 객체를 다중으로 만들 때 사용되는 함수 (타 언어에서의 class 개념과 유사)
객체의 틀을 만들어 놓고, 그 틀의 매개변수를 이용해 유사한 객체 쉽게 만들 수 있음
일반적으로 생성자 함수의 첫 글자는 대문자로 시작
생성자 함수로 객체 생성 시 new 연산자를 통해 객체 생성.

// 생성자 함수
function FishBread(flavor, price) {
  this.flavor = flavor ;
  this.price = price;
  this.base = "flour";
}
let bread_1 = new FishBread("cream", 1200);
let bread_2 = new FishBread("redBean", 1000);
let bread_3 = new FishBread("milk", 1500);

console.log(bread_1);
// FishBread { flavor: 'cream', price: 1200, base: 'flour' }
console.log(bread_2);
// FishBread { flavor: 'redBean', price: 1000, base: 'flour' }
console.log(bread_3);
// FishBread { flavor: 'milk', price: 1500, base: 'flour' }

new. target 처리 추가

.new.target 속성(property)를 사용하여 new 와 함꼐 호출했는지 확인 가능

function User(name) {
  // 만약 이 생성자함수로 객체 생성할 때 new 빼먹었으면
  // 이 구문을 시행해서, 스스로를 재귀함수로 다시 호출해서
  // new를 붙여서 다시 수행.
  if (!new.target) {
    return new User(name);
  }
  this.name = name;
}

let result_1 = User('john'); // User { name: 'john' }
console.log(result_1);
let result_2 = new User('john'); // User { name: 'john' }
console.log(result_2);