Déclarer un tableau bidimensionnel vide en Javascript ?

Question

Je veux créer un tableau à deux dimensions en Javascript où je vais stocker les coordonnées (x,y). Je ne sais pas encore combien de paires de coordonnées j'aurai car elles seront générées dynamiquement par l'entrée de l'utilisateur.

Exemple de tableau 2d prédéfini :

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

Je suppose que je peux utiliser la méthode PUSH pour ajouter un nouvel enregistrement à la fin du tableau.

Comment puis-je déclarer un tableau vide à deux dimensions de sorte que lorsque j'utilise mon premier Arr.push(), il sera ajouté à l'index 0, et chaque enregistrement suivant écrit par push prendra l'index suivant ?

C'est probablement très facile à faire, je ne suis qu'un novice en matière de JS, et j'apprécierais si quelqu'un pouvait écrire un court extrait de code fonctionnel que je pourrais examiner. Merci

Answer 1

Je sais qu'il s'agit d'un vieux sujet, mais je voudrais suggérer l'utilisation d'un fichier de type array of objects plutôt qu'un array of arrays . Je pense que cela rend le code plus simple à comprendre et à mettre à jour.

// 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>

Answer 2

ES6

const rows = 2;
const columns = 3;

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

console.log(matrix);

Answer 3

Créer un objet et pousser cet objet dans un tableau

 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);

}

Answer 4

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);

Answer 5

Si nous n'utilisons pas ES2015 et que nous n'avons pas fill(), nous utilisons simplement .apply()

Voir https://stackoverflow.com/a/47041157/1851492

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)));