了解递归中的函数执行顺序

Question

所以我正在浏览mergesort的代码，该代码使用递归。我对代码的工作方式有些困惑。由于混淆是关于递归的，因此我在下面放置了类似的代码，该代码已大大简化，仅关注递归部分：

var index = 0;

function parent() {
  console.log("parent called");
  if(index < 5) {
  index++;
  return child(parent()); 
  }
  else return 1;
}

function child() {
  console.log("child called"); 
}

parent();

以上代码输出：

"parent called"
"parent called"
"parent called"
"parent called"
"parent called"
"parent called"
"child called"
"child called"
"child called"
"child called"
"child called"

[我期望每个“父母被叫”之后都有一个“孩子被叫”，因为除非parent大于或等于5，否则每次child都会调用index。因此，在第一次调用parent之后，[ C0]调用parent，then调用child，依此类推。那么，为什么输出显示五个连续的“父代”，然后显示五个连续的“子代”？

[我试图用可视化工具来了解JS中调用堆栈的方式，但是我仍然不明白为什么parent只是将child放在堆栈中，但当时却没有执行？您可以在操作parent中看到它。

Answer 1

[执行时：

here

它必须执行child(parent()); 才能知道要发送到parent()的值。因此，它将一直调用child直到到达parent，然后一直将返回值传递给else return 1;

Answer 2

child

child(parent()); 必须先调用并且完成，然后它才能返回可以传递给parent的值。

因此第一个child被调用，它到达第二个parent链接，并递归调用第二个child(parent())，后者又到达第三个parent，依此类推，直到返回child(parent())并可以传递到1。