掌握 JavaScript 中的深度扁平化

简介

在本实验中，我们将探索如何在JavaScript中深度扁平化一个数组。我们将使用递归、Array.prototype.concat() 方法以及展开运算符来扁平化数组。在实验结束时，你将能够编写一个函数，该函数可以深度扁平化任意深度的数组。

Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("JavaScript")) -.-> javascript/BasicConceptsGroup(["Basic Concepts"]) javascript(("JavaScript")) -.-> javascript/AdvancedConceptsGroup(["Advanced Concepts"]) javascript/BasicConceptsGroup -.-> javascript/variables("Variables") javascript/BasicConceptsGroup -.-> javascript/data_types("Data Types") javascript/BasicConceptsGroup -.-> javascript/arith_ops("Arithmetic Operators") javascript/BasicConceptsGroup -.-> javascript/comp_ops("Comparison Operators") javascript/AdvancedConceptsGroup -.-> javascript/higher_funcs("Higher-Order Functions") javascript/AdvancedConceptsGroup -.-> javascript/spread_rest("Spread and Rest Operators") subgraph Lab Skills javascript/variables -.-> lab-28262{{"深度扁平化数组"}} javascript/data_types -.-> lab-28262{{"深度扁平化数组"}} javascript/arith_ops -.-> lab-28262{{"深度扁平化数组"}} javascript/comp_ops -.-> lab-28262{{"深度扁平化数组"}} javascript/higher_funcs -.-> lab-28262{{"深度扁平化数组"}} javascript/spread_rest -.-> lab-28262{{"深度扁平化数组"}} end

如何在JavaScript中使用递归深度扁平化数组

要在JavaScript中深度扁平化数组，请执行以下步骤：

打开终端/SSH并输入 node 以开始练习编码。
使用递归扁平化数组。
将 Array.prototype.concat() 方法与空数组 ([]) 和展开运算符 (...) 一起使用来扁平化数组。
递归地扁平化每个作为数组的元素。
实现以下代码：

const deepFlatten = (arr) =>
  [].concat(...arr.map((v) => (Array.isArray(v) ? deepFlatten(v) : v)));

deepFlatten([1, [2], [[3], 4], 5]); // [1, 2, 3, 4, 5]

通过遵循这些步骤，你可以轻松地在JavaScript中使用递归深度扁平化数组。

总结

恭喜你！你已经完成了深度扁平化数组实验。你可以在LabEx中练习更多实验来提升你的技能。