JavaScript数组扁平化递归函数中return关键字的作用与必要性

先拿两种代码对比，更直观地看问题差异：

正确的带return版本示例 #

function flatten(arr) {
  return arr.reduce((acc, curr) => {
    if (Array.isArray(curr)) {
      // return将递归扁平化后的子数组结果合并到累加器
      return acc.concat(flatten(curr));
    } else {
      return acc.concat(curr);
    }
  }, []);
}

去掉return的错误版本示例 #

function flatten(arr) {
  return arr.reduce((acc, curr) => {
    if (Array.isArray(curr)) {
      // 仅执行递归但不传递结果
      acc.concat(flatten(curr));
    } else {
      acc.concat(curr);
    }
    // 无return时回调默认返回undefined，累加器完全失效
  }, []);
}

为什么递归调用需要return？ #

递归的核心逻辑是把复杂问题拆成更小的同类问题，再合并子问题的结果。在数组扁平化场景中，遇到子数组时，我们必须拿到这个子数组被扁平后的一维数组，才能把它替换掉原数组中的子数组，最终得到完整的一维结果。

如果去掉return，递归调用flatten(curr)的结果会被直接丢弃——你只是触发了递归函数的执行，但没有把它返回的扁平化结果传递回当前层，自然无法将子数组替换成一维数组，最终函数只能返回原多维数组。

带return时具体发生了什么？ #

拿你的测试数组[1, [2, 3, [4, [5]]], 6, [7, 8, 9, [10]]]来说：

1. 最外层调用flatten，遍历到[2,3,[4,[5]]]时，触发递归调用flatten([2,3,[4,[5]]])。
2. 这个递归调用继续遍历，遇到[4,[5]]时，再次触发flatten([4,[5]])。
3. 继续深入到flatten([5])，这个最内层调用返回一维数组[5]。
4. 上一层flatten([4,[5]])拿到[5]，合并后返回[4,5]。
5. 再上一层flatten([2,3,[4,[5]]])拿到[4,5]，合并后返回[2,3,4,5]。
6. 回到最外层，把这个结果和1、6、以及[7,8,9,[10]]扁平化后的结果合并，最终返回完整的一维数组。

每一层的return都是在把当前子问题的扁平化结果传递给上一层，让整个递归链能正确合并所有子数组的结果，最终完成全数组的扁平化。

内容的提问来源于stack exchange，提问作者Emran