코어 자바스크립트 02실행 컨텍스트

dabin *.◟(ˊᗨˋ)◞.*·2021년 8월 1일
0

Javascript

목록 보기
20/25
post-thumbnail

✔ 스택과 큐의 개념


출처 : https://gohighbrow.com/stacks-and-queues/

  • 스택 : 출입구가 하나뿐인 깊은 우물 같은 데이터 구조다. a b c d 순서로 저장했다면 꺼낼 때는 d c b a 순서로 꺼낸다.
  • 큐 : 양쪽이 모두 열려있는 파이프 구조이다. 한쪽은 입력만, 다른 한쪽은 출력만 담당한다. 따라서 데이터를 a b c d 순서로 저장하면 a b c d 순서로 꺼낸다.

✔ 실행 컨텍스트란?

실행할 코드에 제공할 환경 정보들을 모아놓은 객체다. 하나의 실행 컨텍스트를 구성하는 방법으로는 전역공간, eval()함수, 함수 등이 있다. 컨텍스트를 구성하면 콜 스택에 쌓아 올려서 가장 위에 있는 컨텍스트와 관련 있는 코드를 실행해 전체 코드의 환경과 순서를 보장한다. 실행 컨텍스트는 세 가지 정보를 수집한다.

  1. VariableEnvironment

    • 최초 실행 시의 스냅샷을 유지
  2. LexicalEnvironment

    • 초기화 과정에서는 1과 동일
    • 함수 실행 도중 변경되는 사항 즉시 반영
    • environmentRecord : 매개변수명, 변수의 식별자, 선언한 함수의 함수명 등 수집
    • outerEnvironmentReference : 바로 직전 컨텍스트의 LexicalEnvironment 정보 참조
  3. ThisBinding

✔ 호이스팅

자바스크립트 엔진은 식별자들을 최상단으로 끌어올려놓은 다음 실제 코드를 실행한다. 함수를 실행하는 순간 함수의 실행 컨텍스트가 생성되고, 이 때 변수명과 함수 선언의 정보를 위로 끌어올린다. 변수는 선언부만 끌어올리고, 함수 선언은 전체를 끌어올린다. 변수의 할당부는 원래 자리에 남겨둔다.

✔ 함수 선언문과 함수 표현식

  • 함수 선언문 : function 정의부만 존재하고 별도의 할당 명령이 없는 것
function a(){   }
a();
  • 함수 표현식 : 정의한 function을 별도의 변수에 할당하는 것
var b = function (){   }
b();

함수 선언문은 전체를 호이스팅하고 함수 표현식은 변수 선언부만 호이스팅한다. 따라서 함수 선언문을 사용하게 되면 동일한 변수명에 서로 다른 값을 할당할 경우 나중 값이 이전 값을 덮어 씌운다. 따라서 협업을 위해 상대적으로 함수 표현식이 안전하다.

✔ 스코프

  • 스코프 : 식별자에 대한 유효범위
  • 스코프 체인 : 스코프를 안에서 바깥으로 차례로 검색해나가는 것
  • outerEnvironmentReference : 스코프 체인을 가능하게 하는 것
  • 전역변수 : 전역 공간에서 선언한 변수
  • 지역변수 : 함수 내부에서 선언한 변수

여러 스코프에서 동일한 식별자 선언한 경우 스코프 체인 상에서 가장 먼저 발견된 식별자에만 접근 가능하게 한다. 따라서 규모가 작을수록 스코프 체인을 타고 접근 가능한 변수는 늘어난다.

  • 변수 은닉화 : 함수 내부에서 변수를 선언했으면 전역 공간에서 선언한 동일한 이름의 변수에는 접근이 불가능하다. 따라서 가급적 전역변수 사용을 최소화하고자 노력하자.

✔ this

실행 컨텍스트를 활성화할 때 지정된 this가 저장된다. 함수를 호출하는 방법에 따라 값이 달라지고, 지정되지 않으면 전역객체가 저장된다.

profile
모르는것투성이

0개의 댓글