JavaScript递归函数详解与应用实例
时间:2026-01-15 16:51:38 465浏览 收藏
本篇文章向大家介绍《JavaScript递归函数详解及应用场景》,主要包括,具有一定的参考价值,需要的朋友可以参考一下。
递归函数是自身调用的普通函数,必须有明确终止条件以防栈溢出;适用于树形遍历、分治算法、回溯等自相似问题;手写flatten需防循环引用和类型误展;尾递归优化在JS中基本不可用。

递归函数就是自己调用自己的函数
递归函数不是语法糖,也不是特殊关键字,它只是普通函数——只要在函数体内部直接或间接调用了自身,就构成递归。关键在于必须有明确的终止条件(base case),否则会无限调用导致栈溢出(RangeError: Maximum call stack size exceeded)。
常见错误是把递归写成“永动机”:比如忘记写 if 终止判断,或终止条件永远不满足(如递归参数没变化、用 == 比较浮点数导致跳过出口)。
什么时候该用递归而不是循环
递归天然适合处理具有自相似结构的数据或问题,尤其是当“子问题”和原问题形式完全一致时。强行用循环反而需要手动维护状态栈,代码更难读。
- 遍历树形结构(DOM 节点、JSON 嵌套对象、文件目录)
- 解析嵌套括号、HTML 标签、表达式(如
1 + (2 * (3 - 4))) - 分治类算法:快速排序、归并排序、二分查找(虽可用循环,但递归更贴近思想本质)
- 回溯场景:全排列、N 皇后、路径搜索(DFS)
Array.prototype.flat() 和手写递归 flatten 的区别
现代 JS 的 flat() 是内置优化实现,支持指定深度(flat(2))和 Infinity 全展开;而手写递归通常默认“彻底展开”,容易忽略循环引用或类型边界。
手写时要注意:
- 只对
Array.isArray(item)的项递归,避免把字符串、null、对象也展开 - 若需支持无限嵌套但防循环引用,得额外传入
seen = new WeakSet()记录已访问对象 - 性能敏感场景慎用递归 flatten:V8 对深层递归有优化,但十万级嵌套仍可能爆栈;此时应改用栈模拟迭代
function flatten(arr) {
return arr.reduce((acc, item) => {
if (Array.isArray(item)) {
return acc.concat(flatten(item));
}
return acc.concat(item);
}, []);
}尾递归优化在 JavaScript 中基本不可靠
ES6 规范定义了尾调用优化(TCO),但仅限严格模式 + 函数最后一句是纯函数调用(不能跟在 return 后的表达式里)。现实中,Chrome、Firefox 都未启用该特性(V8 已移除实验性支持),Node.js 也从未默认开启。
所以别指望写个“尾递归版阶乘”就能避免栈增长——它和普通递归一样会堆栈。真要处理超深递归,得主动转成迭代(用 while + 数组模拟调用栈)或分片(setTimeout / queueMicrotask 拆解)。
最容易被忽略的一点:递归的“深度”不是代码行数,而是运行时实际调用层数。哪怕函数只有三行,输入一个深度为 10000 的树,照样崩。
今天关于《JavaScript递归函数详解与应用实例》的内容就介绍到这里了,是不是学起来一目了然!想要了解更多关于的内容请关注golang学习网公众号!
-
502 收藏
-
501 收藏
-
501 收藏
-
501 收藏
-
501 收藏
-
268 收藏
-
226 收藏
-
459 收藏
-
219 收藏
-
123 收藏
-
294 收藏
-
385 收藏
-
479 收藏
-
245 收藏
-
494 收藏
-
385 收藏
-
419 收藏
-
- 前端进阶之JavaScript设计模式
- 设计模式是开发人员在软件开发过程中面临一般问题时的解决方案,代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景,打造一站式知识长龙服务,适合有JS基础的同学学习。
- 立即学习 543次学习
-
- GO语言核心编程课程
- 本课程采用真实案例,全面具体可落地,从理论到实践,一步一步将GO核心编程技术、编程思想、底层实现融会贯通,使学习者贴近时代脉搏,做IT互联网时代的弄潮儿。
- 立即学习 516次学习
-
- 简单聊聊mysql8与网络通信
- 如有问题加微信:Le-studyg;在课程中,我们将首先介绍MySQL8的新特性,包括性能优化、安全增强、新数据类型等,帮助学生快速熟悉MySQL8的最新功能。接着,我们将深入解析MySQL的网络通信机制,包括协议、连接管理、数据传输等,让
- 立即学习 500次学习
-
- JavaScript正则表达式基础与实战
- 在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
- 立即学习 487次学习
-
- 从零制作响应式网站—Grid布局
- 本系列教程将展示从零制作一个假想的网络科技公司官网,分为导航,轮播,关于我们,成功案例,服务流程,团队介绍,数据部分,公司动态,底部信息等内容区块。网站整体采用CSSGrid布局,支持响应式,有流畅过渡和展现动画。
- 立即学习 485次学习