실행 컨텍스트

코드의 실행 순서와 스코프를 기억

참고 예시 코드

const a = 1; // 전역 스코프
{
	const a = 2; // 블럭 1스코프
  {
    const a =3; // 블럭 2스코프
  }
}

위 코드처럼 각각의 블럭은 렉시컬 환경이라는 내부 오브젝트를 가지고 있다.

렉시컬 환경?

각 블럭마다 어떤 변수가 들어있고, 부모는 누구인지 가지고 있는 오브젝트를 뜻한다.

• 환경 레코드

1. 현재 블럭에 해당하는 정보를 담고있음

• 외부 환경 참조

1. 부모가 누구인지에 대한 정보를 담고있음

스코프 체인

• 당장 내 스코프에 변수값이 없다면, 부모 환경 레코드에서 값을 찾아본다. 이어져있는 것으로 체인.

전역 스코프 렉시컬 환경

• 환경 레코드 : a = 1
• 외부 렉시컬 환경 참조 : 없음. (얘가 전역 스코프이기 때문)

블럭 1 스코프 렉시컬 환경

• 환경 레코드 : a = 2
• 외부 렉시컬 환경 참조 : 전역 스코프 (전역 스코프가 부모. 스코프 체인 발생)

블럭 2 스코프 렉시컬 환경

• 환경 레코드 : a = 3
• 외부 렉시컬 환경 참조 : 블럭1 스코프 (블럭1 스코프가 부모. 스코프 체인)

요약 : 메모리 절약 뿐만 아니라, 성능을 위해서라도 변수는 최대한 필요한 곳에서 정의해야 한다.

필요한 곳에서 변수를 쓰지 않는다면, 계속해서 스코프 체인이 일어나서 성능에 좋지 않다.

내부에서 외부로는 스코프체인이 발생한다. 외부에서 내부로는 불가함.

호이스팅

사전적 의미 : 끌어올리다

자바스크립트 환경 : JS 엔진이 코드를 실행하기 전, 변수와 함수, 클래스의 선언문을 끌어 올리는 것을 뜻한다.

변수의 선언과 초기화를 분리한 후, 선언만 코드의 최상단으로 옮김.

예시 : let a = 300; 를 하단에 변수값 선언을 했다면, JS 엔진이 코드를 실행하기 전에 let a만 코드 최상단으로 끌어올림. 이때 let a는 아무런 값이 없는 상태이고, 엔진이 코드를 읽으면서 300이라는 값이 할당된다.

변수란?

1. 값을 저장하는 공간
2. 자료를 저장할 수 있는 이름이 주어진 기억장소

   var, let, const

var는 사용 X
let = 재할당이 필수로 필요한 경우에 선언
const = 변수값을 재할당하지 않을 때 선언
const를 사용하는 습관이 좋다.

<함수 호이스팅>

• 함수의 호이스팅은 함수의 선언문 전에 호출이 가능하게 해줌
• 함수의 선언문은 선언 이전에도 호출이 가능하다.

---

<변수 호이스팅>

• 변수(let, const)와 클래스는 선언만 호이스팅이 되고, 초기화는 되지 않는다.
• 초기화 전, 변수에 접근하면 컴파일(빌드) 에러가 발생한다.