본문 바로가기
Front-End

[JS] 실행 컨텍스트

by Judy 2020. 7. 6.

실행컨텍스트

식별자, 스코프, 호이스팅, 클로저 등의 동작 원리를 담고 있다.
스코프를 기반으로 식별자와 식별자에 바인딩된 값을 관리하는 방식과 호이스팅이 발생하는 이유, 클로저의 동작 방식에 대해 이해할 수 있다.

소스 코드의 타입

  • 전역 코드: 전역에 존재하는 소스 코드, 전역에 정의된 함수, 클래스 등의 내부 코드는 포함되지 않는다.
  • 함수 코드: 함수 내부에 존재하는 소스 코드, 함수 내부에 중첩된 함수, 클래스 등의 내부 코드는 포함되지 않는다.
  • eval 코드: 빌트인 전역 함수인 eval함수에 인수로 전달되어 실행되는 소스코드
  • 모듈 코드: 모듈 내부에 존재하는 소스 코드, 모듈 내부의 함수, 클래스 등의 내부 코드는 포함되지 않는다.

실행 컨텍스트의 스택

자바스크립트 엔진은 전역 코드를 평가하여 전역 실행 컨텍스트를 생성하고 함수가 호출되면 함수 코드를 평가하여 함수 실행 컨텍스트를 생성한다.

스택 자료구조로 관리된다. - 콜 스택
추가(push)되고 제거(pop)된다.

동기식 처리 모델과 비동기식 처리 모델

싱글 슬레드

자바스크립트 엔진은 다 하나의 실행 컨텍스트 스택을 갖는다. 여러 개의 실행 컨텍스트 스택에서 실행할 수 없으며, 동시에 두 가지 이상의 태스크를 동시에 실행할 수 없다.

비동기식 처리 모델


자바스크립트의 Timer 함수(setTimeout, setInterval), Ajax요청은 비동기식 처리 모델로 동작한다. 비동기식 처리 모델은 자바스크립트에 동시성을 부여하여 싱글 스레드의 약점을 보완해 준다.

단점!
순차적으로 실행되지 않아 가족성이 좋지 않고 콜백 헬을 유발하여 에러 처리가 어렵다는 단점이 있다.

렉시컬 환경

식별자와 식별자에 바인딩된 값.
상위 스코프에 대한 참조를 기록하는 환경으로 실행 컨텍스트를 구성하는 컴포넌트.
스코프와 식별자를 관리한다. 스코프를 구분하여 식별자를 등록하고 관리하는 저장소 역할을 하는 렉시컬 스코프이다.

'Front-End' 카테고리의 다른 글

[JS] Symbol  (0) 2020.07.23
[JS] 함수형 프로그래밍 - 기본  (0) 2020.07.20
[JS] 표현식과 문  (0) 2020.07.04
[JS] 변수  (0) 2020.06.30
[JS] 자바스크립트란?  (0) 2020.06.29