[javascript] 모듈 패턴에서의 모듈 상속은 어떻게 이루어지나요?

18 Dec 2023

javascript

모듈 패턴에서 모듈 상속을 하려면 기본적으로 부모 모듈과 자식 모듈을 만들어야 합니다. 부모 모듈은 일반적인 모듈 방식으로 만들고, 자식 모듈은 부모 모듈을 상속받아 사용합니다.

// 부모 모듈
var parentModule = (function () {
  var privateVar = "I'm private";

  return {
    getParentVar: function () {
      return privateVar;
    },
    parentMethod: function () {
      return "I'm a parent method";
    }
  };
})();

// 자식 모듈
var childModule = (function (parent) {
  var privateVar = "I'm also private";
  var parentMethod = parent.parentMethod;

  return {
    getChildVar: function () {
      return privateVar;
    },
    childMethod: function () {
      return "I'm a child method";
    },
    newMethod: function () {
      // 호출된 메소드부터 차례대로 상속 체이닝을 따라가면서 해당 메소드가 없으면
      // 상위로 올라가면서 검색하기 때문에, 중복 방어 및 메소드 오버라이드도 가능하다.
      return parentMethod() + " that has been overridden by the child";
    }
  };
})(parentModule);

console.log(childModule.getParentVar()); // "I'm private"
console.log(childModule.getChildVar()); // "I'm also private"
console.log(childModule.parentMethod()); // "I'm a parent method"
console.log(childModule.childMethod()); // "I'm a child method"
console.log(childModule.newMethod()); // "I'm a parent method that has been overridden by the child"

위 코드에서는 parentModule을 정의하고, childModule에서 parentModule을 상속받아 사용하는 예시를 살펴볼 수 있습니다. parentModule과 childModule은 각각 즉시 실행 함수로 구현되어 있으며, 자식 모듈이 부모 모듈을 상속할 때 부모 모듈의 메서드를 자식 모듈에서 접근하는 방식으로 동작합니다.

이를 통해 모듈 패턴에서 모듈 상속이 어떻게 이루어지는지 이해할 수 있습니다.