모던 자바스크립트 - 14(전역변수의 문제점), 15(let, const 키워드와 블록 레벨 스코프)

14. 전역변수의 문제점

전역변수의 문제점

	전역변수	지역변수
실행	명시적 호출없이 실행	함수가 실행되야 생김
스코프	전역 스코프	렉시컬 스코프(함수)
생명주기	전역 객체의 생명주기와 일치	렉시컬 스코프가 없어질 때 까지 생존
문제점	암묵적 결합(모든 코드가 전역변수 참조 및 변경가능) 긴생명주기(따라서 메모리 리소스도 오래 소비) 스코프 체인 상 종점에 존재(전역변수의 검색 속도가 가장 느림) 네임스페이스 오염(변수 이름 충돌)	스코프는 항상 좁은게 낫다따라서 전역변수보다 권장된다.

전역변수를 억제하는법

• 즉시실행함수: 모든 코드를 괄호로 감싸면 ⇒ 모든 변수는 즉시실행함수의 지역변수가 됨
• 네임스페이스 객체

var MYAPP = { name: "KIM" }

• ES6 module
  • ES6 모듈은 파일 자체의 독자적인 모듈 스코프를 제공
    • var 키워드로 선언한 변수는 더이상 전역변수도 아니고, window도 아님

  // type="module" 속성값을 추가하면 
  // 자바스크립트 파일은 모듈로 동작함
  <script type="module" src="lib.mjs"></script>
  

 

 

15. let, const 키워드와 블록 레벨 스코프

var 키워드로 선언한 변수의 문제점

 

• 중복선언가능

var x = 1;
var y = 1;

// var 키워드로 선언된 변수는 같은 스코프 내에서 중복 선언을 허용
// 초기화문이 있는 변수 선언문은 자바스크립트 엔진에 의해 var 키워드가 없는 것처럼 동작
var x = 100

// 초기화 문이 없는 변수 선언문은 무시됨
var y 

console.log(x) // 100
console.log(y) // 1

• 함수레벨 스코프

오직 함수 스코프만 지역스코프로 인정

블록스코프는 무시

var i = 10;

// for문에서 선언한 i는 전역 변수다.
// 이미 선언된 전역변수가 i가 있으므로 중복선언됨
for (var i = 0; i <5; i++) {
	console.log(i); // 0 1 2 3 4
}

console.log(i); // 5

• 변수 호이스팅

// 에러는 발생안됨
console.log(foo) // undefined

// 변수에 값을 할당(3. 할당 단계)
foo = 123;

console.log(foo); // 123

// 변수 선언은 런타임 이전에 자바스크립트 엔진에 의해 암묵적 실행됨
var foo;