Day 40-3. [JavaScript]전역 변수 사용 억제, 모듈 패턴

전역 변수의 사용을 억제하는 방법

1. 즉시 실행 함수

모든 코드를 즉시 실행 함수로 감싸면 모든 변수는 즉시 실행 함수의 지역 변수가 된다.

 

var myFunction = (function() {
    var foo = 10; // 즉시 실행 함수의 지역 변수
    console.log(foo)
    // ...
}())

console.log(myFunction) // 10 undefined
// console.log(foo) // ReferenceError: foo is not defined

 

2. 네임스페이스 객체

전역에 네임스페이스 역할 담당할 객체를 생성하고 전역 변수처럼 사용하고 싶은 변수를 프로퍼티로 추가하는 방법

 

var MYAPP = {}; // 전역 네임스페이스 객체

MYAPP.name = 'Lee';

console.log(MYAPP.name); // Lee

 

네임스페이스 객체에 또 다른 네임스페이스 객체를 프로퍼티로 추가해서 네임스페이스를 계층적으로 구성할수도 있다.

 

var MYAPP = {};

MYAPP.person = {
    name: 'Lee',
    address : 'Seoul'
}

console.log(MYAPP.person.name) // Lee

---

모듈 패턴

캡슐화는 객체의 상태를 나타내는 프로퍼티와 프로퍼티를 참조하고 조작할 수 있는 동작인 메서드를 하나로 묶는 것을 말한다.

캡슐화는 객체의 특정 프로퍼티나 메서드를 감출 목적으로 사용하기도 하는데 이를 정보 은닉이라 한다.

 

대부분의 객체지향 프로그래밍 언어는 클래스를 구성하는 멤버에 대해 public, private, protected 등의 접근 제한자를 사용해 공개 범위를 한정할 수 있다. public으로 선언된 데이터 또는 메서드는 외부에서 접근이 가능하지만 private으로 선언된 경우는 외부에서 접근할 수 없는 내부에서만 사용된다. 이것은 클래스 외부에는 제한된 접근 권한을 제공하며 원하지 않은 외부의 접근으로부터 내부를 보호하는 기능을 한다.

 

하지만 자바스크립트는 public, private, protected 등의 접근 제한자를 제공하지 않는다. 모듈 패턴은 전역 네임스페이스의 오염을 막는 기능은 물론 한정적이기는 하지만 정보 은닉을 구현하기 위해 사용한다.

 

var Counter = (function(){
    // private 변수
    var num = 0;

    function increase() {
        return ++num;
    }

    function decrease() {
        return --num;
    }

    // 외부로 공개할 데이터나 메서드를 프로퍼티로 추가한 객체를 반환한다.
    return {
        increase : increase,
        decrease : decrease
    };
}());

console.log(Counter.num);

console.log(Counter.increase());
console.log(Counter.increase());
console.log(Counter.decrease());
console.log(Counter.decrease());

 

위 예제의 즉시 실행 함수는 객체를 반환한다. 이 객체에는 외부에 노출하고 싶은 변수나 함수를 담아 반환한다.

이때 반환되는 객체의 프로퍼티는 외부에 노출되는 퍼블릭 멤버다. 

외부로 노출하고 싶지 않은 변수나 함수는 반환하는 객체에 추가하지 않으면 외부에서 접근할 수 없는 프라이빗 멤버가 된다.