게으른 개발자

해당 포스팅은 Javascript Design Patterns 포스팅 에서 번역하였습니다.

Constructor pattern은 클래스 기반의 디자인 패턴입니다. constructor는 해당 함수로 정의된 메서드 및 속성을 사용하여 새 객체를 인스턴스화하는데 사용할 수 있는 특수 함수입니다.

사실, 이부분은 고전적인 javascript의 디자인패턴은 아닙니다. 해당 패턴의 경우 대부분의 객체지향 언어의 패턴보다는 기본적인 언어 구성에 가깝습니다. constructor 패턴은 주어진 종류의 새로운 객체를 생성하기 위해 javascript에서 가장 일반적으로 사용되는 패턴 중 하나입니다.

다음 예제를 살펴보겠습니다.

// traditional Function-based syntax
function Hero(name, specialAbility) {
  // setting property values
  this.name = name;
  this.specialAbility = specialAbility;

  // declaring a method on the object
  this.getDetails = function() {
    return this.name + ' can ' + this.specialAbility;
  };
}

// ES6 Class syntax
class Hero {
  constructor(name, specialAbility) {
    // setting property values
    this._name = name;
    this._specialAbility = specialAbility;

    // declaring a method on the object
    this.getDetails = function() {
      return `${this._name} can ${this._specialAbility}`;
    };
  }
}

// creating new instances of Hero
const IronMan = new Hero('Iron Man', 'fly');

console.log(IronMan.getDetails()); // Iron Man can fly

위의 예제에서는 name과 specialAbility와 같은 속성을 가진 Hero 클래스와 클래스내에 getDetails 라는 function 을 가지고 있습니다. 그런다음 constructor 메소드를 호출하여 각 속성에 대한 값을 인수로 전달하는 새키워드로 IronMan 객체를 인스턴스화 합니다.

javascript pattern(1) - Constructor pattern

July 16, 2019