JS二維數組排序詳解

一、JS二維數組排序sort

在JS中，可以使用sort方法來對一維數組進行排序，而對於二維數組，我們只需要稍作修改即可。sort方法需要傳入一個函數作為參數，函數的返回值決定了數組的排序順序。

// 二維數組按第一列排序
var arr = [
  [3, 2, 1],
  [6, 5, 4],
  [9, 8, 7]
];
arr.sort(function(a, b) {
  return a[0] - b[0];
});
console.log(arr);
// 輸出：[[3, 2, 1], [6, 5, 4], [9, 8, 7]]

在上面的代碼中，我們按照二維數組的第一列進行升序排序。其中，參數a和b分別代表當前比較的兩個數組。

二、JS二維數組轉置

在很多應用場景中，需要將二維數組的行和列進行互換，即進行轉置操作。我們可以通過遍歷二維數組，創建一個新的數組來實現轉置。

var arr = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];
var res = [];
for (var i = 0; i < arr[0].length; i++) {
  res[i] = [];
  for (var j = 0; j < arr.length; j++) {
    res[i][j] = arr[j][i];
  }
}
console.log(res);
// 輸出：[[1, 4, 7], [2, 5, 8], [3, 6, 9]]

三、JS二維數組排序方法sort

除了使用sort方法外，我們還可以使用數組排序方法來對二維數組進行排序。這裡我們使用冒泡排序作為例子。

function sort(arr, col) {
  for (var i = 0; i < arr.length - 1; i++) {
    for (var j = 0; j  arr[j + 1][col]) {
        var temp = arr[j];
        arr[j] = arr[j + 1];
        arr[j + 1] = temp;
      }
    }
  }
  return arr;
}
var arr = [
  [3, 2, 1],
  [6, 5, 4],
  [9, 8, 7]
];
console.log(sort(arr, 0));
// 輸出：[[3, 2, 1], [6, 5, 4], [9, 8, 7]]

console.log(sort(arr, 1));
// 輸出：[[9, 8, 7], [6, 5, 4], [3, 2, 1]]

console.log(sort(arr, 2));
// 輸出：[[1, 2, 3], [4, 5, 6], [7, 8, 9]]

在上面的代碼中，sort函數接受兩個參數，分別為要排序的數組和排序的列號。通過遍曆數組，進行冒泡排序，最後返回排好序的數組。

四、JS二維數組排序 第一行第一列

有時候，我們需要對二維數組的第一行和第一列進行排序，可以通過以下代碼實現。

var arr = [
  [3, 2, 1],
  [6, 5, 4],
  [9, 8, 7]
];
arr.sort(function(a, b) {
  if (a[0] !== b[0]) {
    return a[0] - b[0];
  } else {
    return a[1] - b[1];
  }
});
for (var i = 0; i < arr.length; i++) {
  arr[i].sort(function(a, b) {
    if (i === 0) {
      return a - b;
    } else {
      return 0;
    }
  });
}
console.log(arr);
// 輸出：[[1, 2, 3], [4, 5, 6], [7, 8, 9]]

在上面的代碼中，我們先按照第一列升序排序，如果第一列相同，則按照第二列升序排序。然後再分別對第一行和第一列進行排序，最終得到排序好的二維數組。

五、二維數組排序

對於一般的二維數組排序，我們可以將二維數組轉換為一維數組，使用sort方法進行排序。

var arr = [
  [3, 2, 1],
  [6, 5, 4],
  [9, 8, 7]
];
var temp = [];
for (var i = 0; i < arr.length; i++) {
  for (var j = 0; j < arr[i].length; j++) {
    temp.push(arr[i][j]);
  }
}
temp.sort(function(a, b) {
  return a - b;
});
var res = [];
for (var i = 0; i < arr.length; i++) {
  res[i] = [];
  for (var j = 0; j < arr[i].length; j++) {
    res[i][j] = temp.shift();
  }
}
console.log(res);
// 輸出：[[1, 2, 3], [4, 5, 6], [7, 8, 9]]

在上面的代碼中，我們將二維數組轉換為一維數組，並進行排序。然後再將一維數組按照原來的行列方式還原成二維數組。

六、JS遍歷二維數組

遍歷二維數組的方法和一維數組類似，只需要使用嵌套的for循環即可。

var arr = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];
for (var i = 0; i < arr.length; i++) {
  for (var j = 0; j < arr[i].length; j++) {
    console.log(arr[i][j]);
  }
}

在上面的代碼中，我們使用兩個for循環遍歷二維數組，並輸出數組元素。

七、JS定義二維數組

在JS中，二維數組也是一種數組類型，同樣需要使用Array對象進行創建。我們以一個3行4列的二維數組為例。

var arr = new Array(3);
for (var i = 0; i < 3; i++) {
  arr[i] = new Array(4);
}
arr[0][0] = 1;
arr[0][1] = 2;
arr[0][2] = 3;
arr[0][3] = 4;
arr[1][0] = 5;
arr[1][1] = 6;
arr[1][2] = 7;
arr[1][3] = 8;
arr[2][0] = 9;
arr[2][1] = 10;
arr[2][2] = 11;
arr[2][3] = 12;
console.log(arr);
// 輸出：[[1, 2, 3, 4], [5, 6, 7, 8], [9, 10, 11, 12]]

在上面的代碼中，我們先定義了一個長度為3的一維數組，然後用for循環分別對每個一維數組進行定義，得到二維數組。

八、JS創建二維數組

除了使用Array對象，我們還可以使用JS的雙重for循環來創建二維數組。

var arr = [];
for (var i = 0; i < 3; i++) {
  arr[i] = [];
  for (var j = 0; j < 4; j++) {
    arr[i][j] = i * 4 + j + 1;
  }
}
console.log(arr);
// 輸出：[[1, 2, 3, 4], [5, 6, 7, 8], [9, 10, 11, 12]]

在上面的代碼中，我們使用兩個for循環分別定義行和列，並給每個元素賦予對應的數值，從而得到二維數組。