JavaScript의 공개 모듈 패턴

JavaScript의 공개 모듈 패턴을 사용하면 필요한 것만 노출하면서 클로저를 사용하여 개인 정보를 유지할 수 있습니다.

문제



객체clarkKent를 생성하는 다음 예를 살펴보겠습니다.

const clarkKent = {
  name: 'Clark Kent',
  secretIdentity: 'Superman',
  introduce: function() {
    return `Hi, my name is ${this.name}.`;
  },
  issuesReport: function() {
    return `${this.secretIdentity} saves the day!`;
  },
};

이 예를 사용하여 Clark은 자신을 소개하고 Superman이 하루를 구했다고 보고할 수 있습니다.

console.log(clarkKent.introduce());
// Hi, my name is Clark Kent.
console.log(clarkKent.issuesReport());
// Superman saves the day!

이것은 훌륭하지만, 오 안돼! 우리는 Clark의 비밀 신원에 접근할 수 있습니다!

console.log(clarkKent.secretIdentity);
// Superman

구조에 모듈 패턴 공개



이 문제를 해결할 수 있는 한 가지 방법은 표시 모듈 패턴을 사용하는 것입니다. 공개 모듈 패턴은 즉시 호출된 함수 표현식(IIFE)을 사용하여 모듈 내에서 액세스하고 싶지만 세상에 노출하고 싶지 않은 변수 주위에 클로저를 만듭니다.

이것이 Clark에게 어떻게 작용하는지 봅시다.

const clarkKent = (function() {
  const name = 'Clark Kent';
  const secretIdentity = 'Superman';
  const introduce = function() {
    return `Hi, my name is ${name}`;
  };
  const issuesReport = function() {
    return `${secretIdentity} saves the day!`;
  };

  return { introduce, issuesReport };
})();

console.log(clarkKent.introduce());
// Hi, my name is Clark Kent.
console.log(clarkKent.issuesReport());
// Superman saves the day!
console.log(clarkKent.secretIdentity);
// undefined

완벽한! 우리는 노출하고 싶지 않은 비밀 정보에 대한 클로저를 만들고 모듈에서 introduceissuesReport 메서드만 공개했습니다!

결론



이것은 약간 어리석은 예이지만 개인 정보를 유지하고 중요하게는 정보가 실제로 필요한 곳 ​​이상으로 노출되지 않도록 노출 시 도구와 패턴이 있다는 점에 유의하는 것이 중요합니다.

좋은 웹페이지 즐겨찾기