一、堆栈溢出

1-1 基本概念

  • JS中的数据存储分为栈和堆,代码运行都需要计算存储空间。栈遵循先进后出的原则,所以程序从栈底开始运行计算,程序内部函数的调用以及返回值会不停的执行进栈和出栈的操作,栈内被所占的资源也在不断的对应变化,但是一旦调用即进栈操作过多,返回即出栈不够,这时候就会导致栈满了,再进栈的就会溢出来。
  • 是指内存空间已经被申请完,没有足够的内存提供了

    1-2 递归导致堆栈溢出

    1. function isEven (num) {
    2. if (num === 0) {
    3. return true;
    4. }
    5. if (num === 1) {
    6. return false;
    7. }
    8. return isEven(Math.abs(num) - 2);
    9. }
    10. console.log(isEven(10)); // true
    11. console.log(isEven(10000)); // Outputs: Uncaught RangeError: Maximum call stack size exceeded
    堆栈溢出原因:每次执行代码时,都会分配一定尺寸的栈空间(Windows系统中为1M),每次方法调用时都会在栈里储存一定信息(如参数、局部变量、返回值等等),这些信息再少也会占用一定空间,成千上万个此类空间累积起来,自然就超过线程的栈空间了。

解决方案1:使用闭包

  1. function isEven (num) {
  2. if (num === 0) {
  3. return true;
  4. }
  5. if (num === 1) {
  6. return false;
  7. }
  8. return function() {
  9. return isEven(Math.abs(num) - 2);
  10. }
  11. }
  12. console.log(isEven(4)()());
  13. // 优化调用
  14. function isEven(n) {
  15. /**
  16. * [isEvenInner 递归]
  17. * @param {[type]} num [description]
  18. * @return {Boolean} [description]
  19. */
  20. function isEvenInner (n) {
  21. if (n === 0) {
  22. return true;
  23. }
  24. if (n === 1) {
  25. return false;
  26. }
  27. return function() {
  28. return isEvenInner(Math.abs(n) - 2);
  29. }
  30. }
  31. /**
  32. * [trampoline 迭代]
  33. * @param {[type]} func [description]
  34. * @param {[type]} arg [description]
  35. * @return {[type]} [description]
  36. */
  37. function trampoline (func, arg) {
  38. var value = func(arg);
  39. while(typeof value === "function") {
  40. value = value();
  41. }
  42. return value;
  43. }
  44. return trampoline.bind(null, isEvenInner)(n);
  45. }
  46. console.log(isEven(10000)); // Outputs: true

每次都返回一个匿名函数,再去调用上面的方法,形成一个闭包,匿名函数完后执行相关的参数和局部变量将会释放,不会额外增加堆栈大小,保证每次都是新的。

二、内存泄漏

2-1 基本概念

内存泄漏是指申请的内存执行完后没有及时的清理或者销毁,占用空闲内存。内存泄露过多的话,就会导致后面的程序申请不到内存,因此内存泄露会导致内部内存溢出

2-2 导致内存泄漏的情况

  • 全局变量过多引起的内存泄露
  • 闭包
  • 没有被清除的计时器