[JavaScript] Namespacing

JavaScript는 전역변수를 기초로 하므로, 코드 안에 전역변수가 많아질 때 변수의 이름이 겹쳐서 오염되기 쉽다.

따라서 변수의 범위를 적절하게 조절하여 전역변수의 사용을 최대한 줄여야 한다.

Namespacing

• Namespacing은 객체나 변수가 겹치지 않는 안전한 코드를 작성하는 개념이다.

방법 1. 객체를 네임스페이스로 활용

• 하나의 전역 객체를 만든 후, 모든 함수, 객체, 변수 등을 여기에 추가하여 구현한다.

• 모든 변수와 함수에 상위 객체 명을 붙여야 하므로 코드의 양이 늘어난다.
• 전역 인스턴스가 하나이므로 코드의 어느 한 부분이 수정되어도 전역 인스턴스를 수정해야 되고, 계속해서 나머지 기능들도 갱신된 상태를 물려받는다.
• 매번 객체에 접근해야하고, 이름이 중첩되고 길어지므로 검색이 느려진다.

// 전역 객체
const MYAPP = {};

MYAPP.Func1 = function() {};
MYAPP.num = 10;

방법 2. 함수를 네임스페이스로 활용

• JavaScript는 함수 레벨 스코프에 따라 함수 안에서 선언된 변수의 유효 범위는 함수 내부이다.
• 이를 활용해 즉시 실행 함수로 코드를 작성한다.

// 즉시 실행 함수

(function() {
  // 코드 작성
})();

참고문헌

• 넥스트리의 JavaScript: 네임스페이스 패턴(Namespace Pattern) 바로 알기
• 탱구탱구s님의 [JavaScript] 자바스크립트 네임스페이스(Namespace, 이름 공간)