객체 지향 프로그래밍에서 특정 "클래스"처럼 동작하며, 같은 속성과 메서드를 가진 여러 객체를 쉽게 생성할 수 있도록 도와준다
2. 생성자 함수의 특징
new 키워드와 함께 호출
함수 내부에서 this는 생성된 새 객체를 참조
생성자 함수는 기본적으로 새 객체(this)를 반환
명시적으로 객체를 반환하지 않는다면 암묵적으로 this가 반환됨
생성자 함수라는 것을 구분하기 위해 관습적으로 함수 이름을 대문자로 시작한다
3. 생성자 함수의 동작 원리
new 키워드를 사용해 생성자 함수 호출
빈 객체 생성, this에 바인딩
생성자 함수의 코드가 실행되어 this에 속성과 메서드가 추가
생성자 함수가 명시적으로 다른 객체를 반환하지 않으면 this 반환
function Person(name, age) {
this.name = name; // 새 객체에 name 속성 추가
this.age = age; // 새 객체에 age 속성 추가
this.greet = function() {
console.log(`안녕하세요, 저는 ${this.name}이고, ${this.age}살입니다.`);
};
}
// 객체 생성
const person1 = new Person("홍길동", 23);
const person2 = new Person("김진수", 25);
// 출력
person1.greet(); // 안녕하세요, 저는 홍길동이고, 23살입니다.
person2.greet(); // 안녕하세요, 저는 김진수이고, 25살입니다.
4. 일반함수와 생성자 함수의 차이
function normalFunction() {
return {};
}
function ConstructorFunction() {
this.name = "홍길동";
}
// 일반 함수
function Normal() {
this.value = "Normal Function";
}
const normal = Normal();
console.log(normal); // undefined
// 생성자 함수
function Constructor() {
this.value = "Constructor Function";
}
const constructor = new Constructor();
console.log(constructor.value); // "Constructor Function"
5. new 키워드 없이 생성자 함수를 호출하면?
new 키워드 없이 호출하면 this가 전역객체를 참조하기 때문에 문제 발생
이를 방지하기 위해 new 키워드가 없을때 제대로 동작하도록 방어 코드
function Person(name) {
// new 키워드 방어 코드
if (!(this instanceof Person)) {
return new Person(name);
}
this.name = name;
}
const person1 = Person("홍길동");
console.log(person1.name); // "홍길동"
6. 생성자 함수와 프로토타입
생성자 함수와 프로토타입은 객체 지향 프로그래밍에서 함께 동작한다
생성자 함수는 자동으로 prototype 속성을 가지고 있음
생성된 객체는 생성자 함수의 prototype에 정의된 속성과 메서드를 상속받아 사용
function Person(name) {
this.name = name;
}
// 프로토타입에 메서드 추가
Person.prototype.greet = function() {
return `안녕하세요, ${this.name}입니다!`;
};
const person1 = new Person("홍길동");
console.log(person1.greet()); // 안녕하세요, 홍길동입니다!
장점
코드 재사용성 증가
객체 생성이 쉽고, 초기화 작업을 자동화 가능
프로토타입과 함께 사용하면 메모리 효율성 증가
단점
코드가 복잡해질 수 있다.
new 키워드를 사용하지 않으면 버그 발생 가능
요약 : 생성자 함수는 javascript에서 새 객체를 생성하고 초기화 하는 도구로, new 키워드와 함께 새용되며 객체 지향 프로그래밍의 기본단위가 된다.
