面试题：JavaScript闭包与递归函数性能优化及底层原理

闭包和递归函数可能出现的性能问题

闭包性能问题：
- 内存占用：闭包会在内存中保持对外部变量的引用，即使外部函数已经执行完毕。在大型项目中频繁使用闭包，如果外部变量占用大量内存且不能及时释放，会导致内存泄漏，影响性能。
- 作用域链查找：每次访问闭包内部的变量时，JavaScript引擎需要沿着作用域链查找，这增加了查找变量的时间开销，特别是当作用域链很长时，性能下降明显。
递归函数性能问题：
- 栈溢出：递归函数调用自身，每次调用都会在调用栈中添加一个新的栈帧。如果递归深度过大，调用栈可能会溢出，导致程序崩溃。例如在复杂计算的递归中，随着递归次数增加，栈帧不断累积，最终可能超出栈的最大容量。
- 重复计算：递归函数中可能存在重复计算相同子问题的情况。比如在斐波那契数列的递归计算中，会多次计算相同位置的斐波那契数，这大大浪费了计算资源，降低了性能。

优化方案

闭包优化：
- 减少闭包对外部变量的引用：尽量让闭包内部直接使用传入的参数，而不是依赖外部变量。例如：

// 优化前
let outerVar = { largeData: [/* 大量数据 */] };
function outerFunction() {
    return function innerFunction() {
        return outerVar.largeData;
    };
}
// 优化后
function outerFunction(outerVar) {
    return function innerFunction() {
        return outerVar.largeData;
    };
}

及时释放闭包引用：当闭包不再使用时，手动将闭包设置为 null，让垃圾回收机制可以回收相关内存。

let closureFunc = function() {
    let localVar = 'data';
    return function() {
        return localVar;
    };
}();
// 当不再使用闭包时
closureFunc = null;

递归函数优化：
- 尾递归优化：如果递归函数的最后一个操作是调用自身，现代JavaScript引擎（如V8）可以进行尾递归优化，避免栈溢出。例如：

// 普通递归
function factorial(n) {
    if (n === 1) return 1;
    return n * factorial(n - 1);
}
// 尾递归优化
function factorialTR(n, acc = 1) {
    if (n === 1) return acc;
    return factorialTR(n - 1, n * acc);
}

记忆化（Memoization）：通过缓存递归函数的计算结果，避免重复计算。例如：

const memo = new Map();
function fibonacci(n) {
    if (memo.has(n)) return memo.get(n);
    if (n <= 1) return n;
    const result = fibonacci(n - 1) + fibonacci(n - 2);
    memo.set(n, result);
    return result;
}

性能测试对比思路

测试工具：使用 console.time() 和 console.timeEnd() 来测量函数执行时间，也可以使用更专业的性能测试库如 benchmark.js。
测试场景：针对闭包优化前后，分别测试在相同数据量下闭包函数的执行时间。对于递归函数优化前后，分别测试在不同递归深度下函数的执行时间以及是否会出现栈溢出。
多次测试：为了得到更准确的结果，对每个测试场景进行多次测试，并取平均值。

性能测试代码示例

闭包性能测试：

// 优化前闭包函数
let outerVar = { largeData: Array.from({ length: 10000 }, (_, i) => i) };
function outerFunction1() {
    return function innerFunction1() {
        return outerVar.largeData;
    };
}
let closureFunc1 = outerFunction1();
// 优化后闭包函数
function outerFunction2(outerVar) {
    return function innerFunction2() {
        return outerVar.largeData;
    };
}
let closureFunc2 = outerFunction2(outerVar);

// 性能测试
console.time('closure1');
for (let i = 0; i < 1000; i++) {
    closureFunc1();
}
console.timeEnd('closure1');

console.time('closure2');
for (let i = 0; i < 1000; i++) {
    closureFunc2();
}
console.timeEnd('closure2');

递归函数性能测试：

// 普通递归
function factorial(n) {
    if (n === 1) return 1;
    return n * factorial(n - 1);
}
// 尾递归优化
function factorialTR(n, acc = 1) {
    if (n === 1) return acc;
    return factorialTR(n - 1, n * acc);
}

// 性能测试
console.time('factorial');
for (let i = 0; i < 100; i++) {
    factorial(10);
}
console.timeEnd('factorial');

console.time('factorialTR');
for (let i = 0; i < 100; i++) {
    factorialTR(10);
}
console.timeEnd('factorialTR');

// 斐波那契数列普通递归
function fibonacci(n) {
    if (n <= 1) return n;
    return fibonacci(n - 1) + fibonacci(n - 2);
}
// 斐波那契数列记忆化递归
const memo = new Map();
function fibonacciMemo(n) {
    if (memo.has(n)) return memo.get(n);
    if (n <= 1) return n;
    const result = fibonacciMemo(n - 1) + fibonacciMemo(n - 2);
    memo.set(n, result);
    return result;
}

// 性能测试
console.time('fibonacci');
for (let i = 0; i < 10; i++) {
    fibonacci(30);
}
console.timeEnd('fibonacci');

console.time('fibonacciMemo');
for (let i = 0; i < 10; i++) {
    fibonacciMemo(30);
}
console.timeEnd('fibonacciMemo');

星途面试题库

面试题：JavaScript闭包与递归函数性能优化及底层原理

知识考点

面试题答案

闭包和递归函数可能出现的性能问题

优化方案

性能测试对比思路

性能测试代码示例