javascript-전역변수의 문제점

전역변수의 문제점

변수의 생명주기

• 변수는 선언에 의해 생성되고 할당을 통해 값을 가진다.
• 변수는 언젠가 소멸한다.
• 전역변수의 생명주기는 애플리케이션의 생명주기와 같다.
• 함수 내에서 생성된 지역변수는 함수 호출시 선언문이 실행되고 함수 종료시 소멸된다.
• 즉 지역변수의 생명 주기는 함수의 생명 주기와 같다.

전역 변수의 문제점

1. 암묵적 결합
   전역변수의 의도는 코드 어디서든 참조할 수 있는 변수를 만든다는 의미이다. 이는 모든 코드가 이를 참조하고 값을 변경할 수 있는 암묵적 결합을 의미한다.
   변수의 유효범위가 클수록 코드의 가독성이 나빠지고 의도치 않은 값 변경이 일어날 수 있다.

2. 긴 생명 주기
   전역 변수는 생명주기가 길다. 즉 메모리 소비 시간이 길다.
   var 키워드로 생성된 변수는 중복을 혀용하므로 전역변수는 변수 이름이 중복될 가능성이 크다. 의도치 않게 변수가 중복되면 값이 변경된다.

3. 스코프 체인 상에서 종점에 존재
   전역 변수는 스코프 상에서 종점에 존재한다. 이는 변수의 검색시 가장 마지막 단계에서 검색이 된다는 것이다. 따라서 검색 속도가 가장 느리다.

4. 네임스페이스 오염
   파일을 분리해도 하나의 전역 스코프를 공유 한다는 것에서 다른 파일 내에 동일한 변수가 스코프내에 존재할 수 있다는 문제점이 있다.

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

전역 변수는 꼭 필요한 상황이 아니라면 지역변수를 활용해야 한다. 무조건 적인 지역변수으 사용을 권장하지 않지만 무분별한 전역 변수의 사용은 자제하는 것이 바람직하다.

1. 즉시 실행 함수
   함수의 정의와 동시에 실행되는 즉시 실행 함수에서 모든 코드를 즉시 실행 함수로 감싸면 모든 변수가 즉시 실행 함수의 지역 변수로만 사용이 가능하다. 이방법은 주로 라이브러리 같은 곳에서 사용하는 모습을 볼 수 있다.

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

   var MYAPP = {}; // 전역 네임스페이스 객체
   
   MYAPP.name = 'Lee';
   console.log(MYAPP.name); // Lee

   이방법은 네임스페이스로 분리하여 식별자의 충돌을 억제하는 장점이 있지만 네임스페이스 객체 자체가 전역 변수에 할당되기 때문에 유용한 방법은 아니다.

3. 모듈 패턴

• 모듈 패턴이란 클래스를 모방하여 관련이 있는 변수와 함수를 모아 즉시 실행 함수로 감싸 하나의 모듈을 만드는 방식이다.
• 모듈 패턴은 전역 변수의 억제, 캡슐화 구현의 특징을 가진다.

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

  return {
    in() {
      return ++num;
    },
    out() {
      return --num;
    }
  }
}());

console.log(Counter.num);
console.log(Counter.in());
console.log(Counter.out());
console.log(Counter.out());

4. ES6 모둘
   ES6 모듈을 사용하게 되면 전역변수를 사용할 수 없다.

• ES6 모듈은 파일 자체의 독자적인 모듈 스코프를 제공한다.
• ES6 모듈은 모던 브라우저( 크롬, 엣지16이상 )등에서 사용이 가능하며 IE를 포함한 구형 브라우저에서는 작동하지 않는다.