详解JS函数stack size计算方法
更新时间：2018年06月18日 09:10:17 作者：Fundebug
本篇文章给大家分享了关于JS函数中stack size计算方法的相关知识点，对此有需要的朋友可以跟着学习下。
为了保证可读性，本文采用意译而非直译。另外，本文版权归原作者所有，翻译仅用于学习。
如果你写了一个一直调用自身的死循环，那么恭喜你，很快就可以看到报错：Uncaught RangeError: Maximum call stack size exceeded。那么这个call stack size有多少呢？
1. 计算方法
如下的方法可以为你计算出你使用的JavaScript引擎可以支持多深的调用(由Ben Alman的一段代码获得灵感)：
function computeMaxCallStackSize() {
try {
return 1 + computeMaxCallStackSize();
} catch (e) {
// Call stack overflow
return 1;
}
}
运行得到如下三个结果：
- Node.js: 11034
- Firefox: 50994
- Chrome: 10402
这些数字代表了什么呢？Mr.Aleph告诉我在V8，可调用的层数基于两个方面：1. 栈的大小；2. 每一栈帧的大小(用于记录函数参数和局部变量)。你可以在computeMaxCallStackSize声明局部变量来测试，你会发现数字变小。
2. ECMAScript 6中尾递归优化
ECMAScript 6支持尾递归优化：如果一个函数的最后一个操作是函数调用，那么将会用“跳转”而不是“子调用”。也就是说如果你将computeMaxCallStackSize重写成如下形式，在ES6的严格模式下，就会一直运行了。
function computeMaxCallStackSize(size) {
size = size || 1;
return computeMaxCallStackSize(size + 1);
}
3. 亮点评论
- Andrei: “ECMAScript 6”版本的代码根本跑不通。虽然size会被更改，但是最终并没有值返回。
- 回复Andrei: 有趣！你不能用这段代码去计算stack size。在ES6下，这段代码会一直运行，因此不会返回数据。在其它情况下，会返回RangeError。为了使其工作，我把代码重写了一下：
var computeMaxCallStackSize = (function() {
return function() {
var size = 0;
function cs() {
try {
size++;
return cs();
} catch(e) {
return size + 1;
}
}
return cs();
};
}());
相关文章
最近发现在对JS的学习中有很多朋友对this的指向问题还是有很大的误区或者说只是大致了解,但是一旦遇到复杂的情况就会因为this指向问题而引发各种bug。所以这篇文章主要给大家介绍了关于js中this的指向问题的相关资料，需要的朋友可以参考下2018-11-11
本文给大家总结了js动态设置css样式的常见方法，非常实用，对js设置css样式相关知识感兴趣的朋友一起学习吧2016-11-11
在javascript将NodeList作为Array数组处理的方法
在Web前端编程中，我们通常会通过document.getElementsByTagName的方法取出一组相同标签的dom元素。2010-07-07
这篇文章主要介绍了微信小程序学习笔记之目录结构、基本配置,结合实例形式详细分析了微信小程序的相关注册、配置及基本使用方法,并配以图片加以说明,需要的朋友可以参考下2019-03-03
现在网站换皮肤是比较常见的功能，大多数论坛都有的，要想实现这样效果可以看如下代码.2009-11-11
以前我们说的内存泄漏，通常发生在后端，但是不代表前端就不会有内存泄漏。特别是当前端项目变得越来越复杂后，前端也逐渐称为内存泄漏的高发区。本文就带大家了解一下Javascript的内存泄漏2022-06-06
这篇文章主要介绍了js中confirm实现执行操作前弹出确认框的方法,是执行删除等操作时常用的功能,非常具有实用价值,需要的朋友可以参考下2014-11-11
最近回头看看自己以前写的游戏代码，总结出几个可以优化改进的地方，当然还有很多地方需要优化，还希望大家指出来。2010-11-11
这篇文章主要为大家分享了Bootstrap简单表单显示学习笔记,具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-11-11
typescript使用 ?. ?? ??= 运算符的方法步骤
本文主要介绍了typescript使用 ?. ?? ??= 运算符的方法步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧2024-01-01
最新评论