斐波那契数列 · 前端笔记

[TOC] # 概念斐波那契数列是以下一系列数字： > 0, 1, 1, 2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233, 377, 610, 987, ... 在种子数字 0 和 1 之后，后续的每一个数字都是前面两个数字之和。 斐波那契数列的一个有趣的性质是，数列的当前数字与前一个数字的比值无限趋近于黄金分割数， 1.61803398875… 你可以使用斐波那契数列来生成各种各样有趣的东西，比如黄金螺旋 (Golden Spiral)，自然界中存在许多黄金螺旋。 ![](https://img.kancloud.cn/67/04/6704a18268e8a66fc5d6d2b53a33bca5_1200x675.png) 斐波那契数列（意大利语：Successione di Fibonacci），又译为费波拿契数、费氏数列、黄金分割数列。 在数学上，斐波那契数列是以递归的方法来定义： > F(0)=0, F(1)=1, n>1时，F(n)=F(n-1)+F(n-2)。 根据该规则，返回第n个斐波那契数。 # 实现 ## 递归法 ~~~jsx function fibonacci(n) { if(n === 0 || n === 1) { return n; } console.log(`fibonacci(${n-1}) + fibonacci(${n-2})`) return fibonacci(n - 2) + fibonacci(n - 1) } fibonacci(5) ~~~ 思路：不断调用自身方法，直到n为1或0之后，开始一层层返回数据。问题：使用递归计算大数字时，性能会非常低；另外，递归造成了大量的重复计算(很多函数执行了多次)。 ## 数组缓存从上面代码的 console 中可以看出，执行了许多相同的运算。如果我们对中间求得的变量值，进行存储的话，就会大大减少函数被调用的次数。这是典型的以空间换时间。很明显，函数被调用的次数大大减少，耗时明显缩减。 ~~~jsx let fibonacci = function() { let temp = [0, 1]; return function(n) { let result = temp[n]; if(typeof result != 'number') { result = fibonacci(n - 1) + fibonacci(n - 2); temp[n] = result; // 将每次 fibonacci(n) 的值都缓存下来 } return result; } }(); // 外层立即执行 ~~~ ## 递推法（动态规划）动态规划：从底部开始解决问题，将所有小问题解决掉，然后合并成一个整体解决方案，从而解决掉整个大问题；递归：从顶部开始将问题分解，通过解决掉所有分解的小问题来解决整个问题； ~~~jsx function fibonacci(n) { let current = 0; let next = 1; let temp; for(let i = 0; i < n; i++) { temp = current; current = next; next += temp; } console.log(`fibonacci(${n}, ${next}, ${current + next})`); return current; } ~~~ 思路：从下往上计算，首先根据f(0)和f(1)算出f(2),再根据f(1)和f(2)算出f(3)，依次类推我们就可以算出第n项了。而这种算法的时间复杂度仅为O(n)，比递归函数的写法效率要大大增强。 1. 写法一： ~~~jsx function fib(n) { let current = 0; let next = 1; for(let i = 0; i < n; i++) { [current, next] = [next, current + next]; } return current; } ~~~ [\[解构赋值\]](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment)允许我们将值直接从数组中提取到不同变量中。因此我们可以用解构赋值，省略temp中间变量。 2. 写法二： ~~~jsx function fib(n) { let current = 0; let next = 1; while(n --> 0) { // while(n>0) {n--} n--的返回值是n [current, next] = [next, current + next]; } return current; } fib(10) ~~~ ## 尾调用优化 ~~~jsx // 在ES6规范中，有一个尾调用优化，可以实现高效的尾递归方案。 // ES6的尾调用优化只在严格模式下开启，正常模式是无效的。 'use strict' function fib(n, current = 0, next = 1) { if(n == 0) return 0; if(n == 1) return next; // return next console.log(`fibonacci(${n}, ${next}, ${current + next})`); return fib(n - 1, next, current + next); } ~~~ * * * \=======下面是科普====== # 什么是尾调用一句话，就是指某个函数的最后一步是调用另一个函数。 ~~~jsx // 用代码来说，就是B函数的返回值被A函数返回了。 function B() { return 1; } function A() { return B(); // return 1 } // 尾调用不一定出现在函数尾部，只要是最后一步操作即可 function f(x) { if (x > 0) { return m(x) } return n(x); } // 下面不属于尾调用：调用函数g之后，还有别的操作 function f(x){ let y = g(x); return y; } function f(x){ return g(x) + 1; } function f(x) { g(x); // 这一步相当于g(x) return undefined } ~~~ # 尾调用优化了解 js 的调用栈我们知道，当脚本要调用一个函数时，解析器把该函数添加到栈中并且执行这个函数，并形成一个栈帧（调用帧），保存调用位置和内部变量等信息。 如果在函数A的内部调用函数B，那么在A的调用帧上方，还会形成一个B的调用帧。等到B运行结束，将结果返回到A，B的调用帧才会销毁。此时如果函数B内部还调用函数C，那就还有一个C的调用帧，以此类推。例如递归操作，一个调用栈中如果保存了大量的栈帧，调用栈非常长，消耗了巨大的内存，会导致爆栈（栈溢出，stack overflow）。**后入先出**的结构。 ![](https://img.kancloud.cn/25/a3/25a338d40657a3a7b06787d18c090098_555x288.png) 当函数内部调用函数时，会在栈顶压入一个调用帧，该函数执行完后，弹出栈，接着再执行栈顶的调用帧。 尾调用之所以与其他调用不同，就在于它的特殊的调用位置。 那么现在，我们使用尾调用的话，将函数B放到了函数A的最后一步调用，**内层函数不引用外层函数的变量**，就不用保留外层变量的调用帧了。这样的话内层函数的调用帧，会直接取代外层函数的调用帧。调用栈的长度就会小很多。 当然，如果内层函数B使用了外层函数A的变量，那么就仍然需要保留函数A的栈帧，典型例子即是闭包。 ~~~jsx function f() { let m = 1; let n = 2; return g(m + n); } f(); ~~~ 这应当是一次尾调用。因为m+n的值是通过参数传入函数g内部，并没有直接引用，因此也不能说保存 f 内部的变量的值。 下面这种情况内层函数会引用外层函数的值，所以当执行到内层函数时外层函数的调用帧还会存在与当前调用栈中。 ~~~jsx function f() { let m = 1; let n = 2; return function() { return m+n; }; } f(); ~~~ 总得来说，如果所有函数的调用都是尾调用，即只保留内层函数的调用帧，做到每次执行时（例如递归操作），一个调用栈中调用帧只有一项，那么调用栈的长度就会小很多，这样需要占用的内存也会大大减少。这就是尾调用优化的含义。 # 什么时候会开启尾调用优化在ES5中，尾调用和其他形式的函数调用一样：脚本引擎创建一个新的函数栈帧并且压在当前调用的函数的栈帧上面。也就是说，在整个函数栈上，每一个函数栈帧都会被保存，这有可能造成调用栈占用内存过大甚至溢出。 在ES6中，strict模式下，满足以下条件，尾调用优化会开启，此时引擎不会创建一个新的栈帧，而是清除当前栈帧的数据并复用： * 尾调用函数不需要访问当前栈帧中的变量； * 尾调用返回后，函数没有语句需要继续执行； * 尾调用的结果就是函数的返回值； ES6的尾调用优化只在严格模式下开启，正常模式是无效的。这是因为在正常模式下，函数内部有两个变量，可以跟踪函数的调用栈。 > arguments：返回调用时函数的参数。 > func.caller：返回调用当前函数的那个函数。 尾调用优化发生时，函数的调用栈会改写，因此上面两个变量就会失真。严格模式禁用这两个变量，所以尾调用模式仅在严格模式下生效。 # 尾递归函数调用自身，称为递归。如果尾调用自身，就称为尾递归。 递归非常耗费内存，因为需要同时保存成千上百个调用帧，很容易发生"栈溢出"错误（stack overflow）。但对于尾递归来说，由于只存在一个调用帧，所以永远不会发生"栈溢出"错误。 由此可见，"尾调用优化"对递归操作意义重大。 # 递归函数的改写尾递归的实现，往往需要改写递归函数，确保最后一步只调用自身。做到这一点的方法，就是把所有用到的内部变量改写成函数的参数。 例如实现 fibonacci 函数需要用到两个中间变量 current 和 next，那就把这个中间变量改写成函数的参数。 ~~~jsx // 实现阶乘复杂度 O(n) function factorial(n) { if (n === 1) return 1; return n * factorial(n - 1); } // 尾递归只保留一个调用帧，复杂度 O(1) function factorial(n, total = 1) { if (n === 1) return total; console.log(`${n}*${total}`,n*total); return factorial(n - 1, n * total); } ~~~ # 问题 * 在V8引擎层面消除尾递归是一个隐式的行为，程序员写代码时可能意识不到自己写了死循环的尾递归，而出现死循环后又不会报出stack overflow的错误，难以辨别。 * 堆栈信息会在优化的过程中丢失，开发者调试非常困难。 # 参考资料 [js 实现斐波那契数列(数组缓存、动态规划、尾调用优化)](https://www.jianshu.com/p/bbc7e54a98d6)