[JavaScript] 생성자

📌  생성자

- 생성자 함수 : 유사한 객체를 다중으로 만들 때 사용되는 함수를 말한다 

- 일반적으로 생성자 함수의 이름 첫 글자는 대문자로 시작한다

- 생성자 함수로 객체를 생성할 때에는 new 연산자를 사용한다

- 생성자는 붕어빵 틀이고, 유사한 객체는 앙금이나 가격이 다른 붕어빵이라고 생각하자

- 생성자 내부에서 사용하게 되는 메서드를 정의할 때에는 prototype을 사용한다

   (예) 생성자함수명.prototype.메서드명 = function(){ 실행문 };

 

 

💛  생성자 

function FishBread(flavor, price){
    this.flavor = flavor;
    this.price = price;
    this.base = "flour";
}

let test = FishBread("test", 1200);
let cream_fish_bread = new FishBread("cream", 1200);
let pizza_fish_bread = new FishBread("pizza", 1200);
let redbean_fish_bread = new FishBread("redbean", 1000);

console.log(test);
console.log(cream_fish_bread);
console.log(pizza_fish_bread);
console.log(redbean_fish_bread);

undefined
FishBread { flavor: 'cream', price: 1200, base: 'flour' }
FishBread { flavor: 'pizza', price: 1200, base: 'flour' }
FishBread { flavor: 'redbean', price: 1000, base: 'flour' }

- 유사한 객체를 생성자 함수와 new 연산자를 사용해 빠르게 생성할 수 있다

- 객체를 생성할 때, new 연산자를 함께 사용하지 않으면 객체가 생성되지 않고 undefined를 반환한다

 

 

 

💛  new 연산자 사용 여부 확인하기

function FishBread(flavor, price){
    console.log(new.target);
    this.flavor = flavor;
    this.price = price;
    this.base = "flour";
}

let cream_fish_bread = FishBread("cream", 1200);	// undefined
let pizza_fish_bread = new FishBread("pizza", 1200);	// [Function: FishBread]

- 객체 내부에는 new 연산자와 함께 호출되었는지 확인하는 속성이 존재한다

- new.target을 사용해 new 연산자 사용 여부를 확인할 수 있다

- 반환 값이 undefined 라면 new 연산자를 사용하지 않은 것이고, 사용한 경우에는 객체 생성에 사용된 생성자를 반환한다

 

function FishBread(flavor, price){
    console.log(new.target, flavor, price);
    if(!new.target){
        return new FishBread(flavor, price);
    }else{
        this.flavor = flavor;
        this.price = price;
        this.base = "flour";
    }
}

let cream_fish_bread = FishBread("cream", 1200);
let pizza_fish_bread = new FishBread("pizza", 1200);

undefined cream 1200
[Function: FishBread] cream 1200
[Function: FishBread] pizza 1200

- new.target의 반환 값에 대한 조건문을 사용해 new를 사용하지 않은 상황을 대응할 수 있다

- new 연산자를 사용하지 않은 경우 조건문을 통해 new 연산자를 사용하게끔 유도한다.