본문 바로가기
자바스크립트

JavaScript: 네임스페이스 패턴(Namespace Pattern) 바로 알기

by 찬찬2 2020. 11. 18.

www.nextree.co.kr/p7650/

3. 네임스페이스 패턴(Namespace Pattern)

Namespace Pattern이란?

네임스페이스(namespace)는 구분이 가능하도록 정해놓은 범위나 영역을 뜻합니다. 즉, 말 그대로 이름 공간을 선언하여 다른 공간과 구분하도록 합니다.

한 가지 예를 들어보겠습니다. 만약 대한민국에 사는 홍길동이라는 사람을 찾는다면, 처음에 의도했던 특정한 사람을 찾아내는 것은 거의 불가능합니다. 서울에 사는 홍길동이라고 하면 범위는 조금 좁아지겠지만 여전히 원하던 사람을 찾기 어렵겠죠. 대한민국, 서울시, **구, ##로 123번지에 사는 홍길동 이라는 정보가 있어야만 특정 인물을 찾을 수 있습니다. 이처럼, 원하는 결과를 얻기 위해서는 좀 더 ‘자세한’ 정보가 필요합니다. 이를 JavaScript 언어 관점에서 바라보면, '자세한 정보'들이 바로 네임스페이스입니다. 그래서, 대한민국에서 홍길동을 찾기는 전역 네임스페이스에서 특정 변수를 직접 찾기와 같은 것이죠.

결국 네임스페이싱(namespacing)은 객체나 변수가 겹치지 않는 안전한 소스코드를 만드는 개념입니다. 하지만 JavaScript는 아직까지 네임스페이싱을 위한 기능을 지원하지 않기 때문에 다음의 특성을 통해 네임스페이스와 비슷한 효과를 얻을 수 있습니다.

  • JavaScript의 모든 객체는 프로퍼티를 가집니다.
  • 그 프로퍼티는 다시 다른 객체를 담을 수 있습니다.

이러한 네임스페이싱 코딩 기법들을 네임스페이스 패턴(namespace pattern)이라고 합니다

 

3.1 객체 리터럴 네임스페이싱(Object Literal Namespacing)

가장 기본적인 네임스페이스 패턴은 객체 리터럴 네임스페이싱 방식 입니다. 하나의 전역 객체(global object)를 만든 후, 모든 함수, 객체, 변수를 여기에 추가하여 구현합니다. 물론 꼭 나중에 추가하지 않아도 전역 객체 선언 시에 리터럴로 미리 선언해 주어도 됩니다.

 

이 패턴은 코드 내에서 뿐 아니라 같은 페이지에 존재하는 JS 라이브러리나 서드 파티 코드(third-party code)와의 이름 충돌도 방지해 주며 체계적이라는 장점이 있습니다. 하지만 다음과 같은 단점도 존재합니다.

  • 모든 변수와 함수에, 상위 객체 명을 모두 붙여야 하기 때문에 소스코드량이 늘어납니다. 결국 그에 따라 다운로드해야 하는 파일의 크기도 늘어나게 됩니다.

  • 전역 인스턴스가 단 하나뿐이기 때문에 코드의 어느 한 부분이 수정되어도 전역 인스턴스를 수정하게 됩니다. 계속해서 나머지 기능들도 갱신된 상태를 물려받게 됩니다.

  • 매번 객체에 접근하는데다, 이름이 중첩되고 길어지므로 검색이 느려지게 됩니다. 여기서, 매번 오브젝트에 접근하는 단점을 해결하고, 미래의 유지보수를 위하여 this키워드를 사용하는 것을 생각할 수도 있습니다. this를 사용하면 전역객체에 접근하여 검색할 필요가 없이, 바로 상위 객체만을 검색할 수 있기 때문입니다.

댓글