一、什麼是二維數組？
在編程中，二維數組是一種特殊的數據結構，它本質上是"數組的數組"。與一維數組存儲線性序列不同，二維數組以表格形式組織數據，包含行和列兩個維度。
概念理解
可以將二維數組想象成一個Excel表格：
- 整個表格是一個二維數組
- 每一行是一個一維數組
- 每個單元格是行數組中的一個元素
// 表格類比
// 行0: [A1, A2, A3]
// 行1: [B1, B2, B3]
// 行2: [C1, C2, C3]二、二維數組的三種定義方法
方法一：直接定義法
適合已知所有元素且數據量較少的情況。
// 直接定義一個3x3的二維數組
var matrix = [
["A1", "A2", "A3"],
["B1", "B2", "B3"],
["C1", "C2", "C3"]
];
console.log(matrix[1][2]); // 輸出: "B3" - 獲取第2行第3列的元素優點：代碼簡潔直觀，一目瞭然
缺點：不適合動態或大規模數據初始化
方法二：動態擴展法
適合需要逐步構建二維數組的場景。
// 創建一個空的二維數組
var dynamicArray = new Array();
// 擴展第一行
dynamicArray[0] = new Array();
dynamicArray[0][0] = "第一行第一列";
dynamicArray[0][1] = "第一行第二列";
// 擴展第二行
dynamicArray[1] = new Array();
dynamicArray[1][0] = "第二行第一列";
dynamicArray[1][1] = "第二行第二列";
console.log(dynamicArray.length); // 輸出: 2 - 數組有2行方法三：循環創建法
最適合處理大量數據或從外部源（如JSON）獲取數據的情況。
// 定義數組的行數和列數
var rows = 4;
var cols = 3;
// 創建二維數組
var twoDArray = new Array(rows);
for (var i = 0; i < rows; i++) {
twoDArray[i] = new Array(cols);
for (var j = 0; j < cols; j++) {
twoDArray[i][j] = "位置[" + i + "][" + j + "]";
}
}
// 訪問特定元素
console.log(twoDArray[2][1]); // 輸出: "位置[2][1]"三、二維數組的結構圖解
以下通過UML類圖展示二維數組的結構關係：
四、多維數組的擴展
JavaScript支持創建三維甚至更高維度的數組。
// 創建三維數組示例
var threeDArray = new Array(2); // 第一維：2個元素
for (var x = 0; x < 2; x++) {
threeDArray[x] = new Array(3); // 第二維：每個元素有3個子元素
for (var y = 0; y < 3; y++) {
threeDArray[x][y] = new Array(4); // 第三維：每個子元素有4個元素
for (var z = 0; z < 4; z++) {
threeDArray[x][y][z] = "值[" + x + "][" + y + "][" + z + "]";
}
}
}
console.log(threeDArray[1][2][3]); // 輸出: "值[1][2][3]"五、獲取數組真實長度的方法
JavaScript數組的length屬性有時無法反映真實元素數量，特別是當數組包含非數字鍵時。
// 創建包含混合鍵的數組
var mixedArray = [];
mixedArray[0] = "數字鍵值";
mixedArray["name"] = "字符串鍵值"; // 非數字鍵不影響length
console.log(mixedArray.length); // 輸出: 1 - 僅計算數字索引
// 獲取數組真實元素數量的函數
function getActualArraySize(arr) {
var count = 0;
for (var key in arr) {
if (arr.hasOwnProperty(key)) {
count++;
}
}
return count;
}
console.log(getActualArraySize(mixedArray)); // 輸出: 2 - 計算所有鍵六、實際應用場景
場景一：遊戲棋盤表示
// 創建8x8棋盤
var chessboard = new Array(8);
for (var i = 0; i < 8; i++) {
chessboard[i] = new Array(8);
for (var j = 0; j < 8; j++) {
// 初始化棋盤格子
chessboard[i][j] = {
piece: null,
color: (i + j) % 2 === 0 ? "white" : "black"
};
}
}
// 放置棋子
chessboard[0][0].piece = " rook"; // 車
chessboard[0][1].piece = "knight"; // 馬
// ... 其他棋子初始化場景二：數據處理與轉換
// 從多個一維數組創建二維數組
var names = ["張三", "李四", "王五"];
var ages = [25, 30, 28];
var departments = ["技術部", "市場部", "財務部"];
var staffData = [];
for (var i = 0; i < names.length; i++) {
staffData[i] = [names[i], ages[i], departments[i]];
}
console.log(staffData);
// 輸出: [["張三", 25, "技術部"], ["李四", 30, "市場部"], ["王五", 28, "財務部"]]七、性能考慮與最佳實踐
- 內存使用：二維數組比一維數組佔用更多內存
- 訪問速度：連續內存訪問比隨機訪問更快
- 預分配空間：提前確定數組大小可提高性能
// 性能優化示例：預分配內存
var optimizedArray = new Array(1000); // 預分配1000行
for (var i = 0; i < 1000; i++) {
optimizedArray[i] = new Array(100); // 每行預分配100列
// 後續操作...
}八、單詞與短語表
