在Javascript中声明一个空的二维数组?

118

我想在Javascript中创建一个二维数组,用于存储坐标(x,y)。由于这些坐标将由用户输入动态生成,因此我还不知道会有多少对坐标。

预定义的二维数组示例:

var Arr=[[1,2],[3,4],[5,6]];

我想我可以使用PUSH方法在数组末尾添加新记录。

如何声明一个空的二维数组,使得当我使用我的第一个Arr.push()时,它将被添加到索引0,并且每个下一个由push写入的记录都会取下一个索引?

这可能非常容易做到,我只是JS的新手,如果有人能写一段简短的可行代码片段供我查看,我将不胜感激。谢谢。


你尝试过 var Arr = new Array(new Array()); 吗?是的, pushpop 会在数组末尾添加或删除元素,而 shiftunshift 则会在数组开头删除或添加元素。 - abiessu
这听起来像是两个不同的问题。首先,您想要任意大小的数组。然后,您似乎在问一个涉及push方法的不同问题。(此外,如果您想回答自己的问题,我认为最好在答案部分中回答。)这是Google中创建JavaScript多维数组的排名前列的问题,我知道Google并不在这里决定内容,但我认为这是一个基本重要的问题,有各种奇怪的答案。 - PJ Brunet
23个回答

3

我知道这是一个老线程,但我建议使用对象数组而不是数组数组。我认为这会使代码更简单易懂且易于更新。

// Use meaningful variable names like 'points', 
// anything better than a bad pirate joke, 'arr'!
var points = [];

// Create an object literal, then add it to the array
var point = {x: 0, y: 0};
points.push(point);

// Create and add the object to the array in 1 line
points.push({x:5, y:5});

// Create the object from local variables 
var x = 10;
var y = 8;
points.push({x, y});

// Ask the user for a point too
var response = prompt("Please enter a coordinate point. Example: 3,8");
var coords = response.split(",").map(Number);
points.push({x: coords[0], y: coords[1]});

// Show the results
var canvas = document.getElementById('graph');
var painter = canvas.getContext("2d");
var width = canvas.width, height = canvas.height;
var scale = 10, radius = 3.5, deg0 = 0, deg360 = 2 * Math.PI;

painter.beginPath();
for (var point of points) {
    var x = point.x * scale + scale;
    var y = height - point.y * scale - scale;
    painter.moveTo(x + radius, y);
    painter.arc(x, y, radius, deg0, deg360);
    painter.fillText(`${point.x}, ${point.y}`, x + radius + 1, y + radius + 1);
}
painter.stroke();
<canvas id="graph" width="150" height="150" style="border: 1px solid red;"></canvas>


2
const grid = Array.from(Array(3), e => Array(4));

Array.from(arrayLike, mapfn)

mapfn被调用,并传入了值undefined,返回了new Array(4)

接下来创建一个迭代器并重复调用next值。从next返回的值next().valueundefined。这个值undefined然后被传递给新创建的数组的迭代器。每次迭代的value都是undefined,可以通过记录来看到。

var grid2 = Array.from(Array(3), e => {
  console.log(e); // undefined
  return Array(4); // a new Array.
});

请添加一些描述,说明这个程序是如何工作的以及为什么能够工作。你的回答应该让其他用户可以从中学习到知识。 - david
如果你想将数组初始化为特定值比如0:const grid = Array.from(Array(3), () => Array(4).fill(0)) - Ludovic Kuty

2

ES6

const rows = 2;
const columns = 3;

const matrix = [...Array(rows)].map(() => [...Array(columns)].fill(0));

console.log(matrix);


1
创建一个对象并将该对象推入数组中。
 var jSONdataHolder = function(country, lat, lon) {

    this.country = country;
    this.lat = lat;
    this.lon = lon;
}

var jSONholderArr = [];

jSONholderArr.push(new jSONdataHolder("Sweden", "60", "17"));
jSONholderArr.push(new jSONdataHolder("Portugal", "38", "9"));
jSONholderArr.push(new jSONdataHolder("Brazil", "23", "-46"));

var nObj = jSONholderArr.length;
for (var i = 0; i < nObj; i++) {
   console.log(jSONholderArr[i].country + "; " + jSONholderArr[i].lat + "; " + 
   jSONholderArr[i].lon);

}

1
创建一个空矩阵最简单的方法就是将其定义为空数组:
// Empty data structure
const matrix = []

然而,我们希望用 nm 参数来表示类似于网格的东西,如果事先知道这些参数,那么我们可以使用它来代替。

// n x m data structure
const createGrid = (n, m) => [...Array(n)].map(() => [...Array(m)].fill(0))
const grid = createGrid(3, 5)

这里是一个简单的片段,展示了如何使用它们。

const createGrid = (n, m) => [...Array(n)].map(() => [...Array(m)].fill(0))

const toString = m => JSON.stringify(m)
  .replace(/(\[\[)(.*)(]])/g, '[\n  [$2]\n]')
  .replace(/],/g, '],\n  ')

// Empty data structure
const matrix = []
console.log(toString(matrix))

matrix.push([1,2,3])
matrix.push([4,5,6])
matrix.push([7,8,9])
console.log(toString(matrix))

// n x m data structure
const grid = createGrid(3, 5)
console.log(toString(grid))


1

var arr = [];
var rows = 3;
var columns = 2;

for (var i = 0; i < rows; i++) {
    arr.push([]); // creates arrays in arr
}
console.log('elements of arr are arrays:');
console.log(arr);

for (var i = 0; i < rows; i++) {
    for (var j = 0; j < columns; j++) {
        arr[i][j] = null; // empty 2D array: it doesn't make much sense to do this
    }
}
console.log();
console.log('empty 2D array:');
console.log(arr);

for (var i = 0; i < rows; i++) {
    for (var j = 0; j < columns; j++) {
        arr[i][j] = columns * i + j + 1;
    }
}
console.log();
console.log('2D array filled with values:');
console.log(arr);


0

如果我们不使用ES2015并且没有fill(),只需使用.apply()

请参见https://dev59.com/12kv5IYBdhLWcg3wpCXJ#47041157

let Array2D = (r, c, fill) => Array.apply(null, new Array(r))
  .map(function() {
    return Array.apply(null, new Array(c))
      .map(function() {return fill})
  })

console.log(JSON.stringify(Array2D(3,4,0)));
console.log(JSON.stringify(Array2D(4,5,1)));


0

不需要那么麻烦!很简单

这将创建一个2 * 3的字符串矩阵。

var array=[];
var x = 2, y = 3;
var s = 'abcdefg';

for(var i = 0; i<x; i++){
    array[i]=new Array();
      for(var j = 0; j<y; j++){
         array[i].push(s.charAt(counter++));
        }
    }

-2

这里有什么问题呢?

var arr2 = new Array(10,20);
    arr2[0,0] = 5;
    arr2[0,1] = 2
    console.log("sum is   " + (arr2[0,0] +  arr2[0,1]))

应该读出“总和是7”


4
现在将 arr2[1,0] 设为 4。 然后运行 console.log("sum is " + (arr2[0,0] + arr2[0,1])),输出结果为 "sum is 6"。 实际上你没有创建一个二维数组,而是创建了一个包含元素 "10" 和 "20" 的简单数组。当你使用逗号分隔的索引访问元素时,实际上所做的是参考这里的描述:https://dev59.com/W2s05IYBdhLWcg3wIelj - Daniel
这段代码有很多问题。new Array(10,20):1. 应该避免使用数组构造函数。2. 即使按照现在的代码,这是一个一维数组,而不是二维数组。接下来的两行也是错误的,arr[x,y] 并没有获取数组中的 xy 坐标,而是 逗号运算符,它将解析为最后一个表达式。因此,对于赋值和检索,arr[x,y] 始终arr[y] 相同。日志也是如此。每一行都是错误的,整个方法也是如此。 - VLAZ

-2
通常我们知道列数,但可能不知道行数(记录数)。这是我的解决方案的一个例子,利用了上面提到的很多内容。(对于那些比我更有经验的JS开发者 - 几乎所有人 - 欢迎任何代码改进建议)
     var a_cols = [null,null,null,null,null,null,null,null,null];
     var a_rxc  = [[a_cols]];

     // just checking  var arr =  a_rxc.length ; //Array.isArray(a_rxc);
     // alert ("a_rxc length=" + arr) ; Returned 1 
     /* Quick test of array to check can assign new rows to a_rxc. 
        i can be treated as the rows dimension and  j the columns*/
       for (i=0; i<3; i++) {
          for (j=0; j<9; j++) {
            a_rxc[i][j] = i*j;
            alert ("i=" + i + "j=" + j + "  "  + a_rxc[i][j] );
           }
          if (i+1<3) { a_rxc[i+1] = [[a_cols]]; }
        }

如果将这个数组传递给服务器,对我有效的ajax是

 $.post("../ajax/myservercode.php",
       {
        jqArrArg1 : a_onedimarray,
        jqArrArg2 : a_rxc
       },
       function(){  },"text" )
        .done(function(srvresp,status) { $("#id_PageContainer").html(srvresp);} ) 
        .fail(function(jqXHR,status) { alert("jqXHR AJAX error " + jqXHR + ">>" + status );} );

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接