Javascript 中 RangeError: Maximum call stack size exceeded 错误

“RangeError: Maximum call stack size exceeded”错误发生在函数被多次调用以至于调用超出调用堆栈限制时。 要解决该错误,需要指定退出递归必须满足的基本情况。

下面是错误发生的示例。

function example() {
  // ⛔️ RangeError: Maximum call stack size exceeded
  example();
}

example();

Javascript RangeError

我们调用该函数,然后该函数调用自身,直到超过调用堆栈限制。

要解决此错误,需要指定函数停止调用自身的条件。

let counter = 0;

function example(num) {
  if (num < 0) {
    return; // 👈️ 这会阻止函数无休止地调用自己
  }

  counter += 1;
  example(num - 1);
}

example(4);

console.log(counter); // 👉️ 5

这次我们检查每次调用时是否使用小于 0 的数字调用函数。

如果数字小于 0,我们只需从函数返回,这样就不会超过调用堆栈的限制。

如果传入的值不小于 0,我们调用传入的值减去 1 的函数。这使我们继续朝着满足 if 检查的情况前进。

递归函数调用自身,直到满足条件。 如果你的函数中没有条件满足,它将调用自己,直到超过最大调用堆栈大小。

如果我们有一个在某处调用函数的无限循环,我们也可能会收到此错误。

function sum(a, b) {
  return a + b;
}

while (true) {
  sum(10, 10);
}

我们的 while 循环不断调用该函数,并且由于我们没有退出循环的条件,我们最终超出了调用堆栈大小。

这与在没有基本条件的情况下调用自身的函数非常相似。 如果我们使用 for 循环,情况也是如此。

下面是一个示例,说明如何指定退出循环必须满足的条件。

function sum(a, b) {
  return a + b;
}

let total = 0;

for (let i = 10; i > 0; i--) {
  total += sum(5, 5);
}

console.log(total); // 👉️ 100

如果 i 变量等于或小于 0,则 for 循环中的条件不满足,所以我们退出循环。

如果我们无法准确跟踪错误发生的位置,请查看浏览器控制台或终端(如果使用 Node.js)中的错误消息。

如果我们多次导入同一个文件,也可能会发生错误,例如 在同一页面上多次加载 jQuery 脚本。

我们可以通过在浏览器的开发人员工具中打开“网络”选项卡并刷新页面来检查页面上加载了哪些脚本。

免责声明:
1.本站所有内容由本站原创、网络转载、消息撰写、网友投稿等几部分组成。
2.本站原创文字内容若未经特别声明,则遵循协议CC3.0共享协议,转载请务必注明原文链接。
3.本站部分来源于网络转载的文章信息是出于传递更多信息之目的,不意味着赞同其观点。
4.本站所有源码与软件均为原作者提供,仅供学习和研究使用。
5.如您对本网站的相关版权有任何异议,或者认为侵犯了您的合法权益,请及时通知我们处理。
火焰兔 » Javascript 中 RangeError: Maximum call stack size exceeded 错误