#0. Constructor (생성자)
- 비슷한 유형의 오브젝트를 편리하게 생성하도록 도와주는 기계다.
#1. 왜 이걸 사용해야하나?
- 학급의 30명의 학생들의 인적사항을 담은 출석부 데이터를 생성해야한다고 생각해보자.
- 기존의 지식으론, 학생 데이터를 30개 일일히 다 만들어야한다. 이건 너무 번거롭다. 이런한 반복작업을 조금 더 쉽게 할수 있도록 도와주는 것이 constructor !
var 학생1 = {name: '김윤아', age: 15};
var 학생2 = {name: '남도일', age: 15};
var 학생3 = {name: '손예진', age: 16};
// ...(중략)
var 학생30 = {name: '송혜교', age: 15};
#2. Constructor 사용법
1. fucntion 키워드를 사용하여 constructor 생성
- constructor 생성시, 이름의 맨앞은 대문자를 쓰는 것이 일반적이다. (함수와의 구분을 위함)
ex) function student() -> x function Student() -> o
2. new constructor이름 으로 object를 생성해준다.
// 1. Constructor 생성
function Student(name, age) {
this.name = name; // this는 새로 생성되는 object = instance
this.age = age;
this.sayHi = function(){ // 함수도 이런식으로 넣을수 있음.
console.log(`안녕하세요 ${this.name} 입니다`);
}
}
// 2. new Construct를 사용해, object를 뽑아낸다.
var 학생1 = new Student('김윤아', 15);
var 학생2 = new Student('남도일', 15);
var 학생3 = new Student('손예진', 15);
// // ...(중략)
var 학생30 = new Student('송혜교', 15);
console.log(학생1,학생2,학생3,학생30); // 출력결과 >> Student {name: '김윤아', age: 15, sayHi: ƒ} Student {name: '남도일', age: 15, sayHi: ƒ} Student {name: '손예진', age: 15, sayHi: ƒ} Student {name: '송혜교', age: 15, sayHi: ƒ}
학생1.sayHi(); // 출력결과 >> 안녕하세요 김윤아 입니다
- constructor와 파라미터를 사용하면, 학생 object를 편리하게 뽑아낼 수 있다.
- costructor를 통해 생성되는 object 학생1, 학생2, 학생3 ... 학생30을 instance라고 한다.
- 그리고 constructor를 통해, 만들어진 이 인스턴스들은 부모인 constructor를 상속받았다. 라고도 표현한다.
>> 의의
같은 key를 가진 object를 편리하게 뽑아낼때 constructor를 사용하면 편리하다
'Study > JavaScript' 카테고리의 다른 글
[JavaScript] 객체지향3. Object.create() : 간단하게 부모 속성 상속받기 (0) | 2023.06.24 |
---|---|
[JavaScript] 객체지향2. Prototype = 유전자 (0) | 2023.06.23 |
[JavaScript] Reference data type ( VS Primitive data type ) (0) | 2023.06.22 |
[JavaScript] function 파라미터 탐구하기 (default 파라미터, ...Rest 파라미터) (0) | 2023.06.21 |
[JavaScript] ... Spread Operator = 괄호 벗겨주세요 (0) | 2023.06.20 |