17 仅生成对象与数组之数组的基本操作

在之前的章节中，我们学习了对象与数组的字面量形式。接下来，我们将深入探讨“数组之数组”的基本操作。我们将会认识到什么是“数组之数组”，如何创建它们，以及我们可以对它们进行的基本操作。

什么是数组之数组?

在 JavaScript 中，一个“数组之数组”是一种数组，里面的每个元素都是一个数组。这样的结构在处理表格数据或多维数据时特别有用。

例如，以下是一个简单的“数组之数组”示例：

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

这里的 arrayOfArrays 是一个包含三个数组的数组。每个内部数组也称为子数组。

创建数组之数组

你可以使用基本的数组字面量语法来创建一个“数组之数组”。以下是一个示例：

let fruits = [
    ["apple", "banana"],
    ["orange", "grape"],
    ["mango", "pineapple"]
];

在这个示例中，fruits 是一个包含三个子数组的数组，每个子数组内都是水果名称。

访问数组之数组的元素

要访问“数组之数组”中的元素，我们可以通过多重索引实现。格式如下：

let item = arrayOfArrays[rowIndex][columnIndex];

例如，如果我们想要获取 fruits 中第二个子数组的第一个元素，我们可以这么做：

let secondFruit = fruits[1][0]; // "orange"

修改数组之数组的元素

同样，我们可以使用多重索引来修改数组中的元素。例如，假如我们想将 fruits 中的“banana”改为“kiwi”，我们可以这样做：

fruits[0][1] = "kiwi"; // 将 "banana" 修改为 "kiwi"

此时，fruits 将变为：

[
    ["apple", "kiwi"],
    ["orange", "grape"],
    ["mango", "pineapple"]
]

添加与删除元素

添加子数组

我们可以使用 push 方法向“数组之数组”添加新的子数组。例如，添加一个新的子数组 ["strawberry", "blueberry"]：

fruits.push(["strawberry", "blueberry"]);

现在，fruits 将变为：

[
    ["apple", "kiwi"],
    ["orange", "grape"],
    ["mango", "pineapple"],
    ["strawberry", "blueberry"]
]

删除子数组

想要移除“数组之数组”中的某个子数组，可以使用 splice 方法。例如，要删除 fruits 中的第三个子数组：

fruits.splice(2, 1); // 删除索引为2的子数组

经过此操作后，fruits 变为：

[
    ["apple", "kiwi"],
    ["orange", "grape"],
    ["strawberry", "blueberry"]
]

添加元素到子数组

你也可以向子数组添加元素。例如，向 fruits 的第一个子数组添加“grapefruit”：

fruits[0].push("grapefruit");

现在 fruits 为：

[
    ["apple", "kiwi", "grapefruit"],
    ["orange", "grape"],
    ["strawberry", "blueberry"]
]

删除元素从子数组

使用 pop 方法可以删除子数组中的最后一个元素。例如，从第一个子数组中删除：

fruits[0].pop(); // 会删除 "grapefruit"

此时 fruits 再次更新：

[
    ["apple", "kiwi"],
    ["orange", "grape"],
    ["strawberry", "blueberry"]
]

总结

在这一篇教程中，我们详细了解了“数组之数组”的创建、访问、修改、添加和删除操作。通过实际案例，我们可以看到如何有效地利用这种数据结构。

在下一篇教程中，我们将深入研究“数组之数组”中常用的方法，包括 map、filter 和 reduce 等函数。继续关注，学习更多 JavaScript 相关知识！