JS二維陣列的定義和使用

2020-07-16 10:05:02
JavaScript 並沒有直接支援二維陣列,但是可以設定陣列元素的值等於陣列,這樣就能模擬二維陣列的結構。如果三維陣列中每個元素的值也為陣列,則可以模擬三維陣列,以此類推,通過陣列巢狀的形式可以定義多維陣列。

範例1

下面定義一個二維陣列。
var a = [  //定義二維陣列
    [1.1, 1.2],
    [2.1, 2.2]
];

範例2

下面範例使用巢狀 for 語句,把 1~100 的正數以二維陣列的形式進行儲存,設計二維數列。
var a = [];
for (var i = 0; i < 10; i ++) {  //行迴圈
    var b = [];  //輔助陣列
    for (var j = 0; j < 10; j ++) {  //列迴圈
        b[j] = i * 10 + j + 1;  //定義陣列b的元素值
    }
    a[i] = b;  //把陣列b賦值給陣列a
}
console.log(a);  //返回1~100的二維數列
數列格式如下:
a = [
    [1,2,3,4,5,6,7,8,9,10],
    [11,12,13,14,15,16,17,18,19,20],
    [21,22,23,24,25,26,27,28,29,30],
    [31,32,33,34,35,36,37,38,39,40],
    [41,42,43,44,45,46,47,48,49,50],
    [51,52,53,54,55,56,57,58,59,60],
    [61,62,63,64,65,66,67,68,69,70],
    [71,72,73,74,75,76,77,78,79,80],
    [81,82,83,84,85,86,87,88,89,90],
    [91,92,93,94,95,96,97,98,99,100]
];

範例3

JavaScript 不支援二維陣列,使用者可以模仿二維陣列的語法格式來定義陣列。下面的寫法在語法上雖然不符合規定,但是 JavaScript 也不會丟擲異常。
var a = [];
a[0,0] = 1;
a[0,1] = 2;
a[1,0] = 3;
a[1,1] = 4;
如果呼叫 length 屬性,返回值為 2,說明僅有兩個元素,分別讀取元素的值。
console.log(a.length);  //返回2,說明僅有兩個元素有效
console.log(a[0]);  //返回3
console.log(a[1]);  //返回3
JavaScript 把二維陣列的下標視為一個逗號表示式,其運算的返回值是最後一個值。前面兩行程式碼賦值就就被後面兩行程式碼賦值覆蓋了。因此,如果經過計算之後才確定了下標值,然後再進行存取操作,則可以按如下方式進行設計。
var a = [], i = 1;  //初始化變數
while(i < 10) {  //指定回圈次數
    a[i *= 2, i] = i;  //指定下標為2的冪數時才進行賦值
}
console.log(a.length);  //返回17
console.log(a);  //返回陣列[,,2,,4,,,,8,,,,,,,,16]

存取多維陣列

讀寫多維陣列的方法與普通陣列的方法相同,都是使用中括號進行存取,具體格式如下:

1) 二維陣列

陣列[下標表示式] [下標表示式]


2) 三維陣列

陣列[下標表示式] [下標表示式] [下標表示式]

更高維度的陣列以此類推。

範例

下面程式碼設計了一個二維陣列,然後分別存取第 1 行第 1 列的元素值,以及第 2 行第 2 列的元素值。
var a = [];  //宣告二維陣列
a[0] = [1,2];  //為第一個元素賦值為陣列
a[1] = [3,4];  //為第二個元素賦值為陣列
console.log(a[0][0]);  //返回1,讀取第一個元素的值
console.log(a[1][1]);  //返回4,讀取第四個元素的值

在存取多維陣列時,左側中括號內的下標值不能夠超出陣列範圍,否則就會丟擲異常。因為,如果第一個下標超出陣列範圍,返回值為 undefined,顯然表示式 undefined[1] 是錯誤的。