모던 자바스크립트 Deep Dive 14장 정리 - 전역 변수의 문제점

Hyodduru ·2022년 5월 25일
0
post-thumbnail

14장 전역 변수의 문제점

14.1 변수의 생명 주기

🧐 전역변수와 지역변수의 생명주기는 어떻게 다른가?

전역 변수의 생명 주기는 애플리케이션의 생명 주기와 같다. 하지만 함수 내부에서 선언된 지역 변수는 함수가 호출되면 생성되고 함수가 종료하면 소멸한다. (즉 지역 변수의 생명 주기 = 함수의 생명 주기)

🧐 변수의 생명주기?

메모리 공간이 확보된 시점부터 메모리 공간이 해제되어 가용 메모리 풀(memory pool)에 반환되는 시점까지

🔖 함수 내부에서 선언된 지역 변수 => 함수가 생성한 스코프에 등록된다.(함수가 생성한 스코프 : 렉시컬 환경이라 부르는 물리적인 실체가 있음), 변수는 자신이 등록한 스코프가 소멸될 때 까지 유효. => 메모리 공간 더이상 누구도 참조하지 않을 때 가비지 콜렉터에 의해 해제 => 가용 메모리 풀에 반환

🧐 호이스팅은 무엇을 단위로 동작하나?

👉 스코프를 단위로 동작.
전역변수의 호이스팅은 전역 변수의 선언이 전역 스코프의 선두로 끌어 올려진 것처럼 동작.
지역변수의 호이스팅은 지역 변수의 선언이 지역 스코프의 선두로 끌어 올려진 것처럼 동작.

🧐 전역 객체(global object)란?

코드가 실행되기 이전 단계에 자바스크립트 엔지에 의해 어떤 객체보다도 먼저 생성되는 특수한 객체. 클라이언트 사이드 환경(브라우저)에서는 window, 서버 사이드 환경(Node.js)에서는 global 객체를 의미. ES11에서 globalThis로 통일되었다.

👉 var 키워드로 선언한 전역 변수의 생명 주기는 전역 객체의 생명 주기와 일치한다. (var 키워드로 선언한 전역 변수는 전역 객체 window의 프로퍼티)

14.2 전역 변수의 문제점

🧐 전역 변수의 문제점?

✔️ 모든 코드가 전역 변수를 참조하고 변경할 수 있는 암묵적 결합을 허용한다. 👉 변수의 유효 범위 클수록 코드의 가독성 나빠지고, 상태가 변경될 수 있는 위험성 높아짐.
✔️ 긴 생명 주기 👉 메모리 리소스 오랜 시간 소비함. 전역 변수의 상태를 변경할 수 있는 시간도 길고 기회도 많음.
✔️ 스코프 체인 상에서 종점애 존재 👉 전역 변수의 검색 속도가 가장 느리다.
✔️ 네임스페이스 오염 👉 파일이 분리되어 있다 해도 하나의 전역 스코프롤 공유함.

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

전역 변수를 반드시 사용해야 할 이유를 찾지 못한다면 지역 변수를 사용해야 한다. 변수의 스코프는 좁으면 좁을수록 좋다.

🧐 전역 변수 사용 억제하는 방법?

✔️ 즉시 실행 함수 👉 모든 코드를 즉시 실행 함수로 감싸면 모든 변수는 즉시 실행 함수의 지역 변수가 된다.
✔️ 네임스페이스 객체 👉 전역에 네임스페이스 역할을 담당할 객체를 생성하고 전역변수처럼 사용하고 싶은 변수를 프로퍼티로 추가하기
✔️ 모듈 패턴 👉 외부에 노출하고 싶지 않고 지역 변수로 쓰고 싶지 않은 변수는 프라잇 변수로 만든다. (return 되는 값 : 퍼블릭 멤버, return되지 않는 값 : 프라이빗 멤버)
✔️ ES6 모듈 👉 파일 자체의 독자적인 모듈 스코프를 제공. (전역 변수 사용할 수 없음)

🔖 모듈 패턴? 클래스를 모방해서 관련이 있는 변수와 함수를 모아 즉시 실행 함수로 감싸 하나의 모듈을 만든다. 자바스크립트의 강력한 기능인 클로저를 기반으로 동작한다. 전역변수의 억제, 캡슐화 구현 가능.

🔖 캡슐화? 객체의 상태를 나타내는 프로퍼티와 프로퍼티를 참조하고 조작할 수 있는 동작인 메서드를 하나로 묶는 것. 캡슐화는 객체의 특정 프로퍼티나 매서드를 감출 목적으로 사용하는데 이를 정보 은닉이라고 함.

profile
꾸준히 성장하기🦋 https://hyodduru.tistory.com/ 로 블로그 옮겼습니다

0개의 댓글