호출 스택

예제

function greeting() {
  // [1] 일부 코드가 들어갑니다.
  sayHi();
  // [2] 일부 코드가 들어갑니다.
}
function sayHi() {
  return "Hi!";
}

// `greeting` 함수를 호출합니다.
greeting();

// [3] 일부 코드가 들어갑니다.

위 코드는 다음과 같이 실행될 것입니다.

1. greeting() 함수에 도달할 때까지, 모든 함수를 무시합니다.

2. greeting() 함수를 호출 스택 리스트에 추가합니다.

   참고 : 호출 스택 리스트. - greeting

3. greeting 함수 내부의 모든 코드를 실행합니다.

4. sayHi() 함수를 호출합니다.

5. sayHi() 함수를 호출 스택 리스트에 추가합니다.

   참고 : 호출 스택 리스트. - sayHi - greeting

6. sayHi() 함수의 끝에 도달할 때까지, 함수 내부의 모든 코드를 실행합니다.

7. sayHi() 가 호출된 라인으로 돌아와 greeting() 함수의 나머지를 계속 실행합니다.

8. 호출 스택 리스트에서 sayHi() 함수를 제거합니다.

   참고 : 호출 스택 리스트. - greeting

9. greeting() 함수 내부의 모든 코드가 실행되었을 때, 이를 호출한 라인으로 돌아와 JS 코드의 나머지를 계속 실행합니다.

10. 호출 스택 리스트에서 greeting() 함수를 제거합니다.

요약하면, 우리는 빈 호출 스택으로 시작하였습니다. 함수를 호출할 때마다 자동으로 호출 스택에 추가되고, 해당 코드가 모두 실행된 후, 호출 스택에서 자동으로 제거됩니다. 결국, 마찬가지로 빈 호출 스택으로 끝납니다.

같이 보기

• 위키피디아의 콜 스택
• 용어 사전
  • Call stack
  • Function