递归函数是直接或间接调用自身的函数，常用于树遍历、阶乘等场景；关键是有自身调用且需终止条件，否则易因调用栈溢出导致rangeerror。
递归函数是什么：调用自身的函数
JavaScript 递归函数就是函数在执行过程中，直接或间接调用自己。它不是语法特性，而是一种编程模式，常用于遍历树结构、计算阶乘、解析嵌套对象等场景。
关键判断标准：function foo() { foo(); } —— 只要函数体内有对自身的调用，且没有可靠的终止条件，就构成递归。
但递归本身不危险，危险的是「无限递归」或「深度过大」。JS 引擎对调用栈深度有限制（通常 10k–15k 层，具体取决于引擎和内存），超过即抛出 RangeError: Maximum call stack size exceeded。
为什么递归容易栈溢出：每次调用都压栈
JS 是单线程、基于调用栈执行的。每次函数调用，引擎都会在栈上保存当前执行上下文（变量、参数、返回地址）。递归每深入一层，就新增一帧；返回时才逐层弹出。
立即学习“Java免费学习笔记（深入）”；
这意味着：
-
factorial(10000)可能成功，factorial(20000)很可能失败 - 深度为 100 的树遍历，若用朴素递归，栈深就是 100 —— 看似安全，但若树不平衡（比如退化成链表），实际可能逼近极限
- 箭头函数、async 函数、generator 中递归，同样受栈限制，不会自动优化
如何避免栈溢出：改写策略与边界控制
不能一概禁用递归，而是根据场景选择更稳妥的实现方式。核心思路是：把「依赖调用栈维护状态」转为「手动管理状态」。
推荐做法：
- 对已知深度较大的场景（如扁平化 1000+ 层嵌套数组），优先用
while+stack模拟递归，例如：function flattenDeep(arr) { const result = []; const stack = [...arr]; while (stack.length > 0) { const val = stack.pop(); if (Array.isArray(val)) { stack.push(...val); } else { result.push(val); } } return result.reverse(); } - 对可预测的浅层递归（如 DOM 树遍历、JSON Schema 验证），加深度计数器强制中断：
function traverse(node, depth = 0, maxDepth = 100) { if (depth > maxDepth) throw new Error('Recursion depth exceeded'); // 处理 node... for (const child of node.children || []) { traverse(child, depth + 1, maxDepth); } } - 尾递归优化（TCO）理论上可解，但目前所有主流浏览器都不支持 ES6 尾调用优化，写成尾递归形式（
return fn(...)）也无济于事，栈照样增长
容易被忽略的隐式递归点
有些代码看似没递归，实则触发了隐蔽的调用链：
-
JSON.stringify()序列化循环引用对象时，会报TypeError: Converting circular structure to JSON，但若自定义toJSON方法又调回自身，就变成真递归 - Vue / React 中，
computed或useMemo依赖项里读取另一个计算属性，而后者又反向依赖前者 → 无限求值，本质是逻辑递归 - 事件监听器中触发相同事件（如
input改值 →dispatchEvent→ 又触发input），形成事件递归，虽不占 JS 调用栈，但会导致 UI 卡死或内存暴涨
真正难调试的，往往是这些非显式、跨模块、带异步延迟的递归路径。加日志时别只打 console.log('enter')，带上 new Error().stack.split('\n')[1] 快速定位调用源头。
