호이스팅, 스코프

스코프

• 스코프는 어떤 변수가 선언된 공간 또는 환경을 말합니다.
  • 어떤 변수의 스코프는 해당 변수가 접근될 수 있는 범위입니다.
  • 참고 : 'strict mode' 쓰면 js 가 원칙대로 실행될 수 있도록 원한다면 넣으면 에러에 대해서 제대로 확인할 수 있다.
• 글로벌 스코프(전역 스코프)
  • 함수나 블록 바깥에 선언된 변수
  • 어디에서든지 접근 가능

​

• 함수 스코프
  • 함수 안쪽에서만 접근 가능한 변수
  • 지역 스코프라고도 불린다.

​

• 블록 스코프(ES6)
  • 블록 ({}) 안에서만 접근 가능하다.
  • let, const 에만 적용
  • 함수도 블록 스코프!

​

​

스코프 체인

• 하위 스코프는 상위 스코프를 스코프 체인을 통해 변수를 참조해서 사용할 수 있다.
• 스코프 체인(scope chain)은 함수의 감춰진 프로퍼티인 [[Scope]]로 참조할 수 있다.

console.dir()을 사용하면, 개발자 도구로 쉽게 확인이 가능하다.

​

​

호이스팅

• 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것입니다.
  • var와 함수 선언문은 호이스팅이 일어나고
  • const, let, 함수 표현식은 호이스팅이 일어나지 않습니다. (더 안전하다.)
    • why?

if(!numProducts) deleteShoppingCart(); var numProducts = 10; function deleteShoppingCart() { console.log('모든 상품 삭제'); // 왜 실행?? numProducts 가 undefined, var를 쓰지 말아라 }

 

이때 호이스팅이 발생해서 numProducts가 선언된 상태가 이미 되어버려 undefined가 되고

falsy한 값이기 때문에 deleteShoppingCart()가 실행되어서 모든 상품 삭제가 찍히게 된다.

​

초기화 되기 전에 실행되는 것을 막기 위해 쓴다!

	호이스팅?	초기값	스코프
함수 선언식	YES	실제 함수	블록
var 변수	YES	undefined	함수
let, const 변수	NO	uninitialized	블록
함수 표현식, 화살표 함수	var를 쓰는지, let,const를 쓰는지에 따라 다르다.