[JavaScript] 생성자 함수

 

 

See the Pen Untitled by ParkJooHong (@ParkJooHong) on CodePen.

 

자바스크립트에서 생성자 함수는 객체를 생성하고 초기화하는 역할을 수행한다.

생성자 함수를 사용하면 유사한 속성과 메서드를 가진 여러 객체를 쉽게 생성할 수 있다. 생성자 함수를 사용하면 코드의 재사용성을 높이고, 객체 간의 구조를 일관성 있게 유지할 수 있다.

 

 

function User(name, age) {  // 생성자 함수
    this.name = name;
    this.age = age;
    this.view = function () {
            document.write("나의 이름은 " + this.name + "이고, 나이는 " + this.age + "세 입니다.<br>");
        }
    }
 
var ob1 = new User('kim', 25);   // 인스턴스 생성
var ob2 = new User('lee', 20);
ob1.view();
ob2.view();    

 

1. 생성자 함수의 정의

생성자 함수는 function 키워드를 사용하여 정의된다.

함수 이름은 주로 대문자로 시작하며, 객체의 속성을 초기화하는 코드가 함수 내에 작성된다.

 

2. 새로운 객체 생성

 생성자 함수를 사용하여 새로운 객체(인스턴스)를 생성할 때에는 new 키워드를 사용한다.

new 키워드를 사용하면 생성자 함수 내부의 코드가 실행되어 객체가 초기화된다.

3. 속성과 메서드 초기화

 생성자 함수 내부에서 this 키워드를 사용하여 객체의 속성과 메서드를 정의할 수 있다.

this는 생성자 함수가 생성할 객체 자체를 가리킨다.

4. 메서드 공유

 생성자 함수 내에서 정의한 메서드는 객체 각각에 중복되어 저장되지 않는다.

대신, 모든 인스턴스가 해당 메서드를 공유하게 된다. 이는 메모리를 효율적으로 사용할 수 있도록 도와준다.

예시

위에 제시한 코드가 바로 생성자 함수의 예시이다. User라는 생성자 함수가 정의되어 있으며, 객체의 이름과 나이 속성을 초기화하는 코드와 객체를 출력하는 view 메서드가 정의되어 있다.

예시 코드에서 var ob1 = new User('kim', 25);와 같이 생성자 함수를 호출하여 객체를 생성하는 부분이 있는데, 이렇게 생성한 객체는 User 생성자 함수의 정의에 따라 속성과 메서드가 초기화된다.

이렇게 생성된 객체는 ob1 변수에 할당되며, 객체 내부의 name과 age 속성을 통해 해당 정보에 접근할 수 있다.