javascript - 递归展平数组(为什么我的函数不起作用？)

Question

所以我试图了解递归，最近遇到了一个问题，无论如何使用递归最容易解决。我正在尝试展平不同深度数组的数组，而我想出的函数是:

mixedArray = [1, 2, [3, 4], [[5, 6], 7], 8, 9];

function flattenArray(array) {
	return array.map(val => {
		if (typeof val !== "number") {
			return flattenArray(val);
		} else {
			return val;
		}
	});
}

console.log(flattenArray(mixedArray));

现在，我期望输出 [1,2,3,4,5,6,7,8,9] 但它只是按原样返回 mixArray。我的想法是，它需要数组并(假设数组不仅仅是一个数字)映射条目。如果一个条目是单个数字，那么它应该返回该数字，如果不是，那么它应该调用该条目的原始函数，依此类推。希望这是相当基本的事情，例如语法错误(这将是相当典型的!!)

请注意；我想知道为什么我的功能不起作用以及寻找解决方案。

谢谢(提前)

Answer 1

您不能使用普通的 map 方法来做到这一点，因为它只会返回与应用 map 的数组中相同数量的元素(即，顶层)。

而是使用reduce，然后确保扩展您已经拥有的内容以及必须添加的内容:

mixedArray = [1, 2, [3, 4], [[5, 6], 7], 8, 9];

function flattenArray(array) {
    return array.reduce( (flat, val) => {
        if (typeof val !== "number") {
            return [...flat, ...flattenArray(val)];
        } else {
            return [...flat, val];
        }
    }, []);
}

console.log(flattenArray(mixedArray));

您可以使用三元运算符代替 if ... else 来稍微压缩代码:

mixedArray = [1, 2, [3, 4], [[5, 6], 7], 8, 9];

const flattenArray = array =>
    array.reduce( (flat, val) => 
        [...flat, ...(Array.isArray(val) ? flattenArray(val) : [val])]
    , []);

console.log(flattenArray(mixedArray));

...当然，我们应该提到 ESNext 提案 Array#flat ，它只是在一个方法调用中完成所有这些操作。

mixedArray = [1, 2, [3, 4], [[5, 6], 7], 8, 9];

console.log(mixedArray.flat(Infinity));