• 카테고리

    질문 & 답변
  • 세부 분야

    프로그래밍 언어

  • 해결 여부

    미해결

정리시간입니다.

21.08.11 20:50 작성 조회수 123

6

// 실행 콘텍스트 정리
function book() {
  function get() {
    return point;
  };
  var point = 123;
  return get();
};
console.log(book());
// 123
  • function 키워드를 만나서 function 오브젝트 생성
  • 이때 book()의 [[Scope]]에 글로벌 스코프 설정
  • 함수 표현식과 변수가 없어서 코드 실행
  • book() 함수를 호출
  • 엔진은 실행 콘텍스트를 생성하고 실행 콘텍스트 안으로 이동

-- 준비

  • 컴포넌트를 생성하여 실행 콘텍스트에 첨부
  • 환경 레코드를 생성하여 렉시컬 환경 컴포넌트에 첨부
    • book 함수 안의 함수, 변수를 환경 레코드에 바인딩
  • 외부 렉시컬 환경 참조를 생성하여 렉시컬 환경 컴포넌트에 첨부
    • 해당 사항 없음.
    • function 오브젝트의 [[Scope]] 참조 (글로벌 스코프)

실행 콘텍스트: {
  렉시컬 환경 컴포넌트: {
    환경 레코드: { },
    외부 렉시컬 환경 참조: { }
  },
  변수 환경 컴포넌트: { },
  this 바인딩 컴포넌트: { }
}

--초기화--

  • 함수 선언문을 만나 get function 오브젝트 생성
  • 이때 내부의 [[scope]]에 스코프 설정
  • 변수에 초기값 설정
  • 여기까지 외부에 실행 상태를 제공하지 않음

실행 콘텍스트: {
  렉시컬 환경 컴포넌트: { 
    환경 레코드: {  
      get: function(){},
      point: undefined
    },
    외부 렉시컬 환경 참조: { }
  },
  변수 환경 컴포넌트: { },
  this 바인딩 컴포넌트: { }
}

-- 실행

  • 함수 안의 코드 실행
    • point 변수에 123 할당
    • return get();
  • get() 함수 호출
  • 엔진은 실행 콘텍스트 생성, 실행 콘텍스트 안으로 이동

실행 콘텍스트: {
  렉시컬 환경 컴포넌트: { 
    환경 레코드: { },
    외부 렉시컬 환경 참조: {
      point: 123
    }
  },
  변수 환경 컴포넌트: { },
  this 바인딩 컴포넌트: { }
}

-- 다시 준비

  • 위의 준비 단계를 거친다.
  • 외부 렉시컬 환경 참조를 생성하여 렉시컬 환경 컴포넌트에 첨부
    • point: 123

-- 다시 초기화

  • 함수 안에 함수 선언문과 함수 표현식 변수가 없다.

-- 다시 실행

  • 함수 안의 코드를 실행한다.
    • return point;
  • 환경 레코드에서 먼저 찾고 없으면 외부 렉시컬 환경 참조에서 point를 찾는다.
  • 실행 콘텍스트 안의 관련된 함수와 변수 사용 가능
  • 외부 렉시컬 환경 참조에 있는 point 변수를 사용해서 123 반환
  • conosole에서 반환 값인 123이 출력됨.

이렇게 이해했습니다.!

답변 0

답변을 작성해보세요.

답변을 기다리고 있는 질문이에요.
첫번째 답변을 남겨보세요!