여러 유사한 개체를 만들어 봅시다!

생성자 함수

유사한 객체를 여러 개 만드는 방법은 무엇입니까? 숫자가 100 또는 1000이면 어떻게 됩니까?

이 경우 생성자 함수가 사용됩니다!
나는 보통 Taiyaki 금형으로 많은 예를 제공합니다.

– 생성자 함수 이름은 규칙에 따라 대문자로 표시됩니다.


객체는 new 연산자를 사용하여 함수를 호출하여 생성됩니다.


: 일반 함수 호출에 new 연산자를 붙이면 자동으로 객체가 생성됩니다.

이렇게 반환된 객체를 인스턴스라고 합니다.

//todo 생성자 함수

function Factory() {

}

//* 일반적인 함수 호출
let factory1 = Factory() // undefined



//* new 연산자를 붙인 함수 호출
let factory2 = new Factory() // Factory {}

이제 실제로 사용해보자.

생성자 함수를 이용하여 다양한 사용자를 만들어 봅시다.

function user(name, age) {
    this.name = name;
    this.age = age;
}

let taehee = new user('taehee', 28); // user {name: 'taehee', age: 28}
let danna = new user('danna', 26); // user {name: 'danna', age: 26}

원래 함수에서 ‘this’는 함수를 호출한 객체를 의미하지만 생성자 함수 앞에 new 연산자를 사용하면 함수 내부의 this는 생성자가 생성한 객체, 즉 인스턴스를 의미합니다.

그렇다면 new 연산자를 사용하는 순간 함수는 어떻게 될까요?

// new 연산자를 쓰게되면...
function user(name, age) {
    this = {} // 1. 빈 객체를 만들어 this에 할당합니다.

 (실세론 생략돼있음)

    this.name = name;
    this.age = age; // 2. 함수 본문을 실행하면서 this에 프로퍼티들을 추가합니다.



    return this // 3. 마지막으로 this를 반환  (실세론 생략돼있음)
}

사실 생성자 함수에는 특별한 것이 없습니다!
new 연산자를 사용하는 모든 함수는 위의 알고리즘을 실행합니다.

이제 함수에 메서드를 추가해 봅시다!

function item(title, price){
    // this = {}

    this.title = title;
    this.price = price;
    this.sayPrice = function (){
        console.log(`${this.title}의 가격은 ${this.price}원 입니다.

`);
    }

    // return this
}

let item1 = new item('인형', 3000)

item1.sayPrice() // 인혀의 가격은 3000원 입니다.