yongfront 2024. 2. 2. 12:16
반응형
SMALL

자바스크립트에서 생성자 함수는 객체를 생성하기 위해 사용되는 특별한 함수입니다. 생성자 함수에서 this 키워드는 생성될 새로운 객체를 가리킵니다. 이를 통해 생성자 함수 내에서 객체의 속성과 메서드를 정의할 수 있습니다.

생성자 함수의 작동 원리

  1. 새 객체 생성: new 연산자와 함께 생성자 함수를 호출하면 자바스크립트 엔진은 먼저 새로운 빈 객체를 만듭니다.
  2. this에 바인딩: 생성된 빈 객체는 생성자 함수의 **this**에 바인딩됩니다. 이로 인해 생성자 함수 내부에서 **this**를 사용하면 새로 만들어진 객체를 가리키게 됩니다.
  3. 속성 및 메서드 추가: 생성자 함수 내에서 **this**를 사용해 새 객체에 속성과 메서드를 추가합니다.
  4. 객체 반환: 생성자 함수의 실행이 끝나면 **this**에 바인딩된 새 객체가 반환됩니다. 별도의 반환문이 없어도 자동으로 이 객체가 반환됩니다.

예시

function Person(name, age) {
    this.name = name;
    this.age = age;
    this.introduce = function() {
        console.log(`My name is ${this.name} and I am ${this.age} years old.`);
    };
}

// 'new' 키워드를 사용하여 생성자 함수를 호출하고, 새 객체를 생성합니다.
var person1 = new Person("Alice", 30);
person1.introduce(); // "My name is Alice and I am 30 years old."

주의 사항

  • 반드시 new 연산자 사용: 생성자 함수는 반드시 new 연산자와 함께 호출되어야 합니다. new 없이 생성자 함수를 호출하면 **this**는 전역 객체(window 또는 global)를 가리키게 되어 예기치 않은 결과를 초래할 수 있습니다.
  • 화살표 함수의 제한: 화살표 함수는 자체 this 바인딩을 가지지 않기 때문에 생성자 함수로 사용할 수 없습니다. 대신 일반 함수 선언을 사용해야 합니다.

생성자 함수와 **this**의 사용은 객체 지향 프로그래밍 패러다임에서 매우 중요한 개념입니다. 자바스크립트에서 객체를 유연하게 생성하고 관리하는 데 도움이 됩니다.

728x90
반응형
LIST