js

js deep dive [전역 변수의 문제점.]

mallang_col 2022. 10. 31. 10:11

14.1 변수의 생명주기.

14.1.1 지역 변수의 생명 주기

변수는 선언에 의해 생성되고 할당을 통해 값을 갖는다.

그리고 언젠가 소멸한다. 즉 변수는 생물과 유사하게 생성되고 소멸되는 생명 주기가 있다.

생명주기가 없다면 프로그램을 종료하지 않는 한 영원히 메모리 공간을 점유하게 된다.

변수는 선언된 위치에서 생성되고 소멸한다. 전역 변수의 생명 주기는 애플리케이션의 생명 주기와 동일

function hi() {

    let name = "jihkang"

    console.log(name);

}

이때 name 의 생명주기는 function hi 의 생명주기와 동일하다.

자바스크립트의 경우 이때 function hi 를 아무도 참조 하지 않는다면,
가비지 콜렉터를 이용하여 가용 메모리풀에 반환된다.

14.1.2

전역 코드는 명시적인 호출 없이 실행된다.

전역 코드는 결국 마무리 함수가 동작하고 나서 종료된다. 이때

var 로 선언한 전역 변수의 경우 window 객체의 프로퍼티가 되기 때문에

창이 닫히게 되면 window가 종료되고 가비지 콜렉터에 들어가게 된다.

var test = {
  mem_test : {
    value : 50
  }
};

와 같은 함수에서
이때 각 개체들은 참조되고 있음으로 함수가 프로그램이 끝나기 전까지
종료되지 않는다 허나

var test = {
  mem_test : {
    value : 50
  }
};

test = 1; 과 같이
다른 값을 할당 한다면

이전 object = {
  mem_test : {
    value : 50
  }
}

이전 오브젝트를 참조하는 곳이 없어짐으로 이때 js 에서는 gc.를 동작 시킨다.
이것이 참조가 되어 있지 않은경우에는 js 에서 gc 를 처리하는 방법 이다

14.2 전역 변수의 문제점.
암묵적 결합

위와 같은 코드들이 전역 변수에서 선언이 되어있다고 한다면 어디서나 참조하고 할당 할 수 있다.
이때 어떤 곳에서 변경을 할 수 있다는 것을 의미함으로 상태가 의도치 않게 변경 되는 일이 발생 할 수 있다.

var time = new Date();
function get_time() {
    time = new Date();

    console.log(time.getSeconds);
}

과 같은 함수가 있다고 하자 .
이때 get_time 을 어딘가에서 호출 하게 되면
time 의 값은 변경되게 되고 이때
get_time에서만 변경되어야 하는 경우 일 수도 있다.

긴 생명 주기
전역변수는 결국 프로그램에서 가장 오래 소비되는 변수 이기도 함으로
지속적으로 메모리 리소스를 가지고 있는다고 생각 할 수 있다
또한 값의 변경 또한 언제든 변경 될 수 있음을 알 수 있다.
위와 같은 이유로 무분별한 전역 변수는 선호되지 않는 것 이다.

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

14.3.1 즉시 실행 함수.
실행 함수를 단 한번만 호출되고 모든 코드를 즉시 실행함수로 감싸면
모든 변수가 지역변수가 된다.

(function () {
   var test = "test";
   console.log(test);
}());

14.3.2 네임스페이스 객체

전역에 네임스페이스 object 를 선언하고 여기에 프로퍼티로 추가하는 방법

하지만 위는 전역 변수를 억제하는 방법인데 선언 자체가 전역변수를 선언하는것이니 좀
아이러니 한 상황이 아닌가 싶음.

14.3.3 모듈 패턴
결국 14.3.1 에서 나온 즉시 실행 함수를 변수에 할당하여 사용 하는 방법으로
이를 통해 숨기고 싶은 변수나 동작을 외부에 노출 하지 않고 사용 할 수 있다.

var print = (function () {
   var name = "test";
   return {
      test() { 
         console.log("test" + name);
      }
   }
}());

print();
console.log(print.name) == undefined

14.3.4 ES6 모듈

이때 까지 나왔던 내용들은 결국 ES5 버전 까지를 위한 내용 이라고 할 수 있다.
ES6 의 경우 파일별 독자적인 모듈 스코프를 제공 함으로
이제는 var 와 같은 변수가 전역 변수가 기능을 하지 못한다.