JavaScript 建立二维数组

在 JavaScript 中，建立二维数组是一个比较常见的要求，尤其是在开发设计 Web 应用软件和游戏的时候。但是，为了防止应用繁杂的代码来建立二维数组，我们应该一种迅速而高效的方法。

方式1: 应用双向循环系统建立二维数组

在 JavaScript 中，应用双向循环系统是建立二维数组的一种普遍方式。下列是一个实例编码：

function createArray(rows, cols) {
  var arr = new Array(rows);
  for (var i = 0; i < rows; i  ) {
    arr[i] = new Array(cols);
    for (var j = 0; j < cols; j  ) {
      arr[i][j] = 0;
    }
  }
  return arr;
}

// 创建一个3x3的二维数组
var myArray = createArray(3, 3);

// 打印出二维数组
console.log(myArray);

在相关编码中，我们先创建了一个个数为 rows、行数为 cols 的二维数组。随后，应用双向循环系统遍历数组，将每个原素设为0。

虽然这类其实很简单，但解决大中型二维数组时，其速率很有可能不太高。

方式2: 应用 Array.from() 建立二维数组

ES6 的 Array.from() 方式提供了一种更高效的方法来建立二维数组。下列是一个实例编码：

function createArray(rows, cols) {
  return Array.from({ length: rows }, () => new Array(cols).fill(0));
}

// 创建一个3x3的二维数组
var myArray = createArray(3, 3);

// 打印出二维数组
console.log(myArray);

在相关编码中，大家用了 Array.from() 方式来建立个数为 rows、行数为 cols 的二维数组。随后，大家在调用函数中用了 new Array(cols).fill(0)，这将回到一个行数为 cols、原素均为 0 的二维数组。最终，我们使用 fill() 方式将每个行二维数组添充为0。

此方法更为简约和高效，因为他只需一次循环系统，而非2次循环系统。因而，如果你需要建立大中型二维数组，此方法很有可能更适合。

实例

创建一个1-100的二维数组

function createArray(x, y) {
  let result = [];
  for (let i = 0; i < x; i  ) {
    result[i] = [];
    for (let j = 0; j < y; j  ) {
      result[i][j] = i * y   j   1;
    }
  }
  return result;
}

console.log("createArray(10, 10) = ", createArray(10, 10));

在这样一个实例中，大家用了2个嵌入的 for 循环系统来创建一个二维数组。我们先创建一个空数组 result，之后在外部循环系统中向每一个行创建一个空数组。在外部循环中，我们使用 (i * y j 1) 来给每一个原素分派一个增长数值，并把它存储在对应的行和列部位。最终，大家回到全部二维数组。此方法尽管用了 for 循环系统，但在某些情况下其实比其他方式更方便和形象化。

function createArray(x, y) {
  return Array.from({ length: x }, (_, i) =>
    Array.from({ length: y }, (_, j) => j   i * y   1)
  );
}

console.log("createArray(10, 10) = ", createArray(10, 10));

在这样一个实例中，大家用了 Array.from() 方式来创建一个二维数组。我们先创建一个个数为 x、行数为 y 的二维数组，之后在调用函数中应用 (j i * y 1) 来给每一个原素分派一个增长数值。最终，我们将要行二维数组搜集在一个大二维数组中，并回到全部二维数组。此方法是采用 Array.from() 方式建立二维数组的一种普遍方式。

function createArray(x, y) {
    let count = 1;
    return Array.from({ length: x }, () =>
      Array.from({ length: y }, () => count  )
    );
  }
console.log("createArray(10, 10) = ", createArray(10, 10));

在这样一个实例中，大家也用了 Array.from() 方式来创建一个二维数组。大家在外部创建了一个电子计数器自变量 count，之后在调用函数中应用 count 来给每一个原素分派一个增长数值。最终，我们将要行二维数组搜集在一个大二维数组中，并回到全部二维数组。此方法与实例1类似，仅仅用了电子计数器自变量而非 (j i * y 1)。

function createArray(x, y) {
    let count = 1;
    return Array(x).fill().map(() => Array(y).fill().map(() => count  ));
  }
console.log("createArray(10, 10) = ", createArray(10, 10));

在这样一个实例中，大家用了 fill() 和 map() 方式来创建一个二维数组。我们先应用 Array(x).fill() 创建一个尺寸为 x 的二维数组，之后在调用函数中应用 Array(y).fill().map(() => count ) 来创建一个尺寸为 y 的行二维数组，并把它添充为增长数值。最终，我们将要行二维数组搜集在一个大二维数组中，并回到全部二维数组。此方法尽管用了比较多的方法调用，可是在某些情况下其实比其他方式迅速。

结果

不论你是创建一个中小型或是大型二维数组，这两种方法全是很好用的。应用双向循环系统建立二维数组方式看似简单，但是可能在对待大中型二维数组时效率不高。应用 Array.from() 方式来建立二维数组方式更为简约和高效，适用大中型二维数组。因而，可以根据自己的需求来找到适合自己的方式。

希望这篇文章可以帮助你更好的了解如何建立 JavaScript 二维数组，如何更好地找到适合自己的方式。不论你是在研发 Web 应用软件、手机游戏还是其它应用软件，创建一个高效率的二维数组是一个重要的每日任务。尽管有多种方法能够实现今天的任务，但使用 Array.from() 方式一般是最佳的选择。

一定要记住，创建一个高效率的程序流程不但在于所使用的技术性，还取决于你的设计方案和实现。因而，在开发过程中，你需要考虑到各个方面，比如代码的易读性、可扩展性和扩展性。仅有从你充分考虑了种种因素以后，才能做到真正建立一个优秀的程序流程。

希望这篇文章对大家有所帮助，祝您程序编写开心！