如何在JavaScript中创建二维数组?

我一直在网上阅读,有些地方说这是不可能的,有些人说这是可能的,然后举一个例子,其他人反驳这个例子,等等。

  1. 如何在JavaScript中声明2维数组?(假设可能)

  2. 如何访问其成员?(myArray[0][1]myArray[0,1]?)

2617897 次浏览

let items = [[1, 2],[3, 4],[5, 6]];console.log(items[0][0]); // 1console.log(items[0][1]); // 2console.log(items[1][0]); // 3console.log(items[1][1]); // 4console.log(items);

二维数组的创建方式与单维数组相同。您可以像array[0][1]一样访问它们。

var arr = [1, 2, [3, 4], 5];
alert (arr[2][1]); //alerts "4"

您只需将数组中的每个项目设为数组。

var x = new Array(10);
for (var i = 0; i < x.length; i++) {x[i] = new Array(3);}
console.log(x);

Javascript只有一维数组,但正如其他人指出的那样,您可以构建数组的数组。

以下函数可用于构建固定维度的二维数组:

function Create2DArray(rows) {var arr = [];
for (var i=0;i<rows;i++) {arr[i] = [];}
return arr;}

列数并不重要,因为在使用数组之前不需要指定数组的大小。

然后你可以打电话:

var arr = Create2DArray(100);
arr[50][2] = 5;arr[70][5] = 7454;// ...

您可以分配一个行数组,其中每行是一个长度相同的数组。或者您可以分配一个包含row*列元素的一维数组,并定义将行/列坐标映射到元素索引的方法。

无论您选择哪种实现,如果您将其包装在一个对象中,您都可以在原型中定义访问器方法,以使API易于使用。

有些人说这是不可能的,因为二维数组实际上只是数组的数组。这里的其他评论提供了在JavaScript中创建二维数组的完全有效的方法,但最纯粹的观点是你有一个一维对象数组,每个对象都是由两个元素组成的一维数组。

所以,这就是冲突观点的原因。

与Activa的答案类似,这里有一个创建n维数组的函数:

function createArray(length) {var arr = new Array(length || 0),i = length;
if (arguments.length > 1) {var args = Array.prototype.slice.call(arguments, 1);while(i--) arr[length-1 - i] = createArray.apply(this, args);}
return arr;}
createArray();     // [] or new Array()
createArray(2);    // new Array(2)
createArray(3, 2); // [new Array(2),//  new Array(2),//  new Array(2)]

我不确定是否有人回答过这个问题,但我发现这对我很有效-

var array = [[,],[,]]

eg:

var a = [[1,2],[3,4]]

例如,对于一个2维数组。

我必须创建一个灵活的数组函数来根据需要向其添加“记录”,并且能够更新它们并在将其发送到数据库进行进一步处理之前进行任何需要的计算。这是代码,希望能有所帮助:)。

function Add2List(clmn1, clmn2, clmn3) {aColumns.push(clmn1,clmn2,clmn3); // Creates array with "record"aLine.splice(aPos, 0,aColumns);  // Inserts new "record" at position aPos in main arrayaColumns = [];    // Resets temporary arrayaPos++ // Increments position not to overlap previous "records"}

随意优化和/或指出任何错误:)

最简单的方法:

var myArray = [[]];

很少有人展示推送的使用:
为了带来一些新的东西,我将向您展示如何使用一些值初始化矩阵,例如:0或空字符串“”。
提醒一下,如果你有一个10个元素的数组,在javascript中,最后一个索引将是9!

function matrix( rows, cols, defaultValue){
var arr = [];
// Creates all lines:for(var i=0; i < rows; i++){
// Creates an empty linearr.push([]);
// Adds cols to the empty line:arr[i].push( new Array(cols));
for(var j=0; j < cols; j++){// Initializes:arr[i][j] = defaultValue;}}
return arr;}

使用示例:

x = matrix( 2 , 3,''); // 2 lines, 3 cols filled with empty stringy = matrix( 10, 5, 0);// 10 lines, 5 cols filled with 0

如果您正在寻找Google图表的2D数组,那么最好的方法是

var finalData = [];[["key",value], ["2013-8-5", 13.5], ["2013-7-29",19.7]...]

不是有效的二维数组谷歌图表

最简单的方法:

var arr  = [];
var arr1 = ['00','01'];var arr2 = ['10','11'];var arr3 = ['20','21'];
arr.push(arr1);arr.push(arr2);arr.push(arr3);
alert(arr[0][1]); // '01'alert(arr[1][1]); // '11'alert(arr[2][0]); // '20'
var _field = (function(){var array = [];for(var y = 0; y != 3; y++) { array[y] = new Array(5); }return array;})();
// var item = _field[2][4];

如果数组的大小未知会发生什么?或者数组应该动态创建和填充?对我有效的替代解决方案是使用带有静态2d数组变量的类,如果数组中不存在索引,它将启动它:

function _a(x,y,val){// return depending on parametersswitch(arguments.length){case 0: return _a.a;case 1: return _a.a[x];case 2: return _a.a[x][y];}
// declare array if wasn't declared yetif(typeof _a.a[x] == 'undefined')_a.a[x] = [];
_a.a[x][y] = val;}// declare static empty variable_a.a = [];

语法将是:

_a(1,1,2); // populates [1][1] with value 2_a(1,1);   // 2 or alternative syntax _a.a[1][1]_a(1);     // [undefined × 1, 2]_a.a;      // [undefined × 1, Array[2]]_a.a.length

下面是最简单的方法:

var array1 = [[]];array1[0][100] = 5;    
alert(array1[0][100]);alert(array1.length);alert(array1[0].length);

双线:

var a = [];while(a.push([]) < 10);

它将生成一个长度为10的数组a,填充数组。(Push将元素添加到数组并返回新长度)

我发现这段代码适合我:

var map = [[]];
mapWidth = 50;mapHeight = 50;fillEmptyMap(map, mapWidth, mapHeight);

function fillEmptyMap(array, width, height) {for (var x = 0; x < width; x++) {array[x] = [];for (var y = 0; y < height; y++) {
array[x][y] = [0];}}}

要在javaScript中创建2D数组,我们可以先创建一个数组,然后添加数组作为它的元素。此方法将返回一个具有给定行数和列数的2D数组。

function Create2DArray(rows,columns) {var x = new Array(rows);for (var i = 0; i < rows; i++) {x[i] = new Array(columns);}return x;}

要创建数组,请使用如下方法。

var array = Create2DArray(10,20);

我修改了马修·克拉姆利关于创建多维数组函数的答案。我添加了要作为数组变量传递的数组的维度,并且将有另一个变量-value,它将用于设置多维数组中最后一个数组的元素的值。

/**   Function to create an n-dimensional array**   @param array dimensions*   @param any type value**   @return array array*/function createArray(dimensions, value) {// Create new arrayvar array = new Array(dimensions[0] || 0);var i = dimensions[0];
// If dimensions array's length is bigger than 1// we start creating arrays in the array elements with recursions// to achieve multidimensional arrayif (dimensions.length > 1) {// Remove the first value from the arrayvar args = Array.prototype.slice.call(dimensions, 1);// For each index in the created array create a new array with recursionwhile(i--) {array[dimensions[0]-1 - i] = createArray(args, value);}// If there is only one element left in the dimensions array// assign value to each of the new array's elements if value is set as param} else {if (typeof value !== 'undefined') {while(i--) {array[dimensions[0]-1 - i] = value;}}}
return array;}
createArray([]);              // [] or new Array()
createArray([2], 'empty');    // ['empty', 'empty']
createArray([3, 2], 0);       // [[0, 0],//  [0, 0],//  [0, 0]]

创建多维数组的递归函数:

var makeArray = function (dims, arr) {if (dims[1] === undefined) {return new Array(dims[0]);}
arr = new Array(dims[0]);
for (var i=0; i<dims[0]; i++) {arr[i] = new Array(dims[1]);arr[i] = makeArray(dims.slice(1), arr[i]);}
return arr;}

构建一个2x3x4x2 4D阵列:

var array = makeArray([2, 3, 4, 2]);

Javascript不支持二维数组,相反,我们将一个数组存储在另一个数组中,并根据您要访问该数组的位置从该数组中获取数据。记住数组编号从开始。

代码示例:

/* Two dimensional array that's 5 x 5
C0 C1 C2 C3 C4R0[1][1][1][1][1]R1[1][1][1][1][1]R2[1][1][1][1][1]R3[1][1][1][1][1]R4[1][1][1][1][1]*/
var row0 = [1,1,1,1,1],row1 = [1,1,1,1,1],row2 = [1,1,1,1,1],row3 = [1,1,1,1,1],row4 = [1,1,1,1,1];
var table = [row0,row1,row2,row3,row4];console.log(table[0][0]); // Get the first item in the array

一个简单的例子:

var blocks = [];
blocks[0] = [];
blocks[0][0] = 7;

你还可以创建一个函数来创建一个2D数组,如下所示:

var myTable = [];
function createArray(myLength) {myTable = new Array(myLength);var cols, rows;for (cols = 0; cols < myLength; cols++) {myTable[cols] = new Array(myLength);}}

您可以使用以下方法调用它,这将为您提供一个10x10 2D数组。

createArray(10);

您还可以使用此方法创建3D数组。

一个很棒的存储库这里

  • API:masfufa.js

  • 样本:masfufa.html

两个例子足以理解这个库:

示例1:

   /*     | 1 , 2 , 3 |* MX= | 4 , 5 , 6 |     Dimensions= 3 x 3*     | 7 , 8 , 9 |*/

jsdk.getAPI('my');var A=[1, 2, 3, 4, 5, 6, 7, 8, 9];var MX=myAPI.getInstance('masfufa',{data:A,dim:'3x3'});

然后:

MX.get[0][0]  // -> 1 (first)MX.get[2][2] //  ->9 (last)

示例2:

   /*      | 1 , 9 , 3 , 4 |* MXB= | 4 , 5 , 6 , 2 |     Dimensions= 2 x 4**/
var B=[1 , 9 , 3 , 4 , 4 , 5 , 6 , 2];var MXB=myAPI.getInstance('masfufa',{data:B,dim:'2x4'});

然后:

MXB.get[0][0]  // -> 1 (first)MXB.get[1][3] //  -> 2 (last)MXB.get[1][2] //  -> 6 (before last)

nodejs+豆沙版本:

var _ = require("lodash");var result = _.chunk(['a', 'b', 'c', 'd', 'e', 'f'], 2);console.log(result);console.log(result[2][0]);

输出:

[ [ 'a', 'b' ], [ 'c', 'd' ], [ 'e', 'f' ] ]e

最理智的答案似乎是

var nrows = ~~(Math.random() * 10);var ncols = ~~(Math.random() * 10);console.log(`rows:${nrows}`);console.log(`cols:${ncols}`);var matrix = new Array(nrows).fill(0).map(row => new Array(ncols).fill(0));console.log(matrix);


请注意,我们不能直接填充行,因为填充使用浅拷贝构造函数,因此所有行都将共享相同内存…下面是一个示例,演示了如何共享每一行(取自其他答案):

// DON'T do this: each row in arr, is sharedvar arr = Array(2).fill(Array(4));arr[0][0] = 'foo'; // also modifies arr[1][0]console.info(arr);

这是我找到的制作二维数组的快速方法。

function createArray(x, y) {return Array.apply(null, Array(x)).map(e => Array(y));}

您也可以轻松地将此函数转换为ES5函数。

function createArray(x, y) {return Array.apply(null, Array(x)).map(function(e) {return Array(y);});}

工作原理:new Array(n)构造函数创建一个原型为Array.prototype的对象,然后分配对象的length,从而产生一个未填充的数组。由于缺乏实际成员,我们无法在其上运行Array.prototype.map函数。

但是,当您向构造函数提供多个参数时,例如当您执行Array(1, 2, 3, 4)时,构造函数将使用arguments对象正确实例化和填充Array对象。

出于这个原因,我们可以使用Array.apply(null, Array(x)),因为apply函数会将参数传播到构造函数中。为了澄清,做Array.apply(null, Array(3))等效于做Array(null, null, null)

现在我们已经创建了一个实际的填充数组,我们需要做的就是调用map并创建第二层(y)。

这就是我所取得的成就:

var appVar = [[]];appVar[0][4] = "bineesh";appVar[0][5] = "kumar";console.log(appVar[0][4] + appVar[0][5]);console.log(appVar);

这个拼写我bineeshkumar

使用数组理解

在JavaScript 1.7及更高版本中,您可以使用数组推导创建二维数组。您还可以在填充数组时过滤和/或操作条目,而不必使用循环。

var rows = [1, 2, 3];var cols = ["a", "b", "c", "d"];
var grid = [ for (r of rows) [ for (c of cols) r+c ] ];
/*grid = [["1a","1b","1c","1d"],["2a","2b","2c","2d"],["3a","3b","3c","3d"]]*/

您可以创建任何您想要的n x m数组,并通过调用

var default = 0;  // your 2d array will be filled with this valuevar n_dim = 2;var m_dim = 7;
var arr = [ for (n of Array(n_dim)) [ for (m of Array(m_dim) default ]]/*arr = [[0, 0, 0, 0, 0, 0, 0],[0, 0, 0, 0, 0, 0, 0],]*/

更多的例子和留档可以找到这里

请注意,这还不是标准功能

在下面,创建一个5x5矩阵并用null填充它们

var md = [];for(var i=0; i<5; i++) {md.push(new Array(5).fill(null));}
console.log(md);

我的方法与@Bineesh答案非常相似,但采用了更一般的方法。

您可以声明双数组如下:

var myDoubleArray = [[]];

并以以下方式存储和访问内容:

var testArray1 = [9,8]var testArray2 = [3,5,7,9,10]var testArray3 = {"test":123}var index = 0;
myDoubleArray[index++] = testArray1;myDoubleArray[index++] = testArray2;myDoubleArray[index++] = testArray3;
console.log(myDoubleArray[0],myDoubleArray[1][3], myDoubleArray[2]['test'],)

这将打印预期输出

[ 9, 8 ] 9 123

一个衬垫创建一个m*n 2维数组,填充0。

new Array(m).fill(new Array(n).fill(0));

这在一些评论中提到,但使用Array.fill()将有助于构建一个二维数组:

function create2dArr(x,y) {var arr = [];for(var i = 0; i < y; i++) {arr.push(Array(x).fill(0));}return arr;}

这将在返回的数组中产生一个长度为x, y次的数组。

对于一个班轮爱好者Array.from()

// creates 8x8 array filed with "0"const arr2d = Array.from({ length: 8 }, () => Array.from({ length: 8 }, () => "0"))

另一个(来自dmitry_romanov的评论)使用数组().填充()

// creates 8x8 array filed with "0"const arr2d = Array(8).fill(0).map(() => Array(8).fill("0"))

使用ES6+传播运算符(“灵感”来自InspiredJW回答:))

// same as above just a little shorterconst arr2d = [...Array(8)].map(() => Array(8).fill("0"))

这是我实现的多维数组。

在这种方法中,我创建了一个单维度数组

我添加了一个原型函数multiArray对象,可用于创建任何维度数组。

我还添加了一个原型函数indexArray对象,可用于从多维索引中获取线性数组中的索引。

创建数组

//Equivalent to arr[I][J][K]..[] in Cvar arr = new Array().multi(I,J,K,..);

在任何索引处访问数组值

//Equivalent in C arr[i][j][k];var vaue = arr[arr.index(i,j,k)];

SNIPPET

/*Storing array as single dimensionand access using Array.index(i,j,k,...)*/

Array.prototype.multi = function(){this.multi_size = arguments;this.multi_len = 1for(key in arguments) this.multi_len *=  arguments[key];for(var i=0;i<this.multi_len;i++) this.push(0);return this;}
Array.prototype.index = function(){var _size = this.multi_len;var temp = 1;var index = 0;for(key in arguments) {temp*=this.multi_size[key];index+=(arguments[key]*(_size/temp))}return index;}
// Now you can use the multi dimension array// A 3x3 2D Matrix
var arr2d = new Array().multi(3,3); // A 2D Arrayarr2d[arr2d.index(1,1,1)]  = 5;console.log(arr2d[arr2d.index(1,1,1)]);
// A 3x3x3 3D Matrix
var arr3d = new Array().multi(3,3,3); // a 3D Arrayarr3d[arr3d.index(1,1,1)]  = 5;console.log(arr3d[arr3d.index(1,1,1)]);
// A 4x3x3 4D Matrixvar arr4d = new Array().multi(4,3,3,3); // a 4D Arrayarr4d[arr4d.index(4,0,0,1)]  = 5;console.log(arr4d[arr4d.index(4,0,0,1)]);

var playList = [['I Did It My Way', 'Frank Sinatra'],['Respect', 'Aretha Franklin'],['Imagine', 'John Lennon'],['Born to Run', 'Bruce Springsteen'],['Louie Louie', 'The Kingsmen'],['Maybellene', 'Chuck Berry']];
function print(message) {document.write(message);}
function printSongs( songs ) {var listHTML;listHTML = '<ol>';for ( var i = 0; i < songs.length; i += 1) {listHTML += '<li>' + songs[i][0] + ' by ' + songs[i][1] + '</li>';}listHTML += '</ol>';print(listHTML);}
printSongs(playList);

如果你想要的只是一个4x4矩阵,看看DOMMatrix,我可以说它很容易使用,

let m = new DOMMatrix();// m.m11, m.m12, m.m13, m.m14, ..., m.m41, m.m42, m.m43, m.m44

最初由于不同的原因带来,它不适用于node.js,仅限于4x4。

此外,您可以考虑使用自动生动化对象代替JS的数组,看看我的答案在这里,但也带来了更多的说服力:

var tree = () => new Proxy({}, { get: (target, name) => name in target ? target[name] : target[name] = tree() });
var t = tree();t[0][2][3] = 4;console.log(t[0][2][3]);

它使用新的JS并且在您迭代它时行为不正确,因此请小心使用它。

如果您需要灵活的多维数组生成器,请查看这个

还有另一种解决方案,它不强制您预先定义二维数组的大小,并且非常简洁。

var table = {}table[[1,2]] = 3 // Notice the double [[ and ]]console.log(table[[1,2]]) // -> 3

这之所以有效,是因为[1,2]被转换为字符串,用作table对象的字符串键

如何创建一个空的二维数组(单行)

Array.from(Array(2), () => new Array(4))

2和4分别是第一和第二维度。

我们正在使用#0,它可以采用类似数组的参数和每个元素的可选映射。

Array.from(arraylike[, mapFn[, thisArg]])

var arr = Array.from(Array(2), () => new Array(4));arr[0][0] = 'foo';console.info(arr);

同样的技巧可以用来创建一个包含1… N的JavaScript数组


或者(但更低效 12%与n = 10,000

Array(2).fill(null).map(() => Array(4))

性能下降是因为我们必须初始化第一个维度值以运行.map。请记住,Array不会分配位置,直到您通过.fill或直接值分配命令它。

var arr = Array(2).fill(null).map(() => Array(4));arr[0][0] = 'foo';console.info(arr);


跟进

这是一个看起来正确的方法,但有问题

 Array(2).fill(Array(4)); // BAD! Rows are copied by reference

虽然它确实返回了明显想要的二维数组([ [ <4 empty items> ], [ <4 empty items> ] ]),但有一个问题:第一维数组已通过引用复制。这意味着arr[0][0] = 'foo'实际上会更改两行而不是一行。

var arr = Array(2).fill(Array(4));arr[0][0] = 'foo';console.info(arr);console.info(arr[0][0], arr[1][0]);

要创建一个非稀疏的“2D”数组(x, y),其中所有索引均可寻址且值设置为null:

let 2Darray = new Array(x).fill(null).map(item =>(new Array(y).fill(null)))

奖励“3D”数组(x, y, z)

let 3Darray = new Array(x).fill(null).map(item=>(new Array(y).fill(null)).map(item=>Array(z).fill(null)))

关于这一点的变化和更正已经在评论和对这个问题的不同回应中提到,但不是作为实际答案,所以我在这里添加它。

应该注意的是(与大多数其他答案类似),它的时间复杂度为O(x*y),因此它可能不适合非常大的数组。

Array.from({length: rows}).map(e => new Array(columns));
 var items = [["January 01", 42.5],["February 01",  44.3],["March 01",  28.7],["April 01",  44.3],["May 01",  22.9],["June 01",  54.4],["July 01",  69.3],["August 01",  19.1],["September 01",  82.5],["October 01",  53.2],["November 01",  75.9],["December 01",  58.7]
];alert(items[1][0]); // February 01alert(items[5][1]); // 54.4

为Java脚本创建n维矩阵数组,填充初始默认值0。

function arr (arg, def = 0){if (arg.length > 2){return Array(arg[0]).fill().map(()=>arr(arg.slice(1)));} else {return Array(arg[0]).fill().map(()=>Array(arg[1]).fill(def));}}
// Simple Usage of 4 dimensionsvar s = arr([3,8,4,6])
// Use null default value with 2 dimensionsvar k = arr([5,6] , null)

阵列专栏大小仅在运行时间中已知,然后以下方法可用于创建动态二维阵列

    var num = '123456';var row = 3; // Known at run timevar col = 2; // Known at run timevar i = 0;    
var array2D = [[]];for(var r = 0; r < row; ++r){array2D[r] = [];for(var c = 0; c < col; ++c){array2D[r][c] = num[i++];}}console.log(array2D);// [[ '1', '2' ],//  [ '3', '4' ],//  [ '5', '6' ]]    
console.log(array2D[2][1]); // 6

ES6+,ES2015+可以用更简单的方式做到这一点


创建3 x 2数组,填充true

[...Array(3)].map(item => Array(2).fill(true))

性能

今天2020.02.05我在Chromev79.0,Safariv13.0.4和Firefox v72.0上对MacO HighSierra 10.13.6进行测试,以获取所选解决方案。

非初始化二维阵列的结论

  • 深奥的解决方案{}/arr[[i,j]](N)对于大数组和小数组是最快的,看起来它是大稀疏数组的不错选择
  • 基于for-[]/while(A,G)的解决方案速度快,是小型阵列的良好选择。
  • 解决方案for-[](B, C)很快,它们是大型阵列的不错选择
  • 基于Array..map/from/fill(I, J, K, L, M)的解决方案对于小数组来说非常慢,对于大数组来说非常快
  • 令人惊讶的是for-Array(n)(B, C)在Safari上比for-[](A)慢得多
  • SurprinSinglyfor-[](A)对于大数组在所有浏览器上都很慢
  • 解决方案K对于所有浏览器的小数组都很慢
  • 解决方案A、E、G对于所有浏览器的大数组都很慢
  • 对于所有浏览器上的所有数组,解决方案M最慢

在此处输入图片描述

初始化二维阵列的结论

  • 基于for/while(A, B, C, D, E, G)的解决方案对于所有浏览器上的小数组来说是最快/相当快的
  • 基于for(A, B, C, E)的解决方案对于所有浏览器上的大数组来说最快/相当快
  • 基于Array..map/from/fill(I, J, K, L, M)的解决方案对于所有浏览器上的小数组来说都是中速或慢速
  • 大数组的解决方案F、G、H、I、J、K、L在chrome和Safari上是中等或快速的,但在Firefox上最慢。
  • 深奥的解决方案{}/arr[[i,j]](N)对于所有浏览器上的大小数组来说是最慢的

在此处输入图片描述

详情

测试未填充(初始化)输出数组的解决方案

我们测试解决方案的速度

  • 小数组(12个元素)-您可以在机器上执行测试这里
  • 大数组(100万元素)数组-您可以在机器上执行测试这里

function A(r) {var arr = [];for (var i = 0; i < r; i++) arr[i] = [];return arr;}
function B(r, c) {var arr = new Array(r);for (var i = 0; i < arr.length; i++) arr[i] = new Array(c);return arr;}
function C(r, c) {var arr = Array(r);for (var i = 0; i < arr.length; i++) arr[i] = Array(c);return arr;}
function D(r, c) {// strange, but worksvar arr = [];for (var i = 0; i < r; i++) {arr.push([]);arr[i].push(Array(c));}return arr;}
function E(r, c) {let array = [[]];for (var x = 0; x < c; x++) {array[x] = [];for (var y = 0; y < r; y++) array[x][y] = [0];}return array;}
function F(r, c) {var makeArray = function(dims, arr) {if (dims[1] === undefined) {return Array(dims[0]);}
arr = Array(dims[0]);
for (var i = 0; i < dims[0]; i++) {arr[i] = Array(dims[1]);arr[i] = makeArray(dims.slice(1), arr[i]);}
return arr;}return makeArray([r, c]);}
function G(r) {var a = [];while (a.push([]) < r);return a;}
function H(r,c) {function createArray(length) {var arr = new Array(length || 0),i = length;
if (arguments.length > 1) {var args = Array.prototype.slice.call(arguments, 1);while(i--) arr[length-1 - i] = createArray.apply(this, args);}
return arr;}return createArray(r,c);}
function I(r, c) {return [...Array(r)].map(x => Array(c));}
function J(r, c) {return Array(r).fill(0).map(() => Array(c));}
function K(r, c) {return Array.from(Array(r), () => Array(c));}
function L(r, c) {return Array.from({length: r}).map(e => Array(c));}
function M(r, c) {return Array.from({length: r}, () => Array.from({length: c}, () => {}));}
function N(r, c) {return {}}


// -----------------------------------------------// SHOW// -----------------------------------------------
log = (t, f) => {let A = f(3, 4); // create array with 3 rows and 4 columnsA[1][2] = 6 // 2-nd row 3nd column set to 6console.log(`${t}[1][2]: ${A[1][2]}, full: ${JSON.stringify(A).replace(/null/g,'x')}`);}
log2 = (t, f) => {let A = f(3, 4); // create array with 3 rows and 4 columnsA[[1,2]] = 6 // 2-nd row 3nd column set to 6console.log(`${t}[1][2]: ${A[[1,2]]}, full: ${JSON.stringify(A).replace(/null/g,'x')}`);}
log('A', A);log('B', B);log('C', C);log('D', D);log('E', E);log('F', F);log('G', G);log('H', H);log('I', I);log('J', J);log('K', K);log('L', L);log('M', M);log2('N', N);
This is presentation of solutions - not benchmark

Test for solutions which fill (initialise) output array

We test speed of solutions for

  • small arrays (12 elements) - you can perform tests on your machine HERE
  • big arrays (1 million elements) arrays - you can perform tests on your machine HERE

function A(r, c, def) {var arr = [];for (var i = 0; i < r; i++) arr[i] = Array(c).fill(def);return arr;}
function B(r, c, def) {var arr = new Array(r);for (var i = 0; i < arr.length; i++) arr[i] = new Array(c).fill(def);return arr;}
function C(r, c, def) {var arr = Array(r);for (var i = 0; i < arr.length; i++) arr[i] = Array(c).fill(def);return arr;}
function D(r, c, def) {// strange, but worksvar arr = [];for (var i = 0; i < r; i++) {arr.push([]);arr[i].push(Array(c));}for (var i = 0; i < r; i++) for (var j = 0; j < c; j++) arr[i][j]=defreturn arr;}
function E(r, c, def) {let array = [[]];for (var x = 0; x < c; x++) {array[x] = [];for (var y = 0; y < r; y++) array[x][y] = def;}return array;}
function F(r, c, def) {var makeArray = function(dims, arr) {if (dims[1] === undefined) {return Array(dims[0]).fill(def);}
arr = Array(dims[0]);
for (var i = 0; i < dims[0]; i++) {arr[i] = Array(dims[1]);arr[i] = makeArray(dims.slice(1), arr[i]);}
return arr;}return makeArray([r, c]);}
function G(r, c, def) {var a = [];while (a.push(Array(c).fill(def)) < r);return a;}
function H(r,c, def) {function createArray(length) {var arr = new Array(length || 0),i = length;
if (arguments.length > 1) {var args = Array.prototype.slice.call(arguments, 1);while(i--) arr[length-1 - i] = createArray.apply(this, args).fill(def);}
return arr;}return createArray(r,c);}
function I(r, c, def) {return [...Array(r)].map(x => Array(c).fill(def));}
function J(r, c, def) {return Array(r).fill(0).map(() => Array(c).fill(def));}
function K(r, c, def) {return Array.from(Array(r), () => Array(c).fill(def));}
function L(r, c, def) {return Array.from({length: r}).map(e => Array(c).fill(def));}
function M(r, c, def) {return Array.from({length: r}, () => Array.from({length: c}, () => def));}
function N(r, c, def) {let arr={};for (var i = 0; i < r; i++) for (var j = 0; j < c; j++) arr[[i,j]]=def;return arr;}


// -----------------------------------------------// SHOW// -----------------------------------------------
log = (t, f) => {let A = f(1000,1000,7); // create array with 1000 rows and 1000 columns,// each array cell initilised by 7A[800][900] = 5         // 800nd row and 901nd column set to 5console.log(`${t}[1][2]: ${A[1][2]}, ${t}[800][901]: ${A[800][900]}`);}
log2 = (t, f) => {let A = f(1000,1000,7); // create array with 1000 rows and 1000 columns,// each array cell initilised by 7A[[800,900]] = 5            // 800nd row 900nd column set to 5console.log(`${t}[1][2]: ${A[[1,2]]}, ${t}[800][900]: ${A[[800,900]]}`);}
log('A', A);log('B', B);log('C', C);log('D', D);log('E', E);log('F', F);log('G', G);log('H', H);log('I', I);log('J', J);log('K', K);log('L', L);log('M', M);log2('N', N);
This is presentation of solutions - not benchmark

enter image description here

我不是使用.fill()的ES6解决方案的粉丝。有些可能会起作用,但避免引用复制问题的额外环使它们变得不直观。

我建议的ES6方法是充分利用外部和内部阵列的扩展运算符。

[...Array(3)].map(() => [...Array(4)])

如果您需要设置初始值,那么您可以在内部数组创建上链接.map()

[...Array(3)].map(() => [...Array(4)].map(() => 0))

最后,一个类型安全的TypeScript util函数:

export const createMultiDimensionalArray = <T>(n: number,m: number,initialVal?: T,): T[][] => {const matrix = [...Array(n)].map(() => [...Array(m)]);return initialVal === undefined? matrix: matrix.map(r => r.map(() => initialVal));};

使用它的示例:

const a = createMultiDimensionalArray(1, 2);a[1][2] = 3;     // Works
const b = createMultiDimensionalArray(2, 3, false);b[1][2] = true;  // Worksb[1][2] = 3;     // Error: Type '3' is not assignable to type 'boolean'.

要创建一个4x6数组,只需这样做

const x = [...new Array(6)].map(elem => new Array(4))

通常最好从空数组开始,而不是填充w个随机值。(您通常在1D中将数组声明为const x = [],因此最好在2D中从w空开始。)

Array(m).fill(v).map(() => Array(n).fill(v))

您可以创建一个初始值为m的二维数组m x nn可以是任何数字v可以是任何值stringnumberundefined

一种方法可以是var a = [m][n]

以下示例定义了一个名为活动的二维数组:

    let activities = [['Work', 9],['Eat', 1],['Commute', 2],['Play Game', 1],['Sleep', 7]];

在活动数组中,第一个维度表示活动,第二个维度显示每个活动每天花费的小时数。

要在控制台中显示活动数组,您可以使用console.table()方法,如下所示:

console.table(activities);

下面说明了输出:

┌─────────┬─────────────┬───┐│ (index) │      0      │ 1 │├─────────┼─────────────┼───┤│    0    │   'Work'    │ 9 ││    1    │    'Eat'    │ 1 ││    2    │  'Commute'  │ 2 ││    3    │ 'Play Game' │ 1 ││    4    │   'Sleep'   │ 7 │└─────────┴─────────────┴───┘

请注意,(index)列用于表示内部数组索引的说明。

要访问多维数组的元素,首先使用方括号访问返回内部数组的外部数组的元素;然后使用另一个方括号访问内部数组的元素。

以下示例返回上面活动数组中第一个内部数组的第二个元素:

console.log(activities[0][1]); // 9

向JavaScript多维数组添加元素

您可以使用Array方法(例如push()splice())来操作多维数组的元素。

例如,要在多维数组的末尾添加一个新元素,您可以使用push()方法,如下所示:

activities.push(['Study',2]);
┌─────────┬─────────────┬───┐│ (index) │      0      │ 1 │├─────────┼─────────────┼───┤│    0    │   'Work'    │ 9 ││    1    │    'Eat'    │ 1 ││    2    │  'Commute'  │ 2 ││    3    │ 'Play Game' │ 1 ││    4    │   'Sleep'   │ 7 ││    5    │   'Study'   │ 2 │└─────────┴─────────────┴───┘

要在数组中间插入一个元素,您可以使用splice()方法。下面在活动数组的第二个位置插入一个元素:

activities.splice(1, 0, ['Programming', 2]);
┌─────────┬───────────────┬───┐│ (index) │       0       │ 1 │├─────────┼───────────────┼───┤│    0    │    'Work'     │ 9 ││    1    │ 'Programming' │ 2 ││    2    │     'Eat'     │ 1 ││    3    │   'Commute'   │ 2 ││    4    │  'Play Game'  │ 1 ││    5    │    'Sleep'    │ 7 ││    6    │    'Study'    │ 2 │└─────────┴───────────────┴───┘

此示例计算每个活动花费的小时数百分比,并将百分比附加到内部数组。

activities.forEach(activity => {let percentage = ((activity[1] / 24) * 100).toFixed();activity[2] = percentage + '%';});
┌─────────┬───────────────┬───┬───────┐│ (index) │       0       │ 1 │   2   │├─────────┼───────────────┼───┼───────┤│    0    │    'Work'     │ 9 │ '38%' ││    1    │ 'Programming' │ 2 │ '8%'  ││    2    │     'Eat'     │ 1 │ '4%'  ││    3    │   'Commute'   │ 2 │ '8%'  ││    4    │  'Play Game'  │ 1 │ '4%'  ││    5    │    'Sleep'    │ 7 │ '29%' ││    6    │    'Study'    │ 2 │ '8%'  │└─────────┴───────────────┴───┴───────┘

从JavaScript多维数组中删除元素

要从数组中删除元素,请使用pop()splice()方法。

例如,以下语句删除活动数组的最后一个元素:

activities.pop();
┌─────────┬───────────────┬───┬───────┐│ (index) │       0       │ 1 │   2   │├─────────┼───────────────┼───┼───────┤│    0    │    'Work'     │ 9 │ '38%' ││    1    │ 'Programming' │ 2 │ '8%'  ││    2    │     'Eat'     │ 1 │ '4%'  ││    3    │   'Commute'   │ 2 │ '8%'  ││    4    │  'Play Game'  │ 1 │ '4%'  ││    5    │    'Sleep'    │ 7 │ '29%' │└─────────┴───────────────┴───┴───────┘

类似地,您可以使用pop()方法从多维数组的内部数组中删除元素。以下示例从活动数组的内部数组中删除百分比元素。

activities.forEach((activity) => {activity.pop(2);});
┌─────────┬───────────────┬───┐│ (index) │       0       │ 1 │├─────────┼───────────────┼───┤│    0    │    'Work'     │ 9 ││    1    │ 'Programming' │ 2 ││    2    │     'Eat'     │ 1 ││    3    │   'Commute'   │ 2 ││    4    │  'Play Game'  │ 1 ││    5    │    'Sleep'    │ 7 │└─────────┴───────────────┴───┘

迭代JavaScript多维数组的元素

要迭代多维数组,请使用嵌套的for循环,如下例所示。

// loop the outer array
for (let i = 0; i < activities.length; i++) {// get the size of the inner arrayvar innerArrayLength = activities[i].length;// loop the inner arrayfor (let j = 0; j < innerArrayLength; j++) {console.log('[' + i + ',' + j + '] = ' + activities[i][j]);}}

第一个循环迭代外部数组的元素,嵌套循环迭代内部数组的元素。

下面显示了脚本在控制台中的输出:

[0,0] = Work[0,1] = 9[1,0] = Eat[1,1] = 1[2,0] = Commute[2,1] = 2[3,0] = Play Game[3,1] = 1[4,0] = Sleep[4,1] = 7[5,0] = Study[5,1] = 2

或者你可以使用forEach()方法两次:

activities.forEach((activity) => {activity.forEach((data) => {console.log(data);});});
Work9Eat1Commute2Play Game1Sleep7Study2
const arr = new Array(5).fill(new Array(5).fill(0));console.log(arr);

使用全局对象Array并用数组填充项:

let arr = new Array(5).fill([]);

如果已知长度的二维数组:

let arr = new Array(5).fill(new Array(2));

我的解决方案不是最好的,只是给我的解决方案来创建用户定义的多维数组。

这个函数接受行和列,

function createArray(row,column) {let arr = [];
for(var i=0; i<row; i++){arr[i] = [Math.floor(Math.random() * (10))];
for(var j=0;j<column;j++){arr[i][j]= [Math.floor(Math.random() * (20))];}}
return arr;}
var arrVal = createArray(4, 5);
console.log(arrVal);

这将构造任何维度的数组。

function makeArrayChildren(parent, firstDimension, ...dimensions) {for (let i = 0; i < parent.length; i++) {parent[i] = new Array(firstDimension);if (dimensions.length != 0) {makeArrayChildren(parent[i], ...dimensions);}}}function makeArray(firstDimension, ...dimensions) {if (firstDimension == undefined) {throw Exception("Too few dimensions");}let topArray = new Array(firstDimension);if (dimensions.length != 0) makeArrayChildren(topArray, ...dimensions);return topArray;}

这是我想创建的另外两个函数,我可以将其用作健全性检查:a for each对多维数组中所有最低级别的项目执行,以及一个填充方法。

Array.prototype.dimensionalFill = function (value) {for (let i = 0; i < this.length; i++) {const elem = this[i];if (elem instanceof Array) {elem.dimensionalFill(value);} else {this[i] = value;}}};/*Unlike forEach, this also loops over undefined values. */Array.prototype.dimensionalForEach = function (callableFunc, thisArg) {if (thisArg != undefined) {return this.dimensionalForEach(callableFunc.bind(thisArg));}for (let i = 0; i < this.length; i++) {const elem = this[i];if (elem instanceof Array) {elem.dimensionalForEach(callableFunc);} else {callableFunc(elem, i, this);}}};

这里有一个很好的小理智检查,它使用了所有的功能。所以至少,它不可能是完全错误的。

let arr = makeArray(10, 10, 5, 4);arr.dimensionalFill(2);let sum = 0;arr.dimensionalForEach((elem) => {sum += elem;});console.log(`sum: ${sum} === ${10 * 10 * 5 * 4 * 2}`);

值得一提的是,在这一点上,创建一个全新的结构是一个更好的做法,但这很有趣。