JS - 스코프 | NonoLog

스코프

모든 식별자는 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할수 있는 유효범위가 결정 -> 이게 스코프

var x = 'gloabal';

funciton foo() {
  var x = 'local';
  console.log(x);
}

foo() // local
console.log(x) // global

JS 가 식별자를 결정하는 방법: 참조된 위치 기준으로 가장 가까운 스코프에서 선언된 변수를 참조.

같은 스코프 내에서 중복선언 불가! var 제외...

전역 변수는 어디서든지 참조할 수 있다

지역 변수는 자신의 지역 또는 하위 지역에서 유효하다. 안에서 바깥은 참조하는 것은 가능하지만, 밖에서 안을 참조하는게 안됨.

스코프 체인. 변수가 참조되면, 참조하는 스코프에서 해당 변수의 선언 여부를 검색. 없네? 상위 스코프로 이동. 같은 작업 반복. 부모와 자식 관계인 상속과도 유사. 자식이 부모의 자원을 사용하는 것은 용납, 부모가 자식의 자원을 이용하는건 ㄴㄴ

블록레벨 (if, for, while, try/catch)

렉시컬 스코프

자바스크립트에서는 함수가 어디서 정의했는지에 따라 상위 스코프를 결정. 전역에서 정의된 함수라면, 그들의 상위 스코프는 어디서 호출되었는지랑 관계 없이 항상 전역.

var x = 1

function foo() {
  var x = 10
  bar()
}

function bar() {
  console.log(x)
}

foo() // 1 bar 를 foo 스코프 안에서 참조하고 있지만, 이건 중요하지 않다... 중요한건 bar 는 전역에서 정의된 함수라는 것!
bar() // 1

전역변수

보통 지역변수는 참조가 안되면 죽어 -> 전역은 영원히 메모리를 차지하는...

아무도 지역 스코프가 차지하는 메모리 공간을 참조하지 않으면, 가비지 콜렉터 등장..! 함수 내부에서도 호이스팅 발생... 변수의 수명은 해당 스코프의 생명주기와 일치... 지역 변수의 생명주기: 등록된 스코프가 소멸할 때까지 전역 변수의 생명주기: 페이지 닫힐 때 까지

암묵적 결합: 누구나 참조할 수 있다는 점은, 해당 변수의 변화흐름을 명시적으로 파악하기 어려움
긴 생명 주기: 메모리 리소스 오래 소비
스코프 체인 상 종점: 변수를 참조할 때, 스코프 단위로 차례로 검색. 전역변수는 종점이니까, 가장 마지막에 검색됨.
네임스페이스 오염... 다른 파일에서도 전역 변수는 참조 가능...

변수의 스코프는 좁으면 좁을수록 좋아! => 무분별한 전역 변수를 줄이자

즉시 실행 함수로 일회성 변수 생성
네임스페이스 객체: 전역에 네임스페이스 객체 만들어. 전역으로 만들 변수는 해당 객체에 저장. 네이밍 적으로 구분해서 다른 파일에서 전역 건들지 마! const = myApp = . myApp.
모듈 패턴: 클로져와 함께...! 정보 은닉과 캡술화 가능!
es6. type = 'module'