JavaScript 디자인 패턴 학습, 제 2판

11장. 네임스페이스 패턴

이 작품은 AI를 사용하여 번역되었습니다. 여러분의 피드백과 의견을 환영합니다: [e-mail]

이 장에서는 JavaScript의 네임스페이스에 대한 패턴 을 살펴보겠습니다. 네임스페이스는 고유 식별자 아래 코드 단위의 논리적 그룹으로 간주할 수 있습니다. 여러 네임스페이스에서 식별자를 참조할 수 있으며 각 식별자는 중첩된(또는 하위) 네임스페이스의 계층 구조를 포함할 수 있습니다.

애플리케이션 개발에서 네임스페이스는 여러 가지 중요한 이유로 사용됩니다. JavaScript 네임스페이스는 전역 네임스페이스에서 다른 객체나 변수와의 충돌을 방지하는 데 도움이 됩니다. 또한 코드베이스에서 기능 블록을 구성하여 보다 쉽게 참조하고 사용할 수 있도록 하는 데에도 유용합니다.

중요한 스크립트나 애플리케이션의 네임스페이스를 지정하는 것은 페이지에 동일한 변수나 메서드 이름을 사용하는 다른 스크립트가 있을 경우 코드가 손상되지 않도록 보호하는 데 매우 중요합니다. 페이지에 정기적으로 삽입되는 타사 태그의 수가 많아지면서 이는 우리 모두가 커리어의 어느 시점에서 해결해야 하는 일반적인 문제가 될 수 있습니다. 글로벌 네임스페이스의 올바른 '시민'으로서 다른 개발자의 스크립트가 동일한 문제로 인해 실행되지 않도록 최선을 다하는 것도 중요합니다.

JavaScript에는 다른 언어처럼 네임스페이스에 대한 지원 기능이 내장되어 있지는 않지만, 비슷한 효과를 얻기 위해 사용할 수 있는 객체와 클로저가 있습니다.

네임스페이스 기본 사항

네임스페이스는 거의 모든 심각한 JavaScript 애플리케이션에서 찾을 수 있습니다. 단순한 코드 조각으로 작업하는 경우가 아니라면 네임스페이스는 쉽게 파악할 수 있을 뿐만 아니라 타사 코드가 우리 코드를 파괴하는 것을 방지할 수 있으므로 올바르게 구현하고 있는지 확인하기 위해 최선을 다해야 합니다. 이 섹션에서 살펴볼 패턴은 다음과 같습니다:

• 단일 전역 변수

• 접두사 이름 공간

• 객체 리터럴 표기법

• 중첩된 네임스페이스

• 즉시 호출되는 기능

• 표현식

• 네임스페이스 주입

단일 전역 변수

JavaScript에서 이름 간격( )을 지정하는 데 널리 사용되는 패턴 중 하나는 단일 전역 변수를 기본 참조 객체로 선택하는 것입니다. 다음은 함수와 프로퍼티가 있는 객체를 반환하는 스켈레톤 구현 예시입니다:

const myUniqueApplication = (() => {
  function myMethod() {
    // code
    return;
  }

  return {
    myMethod,
  };
})();

// Usage
myUniqueApplication.myMethod();

// In this updated example, we use an immediately invoked function expression
// (IIFE) to create a unique namespace for our application, which is stored in
// the ...