• 레퍼런스
  • 자습서
  • 생성자 함수

    기초 자습서에서 기본적인 객체에 대해 학습했습니다. 객체는 우리가 사는 세상에 존재하는 개체를 추상화해 프로그래밍 언어로 도입한 개념입니다. 이전 예제와 같이, 고양이 한마리를 추상화한 객체를 선언해봅시다.

    let nabi = {
      name: "Nabi",
      sexual: "female",
      breed: "ragdoll",
      jump: (height) => `Jump ${height}m!`
    }

    nabi 객체는 이름이 Nabi이고, 암컷이며, 품종이 랙돌인 고양이를 추상화한 것입니다. 여기에서 다른 고양이 한마리도 객체로 추상화하고 싶으면,

    let cheese = {
      name: "Cheese",
      sexual: "male",
      breed: "bengal",
      jump: (height) => `Jump ${height}m!`
    }

    위와 같이 객체 하나를 더 선언할 수 있습니다. 하지만 이것은 여러 개의 '고양이' 객체를 만드는데 효율적인 방법이 아닙니다. 어떤 '고양이'라는 존재를 추상화하기 위해 동일한 프로퍼티, 메소드를 반복적으로 선언해야 합니다. 이러한 과정을 개선하기 위해 생성자 함수를 만들고 사용합니다.

    생성자 함수는 이름에서 알 수 있듯이, 객체를 생성하는 함수입니다. 생성자 함수는 객체를 만들 때 필요한 프로퍼티와 메소드를 정의하고, 이를 기반으로 새로운 객체를 생성할 수 있게 합니다. 생성자 함수는 JavaScript에서뿐만 아니라 많은 프로그래밍 언어에서 객체 지향 프로그래밍의 핵심 개념 중 하나로 사용됩니다. 이를테면 Java와 C++에서는 클래스(class)라는 이름으로 생성자 함수와 유사한 개념을 사용합니다. 이 문서에서는 생성자 함수를 선언하고 사용하는 방법을 배웁니다.

    선언

    생성자 함수도 함수입니다. 따라서 일반 함수를 선언하는 것처럼 function 키워드를 사용하여 선언할 수 있습니다.

    function Cat(name, sexual, breed) {
      this.name = name;
      this.sexual = sexual;
      this.breed = breed;
      this.jump = (height) => `Jump ${height}m!`;
    }

    위와 같이 Cat이라는 이름의 생성자 함수를 선언했습니다. 생성자 함수는 일반 함수와 다르게, this 키워드를 사용하여 객체의 프로퍼티와 메소드를 정의합니다. this 키워드는 생성자 함수가 호출될 때 생성되는 객체를 가리킵니다. 따라서 this.name, this.sexual, this.breed는 생성되는 객체의 프로퍼티, this.jump는 생성되는 객체의 메소드가 됩니다.

    생성자 함수의 매개변수는 필요에 따라 사용할 수도, 사용하지 않을 수도 있습니다. 위 예제에서는 name, sexual, breed 매개변수를 사용하여 객체의 프로퍼티를 초기화(초기값을 할당)합니다.

    정보

    생성자 함수의 이름은 일반 함수의 이름 규칙과 동일하지만, 흔히 첫 글자를 대문자로 작성합니다. 이는 생성자 함수와 일반 함수를 구분하기 위한 관례입니다.

    사용

    생성자 함수는 new 연산자와 함께 사용합니다. 위에서 선언한 nabi 객체와 cheese 객체를 생성자 함수를 사용하여 다시 만들어봅시다.

    let nabi = new Cat("Nabi", "female", "ragdoll");
    let cheese = new Cat("Cheese", "male", "bengal");

    기존에 객체를 하나하나 직접 선언하는 방법 대신, 생성자 함수를 사용해 더 간결하게 객체를 생성할 수 있습니다.

    new 연산자와 바인딩

    생성자 함수를 사용해 객체를 생성할 때 new 연산자를 사용하는 이유는 무엇일까요? 생성자 함수의 선언에서 알 수 있듯이, 생성자 함수 자체는 그저 프로퍼티와 메소드를 정의하는 함수일 뿐입니다. new 연산자는 생성자 함수에서의 정의대로 객체를 생성합니다. 이 과정을 알기 위해 우리는 '바인딩'이라는 개념을 이해해야 합니다.

    바인딩(binding)은 this 키워드가 어떤 객체를 가리키는지를 결정하는 것입니다. 생성자 함수를 선언할 때 사용한 this는 기본적으로 전역 객체를 가리키게 됩니다(바인딩됩됩니다). 하지만 new 연산자를 사용하면 this는 생성되는 새로운 객체를 가리키게 됩니다. 즉, new 연산자는 생성자 함수의 this 바인딩을 새로 생성된 객체로 변경합니다. 이제 new 연산자의 동작 원리를 설명할 수 있습니다.

    1. new 연산자가 빈 객체를 생성합니다.
    2. 생성자 함수가 호출됩니다. 이때 생성자 함수의 this에 1번 과정에서 생성한 빈 객체가 바인딩됩니다.

    이러한 과정 때문에, 생성자 함수의 this는 전역 객체를 가리킴에도 불구하고 생성자 함수에서 정의된 바를 따르는 새로운 객체가 생성됩니다.