理解 JavaScript 中的嵌套数组

数组是值的有序集合：每个值称为一个元素，每个元素在数组中都有一个数字位置，称为其索引。

JavaScript 允许我们在数组内部创建数组，这种机制称为嵌套数组。嵌套数组包含一个或多个数组元素。这种定义可能有点令人困惑，但深入研究后就会发现它非常有趣。

创建嵌套数组：

在 JavaScript 中，创建数组有三种语法。让我们使用这三种方法创建嵌套数组，以了解嵌套数组的概念。
这里只是将变量等同于数组。



var favMovies = ['Begin Again', 'Soul', ['Matrix', 'Matix Reloaded', 'Matrix Revolutions'],['Frozen', 'Frozen 2', ['Tangled', 'Alladin']]]

第二种是使用数组方法new Array()。



var favMovies = new Array ( );

favMovies[0] = 'Begin Again'
favMovies[1] = 'Soul'
favMovies[2] = new Array ("Matrix", "Matix Reloaded", "Matrix Revolutions")
favMovies[3] = new Array ("Frozen", "Frozen 2", ["Tangled", "Alladin"])

最后一种是使用Array()类似于的new Array()。




var favMovies = Array ( );

favMovies[0] = 'Begin Again'
favMovies[1] = 'Soul'
favMovies[2] = Array ("Matrix", "Matix Reloaded", "Matrix Revolutions")
favMovies[3] = Array ("Frozen", "Frozen 2", ["Tangled", "Alladin"])

请注意，所有这些方法都产生相同的结果。现在我们知道了如何创建嵌套数组，接下来让我们看看如何访问嵌套数组的元素。

了解如何将索引分配给元素：

数组按索引排列。下图解释了如何将索引分配给嵌套数组中的元素。假设我们想要访问值“Tangled”，我们可以使用此表导航到该值。



console.log(favMovies[3][2][0])

类似地，我们可以借助索引访问任何元素。

展平嵌套数组：

有一些方法可以展平嵌套数组。我们可以使用以下方法将其转换为普通数组。

1）使用方法 Array.flat()

Array.flat()方法通过递归连接所有子数组（直至达到您指定的深度）来生成一个新数组。
简而言之，如果您有一个数组（其中可能包含更多数组），flat()它将帮助您将所有条目连接成一个数组。




favMovies = ['Begin Again', 'Soul', ['Matrix', 'Matix Reloaded', 'Matrix Revolutions'],['Frozen', 'Frozen 2', ['Tangled', 'Alladin']]]

flattenedArray = favMovies.flat() // depth is not specified
// expected result: ["Begin Again", "Soul", "Matrix", "Matix Reloaded", "Matrix Revolutions", "Frozen", "Frozen 2", Array(2)]

flatWithDepth = favMovies.flat(2) // depth of 2 is mentioned so we get complete flat array
// expected result: ["Begin Again", "Soul", "Matrix", "Matix Reloaded", "Matrix Revolutions", "Frozen", "Frozen 2", "Tangled", "Alladin"]

2）使用 Array.toString() 和 String.split() 方法

我们可以将数组转换为字符串，然后使用方法进行拆分.split()。这样我们就得到了数组。




favMovies = ['Begin Again', 'Soul', ['Matrix', 'Matix Reloaded', 'Matrix Revolutions'],['Frozen', 'Frozen 2', ['Tangled', 'Alladin']]]
favMovies.toString().split(",") 
// expected result: ["Begin Again", "Soul", "Matrix", "Matix Reloaded", "Matrix Revolutions", "Frozen", "Frozen 2", "Tangled", "Alladin"]

谢谢你！

文章来源：https://dev.to/sanchithasr/understanding-nested-arrays-2hf7