[부스트코스] 자바스크립트 함수 호출 스택

함수 호출

아래 함수를 실행해보자. run이 호출되고 그 다음에 printName이 호출된다.

// 함수의 호출.
function printName(firstname) {
    var myname = "bell";
    return myname + " ," +  firstname;
}

function run(firstname) {
   firstname = firstname || "Youn";
   var result = printName(firstname);
   console.log(result);
}

run('kim');

// bell, kim

 

함수호출과 Stack

https://medium.com/@gaurav.pandvia/understanding-javascript-function-executions-tasks-event-loop-call-stack-more-part-1-5683dea1f5ec

 

메모리에서는 우측의 Call Stack에서와 같이 순서대로 쌓이게 된다.

bar 함수에서 foo를 호출한 후 foo함수의 결과를 받아올 때 까지 bar함수는 메모리 공간에서 사라지지 못하고 기다리고 있다.

foo의 경우에는 실행이 끝나고 return문이 실행되면 메모리 공간에서 사라진다.

다시 말해 Call Stack이 없어지는 것이다.

 

call stack은 이렇게 동작하지만, 함수를 연속적으로 계속 호출하면 call stack이 꽉 차버리면서 더 실행되지 못하고 오류가 발생할 수 있다. 브라우저에서는 대부분 지정된 횟수만큼만 call stack을 쌓게 미리 설정해둔 경우가 많다고 한다.

따라서 혹시 개발 중에 Maximum call stack size exceeded 오류가 발견된다면 call

 

* 크롬 개발자 도구 혹은 IDE를 통해 호출 스택을 확인할 수 있다.

 

 

[부스트코스 관련 강의 링크]

자바스크립트 함수 호출 스택 - https://www.edwith.org/boostcourse-web/lecture/16696/

[LECTURE] 4) 자바스크립트 함수 호출 스택 : edwith