자바스크립트 입문_스택(stack)과 큐(queue)(실행컨텍스트)

(본 포스팅은 위키북스의 '코어자바스크립트' 책을 공부하면서 작성되었습니다_내돈내산)

 

• 스택(stack) : 출입구가 하나뿐인 우물같은 데이터 구조. 비어있는 스택에 순서대로 데이터 a,b,c,d를 저장했다면, 꺼낼때는 반대로 d,c,b,a의 순서로 꺼낼수밖에 없음.  LIFO 가 그것을 의미함.  스택의 크기를 넘는 데이터를 넣으려고 하면 overflow 에러가 발생함.
• 큐 (queue) : 양쪽이 모두 열려있는 파이프를 떠올리면 됨. 종류에 따라 양쪽모두 입력과 출력이 가능한 큐도 있지만, 보통은 한쪽은 입력만, 다른한쪽은 출력만을 담당하는 구조를 가짐. FIFO가 이를 의미하며, 데이터 a,b,c,d,를 저장했다면 꺼낼때도 역시 a,b,c,d,의 순서로 꺼낼수밖에 없음.

<실행컨텍스트: 실행할 코드에 제공할 환경 정보들을 모아놓은 객체>

동일한 환경에 있는 코드들을 실행할 떄, 필요한 환경 정보들을 모아 컨텍스트를 구성하고 이를 call stack에 쌓아올렸다가, 가장 위에 쌓여있는 컨텐스트와 관련있는 코드들을 실행하는 식으로 전체 코드의 환경과 순서를 보장함.

// ------------------- (1)
var a = 1;
function outer() {
  function inner() {
    console.log(a);
    var a = 3;
    // --------------- (2)
  }
  inner(); // -------- (3)
  console.log(a);
  // ----------------- (4)
}
outer(); // ---------- (5)
console.log(a);
// ------------------- (6)

 

1. 자바스크립트를 처음 실행한 순간 전역컨텍스트가 콜스택에 담김. (전역컨텍스트는 일반적인 실행컨텍스트와 특별히 다를것 없음)
2. outer 함수가 호출되면 그 정보를 outer 실행컨텍스트로 옮겨줌(전역 컨텍스트의 코드실행을 중단하고 outer 함수 내부의 코드를 순차적으로 실행함.)
3. inner 함수의 실행컨텍스트가 가장위에 담기면 outer컨텍스트와 관련된 실행을 중단하고 inner 함수 내부의 코드가 순차대로 진행됨.
4. inner 함수의 작동이 끝나면 함수가 종료되고 inner 실행 컨텍스트가 콜스택에서 제거됨. 그러면 아래에 있던 outer 컨텍스트가 콜스택의 맨 상단에 존재하므로 이어서 outer 함수를 실행하게 됨. outer 함수의 실행이 종료되면 더이상 실행할 코드가 남아있지 않아 전역컨텍스트도 제거된 빈 콜스택만 남게 됨.

<실행컨텍스트에서 수집하는 정보>

• VariableEnvironment: 현재 컨텍스트 내의 식별자들에 대한 정보(snapshot) + 외부 환경정보(snapshot).
  : 선언시점의 LexicalEnvironment의 스냅샷형태로, 변경사항이 반영되지 않음.
• LexicalEnvironment: 처음에는 VariableEnvironment와 같지만 변경사항이 실시간으로 반영됨.
• ThisBinding: this 식별자가 바라봐야 할 대상 객체