javascript尾递归优化

JS中的递归

我们来看一个阶乘的代码

function foo( n ){
   
  if(n <= 1){
   
    return 1;
  }
  return n * foo( n - 1 );
}

foo(5);  // 120

下面分析一下，代码运行过程中,执行上下文栈是怎么变化的

1. 这个代码是在全局作用域中执行的，所以在foo函数得到执行之前，上下文栈中就已经被放入了一个全局上下文。之后执行一个函数，生成一个新的执行上下文时，JS引擎都会将新的上下文push到该栈中。如果函数执行完成，JS引擎会将对应的上下文从上下文栈中弹出

2. 一开始执行foo函数的时候，JS引擎会创建foo的执行上下文，将该执行上下文push进上下文栈。然后开始执行foo中的代码。

现在上下文栈中已经有了两个执行上下文了

3. 在执行到foo中代码快结束时，return表达式中，又调用了foo函数。所以又会创建一个新的执行上下文。并且JS引擎会把这新的执行上下文push到上下文栈中。

现在上下文栈中已经有了三个执行上下文了

4. 开始重复第3步的执行。一直到n<=1，才不会有新的执行上下文产生。

此刻上下文栈中，已经有了6个上下文了（包含了全局上下文）

设想一下

1. 如果刚开始调用的时候，传入n的初始值为100，到n<=1时，上下文栈中会有几个上下文。101个。
2. 如果初始值为1000呢？到n<=1时，会有1001个执行上下文
3. 也就是说，传入的初始值越大，执行上下文栈中，就会有越多的执行上下文🥲
4. 对于上下栈，它的空间是有限的，一旦存放的上下文占用内存产出了它的最大内存，就会出现栈溢出。RangeError: Maximum call stack size exceeded
5. 而在chrome中，不仅会对栈的空间有限制，还会对函数的递归次数有限制

递归优化

我们来看一个样例代码

function outer()