[JavaScript] 생성자(Constructor) 만들기

 

생성자라고도 불리는 Constructor는 오브젝트의 생성과 초기화를 담당합니다.

새로운 오브젝트를 생성할 때 호출되기때문에 생성자(Constructor)라는 이름이 붙었습니다.

 

 

Constructor는 함수와 같은 형태를 이루고 있지만 값을 반환하지 않아 함수로 구분될 수 없습니다.

 

 

또한 Constructor는 new 라는 키워드와 함께 사용되며 이름의 첫 글자는 대문자를 사용합니다.

 

var arr = [];
var arr = new Array();

 

Constructor를 어떤 상황에서 쓸 수 있는지 간단한 예제를통해 알아봅시다.

 

 

ex) 똑같은 오브젝트를 독립된 개체로 복사하고 싶을 때

 

잘못된 방법

 

var user = { name : 'Kim'};
var user2 = user;

user.name = 'Park';

console.log(user); // 결과: 'Park';
console.log(user2); // 결과: 'Park';

 

위와 같은 방법을 사용하면 user와 user2가 같은값을 보여 복사된 것으로 생각할 수 있지만 실제로는 데이터를 담은 하나의 주소값을 공유하고 있으므로 한 쪽을 수정하면 다른 한 쪽의 값도 변하므로 독립된 객체로 복사되었다고 볼 수 없습니다.

 

 

 

 

온바른 방법

 

function Copyuser(name = 'Kim', email){ // 아무런 값이 입력되지 않으면 디폴트로 설정되는 값
    this.name = name; // name 입력된 값이 저장되는 곳
    this.age = 15;
    this.email = email; // email 입력된 값이 저장되는 곳
    this.say = function() { console.log('안녕하세요, 저는 ' + this.name + ' 입니다.')};
}

var user1 = new Copyuser('Park', 'aaa@aaa.com'); // name과 email에 해당되는 입력부분
var user2 = new Copyuser();

user1.say(); // 안녕하세요, 저는 Park 입니다.
user2.say(); // 안녕하세요, 저는 Kim 입니다.
console.log(user1.email); // aaa@aaa.com
console.log(user2.email); // undefined

 

위 방법과 같이 하나의 생성자(Constructor)를 만들어 똑같은 오브젝트를 여러개 만들어 내고 싶을 때 new를 사용하여 생성해낼 수 있습니다.

 

user1과 user2는 각각 독립된 오브젝트이기때문에 user1의 name을 변경하더라도 복사된 다른 오브젝트들에는 영향을 주지 않습니다. 

 

함수도 넣어 사용할 수 있으며 똑같은 형태의 오브젝트들을 만들어내고 그 안의 값을 변경하여 같은 형식의 다른 내용을 가진 오브젝트들을 여러개 만들어 낼 수 있습니다.

 

 

그리고 이러한 과정을 상속(Inheritance)이라고 합니다.