Comment créer un tableau à deux dimensions en JavaScript?
J'ai lu en ligne et certains endroits disent que ce n'est pas possible, certains le disent, puis donnent un exemple et d'autres réfutent l'exemple, etc.
Comment déclarer un tableau à 2 dimensions en JavaScript? (en supposant que c'est possible)
Comment pourrais-je accéder à ses membres? (
myArray[0][1]oumyArray[0,1]?)
var items = [
[1, 2],
[3, 4],
[5, 6]
];
console.log(items[0][0]); // 1
console.log(items);Vous créez simplement chaque élément du tableau en tableau.
var x = new Array(10);
for (var i = 0; i < x.length; i++) {
x[i] = new Array(3);
}
console.log(x);Semblable à la réponse de activa, voici une fonction permettant de créer un tableau à n dimensions:
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)]
Javascript ne contient que des tableaux à une dimension, mais vous pouvez créer des tableaux de tableaux, comme d'autres l'ont souligné.
La fonction suivante peut être utilisée pour construire un tableau à 2 dimensions de dimensions fixes:
function Create2DArray(rows) {
var arr = [];
for (var i=0;i<rows;i++) {
arr[i] = [];
}
return arr;
}
Le nombre de colonnes n'est pas vraiment important car il n'est pas nécessaire de spécifier la taille d'un tableau avant de l'utiliser.
Ensuite, vous pouvez simplement appeler:
var arr = Create2DArray(100);
arr[50][2] = 5;
arr[70][5] = 7454;
// ...
Le moyen le plus simple:
var myArray = [[]];
Certains disent que cela n’est pas possible, c’est qu’un tableau à deux dimensions n’est en réalité qu’un tableau de tableaux. Les autres commentaires ici fournissent des méthodes parfaitement valables pour créer des tableaux bidimensionnels en JavaScript, mais le point de vue le plus pur serait que vous disposiez d'un tableau unidimensionnel d'objets, chacun de ces objets étant un tableau unidimensionnel composé de deux éléments.
Donc, c'est la cause des points de vue contradictoires.
Peu de gens montrent l’utilisation de Push:
Pour apporter quelque chose de nouveau, je vais vous montrer comment initialiser la matrice avec une valeur, par exemple: 0 ou une chaîne vide "".
Rappelant que si vous avez un tableau de 10 éléments, le dernier index en javascript sera 9!
function matrix( rows, cols, defaultValue){
var arr = [];
// Creates all lines:
for(var i=0; i < rows; i++){
// Creates an empty line
arr.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;
}
exemples d'utilisation:
x = matrix( 2 , 3,''); // 2 lines, 3 cols filled with empty string
y = matrix( 10, 5, 0);// 10 lines, 5 cols filled with 0
Deux lignes:
var a = [];
while(a.Push([]) < 10);
Il générera un tableau a de longueur 10, rempli de tableaux . (Push ajoute un élément à un tableau et renvoie la nouvelle longueur)
La réponse la plus saine semble être
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);Notez que nous ne pouvons pas directement remplir les lignes car celui-ci utilise un constructeur de copie superficielle, donc toutes les lignes partageraient la mémoire same ... voici un exemple qui montre comment chaque ligne serait partagée (prise de autres réponses):
// DON'T do this: each row in arr, is shared
var arr = Array(2).fill(Array(4));
arr[0][0] = 'foo'; // also modifies arr[1][0]
console.info(arr);
Comment créer un tableau vide à deux dimensions (une ligne)
Array.from(Array(2), () => new Array(4))
2 et 4 étant respectivement les première et deuxième dimensions.
Nous utilisons actuellement Array.from , qui peut prendre un paramètre de type tableau et un mappage facultatif pour chacun des éléments.
Array.from (arrayLike [ mapFn [ thisArg]])
var arr = Array.from(Array(2), () => new Array(4));
arr[0][0] = 'foo';
console.info(arr);La même astuce peut être utilisée pour Créer un tableau JavaScript contenant 1 ... N
Alternativement (mais plus inefficace 12% avec n = 10,000)
Array(2).fill(null).map(() => Array(4))
La diminution des performances est liée au fait que nous devons initialiser les premières valeurs de dimension pour exécuter .map. N'oubliez pas que Array n'attribuera pas les postes tant que vous ne l'avez pas commandé via .fill ou une attribution directe.
var arr = Array(2).fill(null).map(() => Array(4));
arr[0][0] = 'foo';
console.info(arr);Suivre
Pourquoi ça ne marche pas?
Array(2).fill(Array(4));
Bien qu'il renvoie le tableau à deux dimensions apparemment souhaité ([ [ <4 empty items> ], [ <4 empty items> ] ]), il y a une erreur: les tableaux de première dimension ont été copiés par référence. Cela signifie qu'un arr[0][0] = 'foo' changerait en réalité deux lignes au lieu d'une.
var arr = Array(2).fill(Array(4));
arr[0][0] = 'foo';
console.info(arr);
console.info(arr[0][0], arr[1][0]);Le moyen le plus simple:
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'
C'est ce que j'ai réalisé:
var appVar = [[]];
appVar[0][4] = "bineesh";
appVar[0][5] = "kumar";
console.log(appVar[0][4] + appVar[0][5]);
console.log(appVar);Cela m'a épelé bineeshkumar
Les tableaux à deux dimensions sont créés de la même manière que les tableaux à une dimension. Et vous y accédez comme array[0][1].
var arr = [1, 2, [3, 4], 5];
alert (arr[2][1]); //alerts "4"
Je ne sais pas si quelqu'un a répondu à cela, mais j'ai trouvé que cela fonctionnait assez bien pour moi -
var array = [[,],[,]]
par exemple:
var a = [[1,2],[3,4]]
Pour un tableau à 2 dimensions, par exemple.
Pour créer un tableau 2D en javaScript, nous pouvons d'abord créer un tableau, puis ajouter des tableaux en tant qu'éléments. Cette méthode renverra un tableau 2D avec le nombre donné de lignes et de colonnes.
function Create2DArray(rows,columns) {
var x = new Array(rows);
for (var i = 0; i < rows; i++) {
x[i] = new Array(columns);
}
return x;
}
pour créer un tableau, utilisez cette méthode comme ci-dessous.
var array = Create2DArray(10,20);
Utiliser les compréhensions de tableau
Dans JavaScript 1.7 et les versions ultérieures, vous pouvez utiliser array comprehensions pour créer des tableaux à deux dimensions. Vous pouvez également filtrer et/ou manipuler les entrées tout en remplissant le tableau sans avoir à utiliser de boucles.
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"]
]
*/
Vous pouvez créer le tableau n x m de votre choix et le renseigner avec une valeur par défaut en appelant
var default = 0; // your 2d array will be filled with this value
var 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],
]
*/
Vous trouverez plus d'exemples et de documentation ici .
Veuillez noter qu'il ne s'agit pas encore d'une fonctionnalité standard.
Mon approche est très similaire à la réponse @Bineesh mais avec une approche plus générale.
Vous pouvez déclarer le tableau double comme suit:
var myDoubleArray = [[]];
Et le stockage et l'accès au contenu de la manière suivante:
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'],)
Ceci imprimera le résultat attendu
[ 9, 8 ] 9 123
Pour les amoureux du paquebot Array.from ()
// creates 8x8 array filed with "0"
const arr2d = Array.from({ length: 8 }, () => Array.from({ length: 8 }, () => "0"));
Un autre (tiré du commentaire de dmitry_romanov) utilise Array (). Fill ()
// creates 8x8 array filed with "0"
const arr2d = Array(8).fill(0).map(() => Array(8).fill("0"));
Pour créer un tableau "2D" non fragmenté (x, y) avec tous les index adressables et les valeurs définies sur null:
let 2Darray = new Array(x).fill(null).map(item =>(new Array(y).fill(null)))
bonus "Tableau 3D" (x, y, z)
let 3Darray = new Array(x).fill(null).map(item=>(new Array(y).fill(null)).map(item=>Array(z).fill(null)))
Des variations et des corrections à ce sujet ont été mentionnées dans les commentaires et à divers moments en réponse à cette question, mais pas comme une réponse réelle, je l’ajoute donc ici.
Il convient de noter que (semblable à la plupart des autres réponses), il a une complexité temporelle O (x * y), il ne convient donc probablement pas pour les très grands tableaux.
J'ai trouvé ci-dessous le moyen le plus simple:
var array1 = [[]];
array1[0][100] = 5;
alert(array1[0][100]);
alert(array1.length);
alert(array1[0].length);
Voici un moyen rapide que j'ai trouvé pour faire un tableau à deux dimensions.
function createArray(x, y) {
return Array.apply(null, Array(x)).map(e => Array(y));
}
Vous pouvez facilement transformer cette fonction en une fonction ES5.
function createArray(x, y) {
return Array.apply(null, Array(x)).map(function(e) {
return Array(y);
});
}
Pourquoi cela fonctionne-t-il: le constructeur new Array(n) crée un objet avec un prototype de Array.prototype et affecte ensuite la variable length de l'objet, ce qui crée un tableau non rempli En raison de son manque de membres réels, nous ne pouvons pas exécuter la fonction Array.prototype.map dessus.
Toutefois, lorsque vous fournissez plus d'un argument au constructeur, par exemple Array(1, 2, 3, 4), celui-ci utilisera l'objet arguments pour instancier et remplir correctement un objet Array.
Pour cette raison, nous pouvons utiliser Array.apply(null, Array(x)), car la fonction apply répandra les arguments dans le constructeur. Pour plus de précision, faire Array.apply(null, Array(3)) équivaut à faire Array(null, null, null).
Maintenant que nous avons créé un tableau rempli, il suffit d’appeler map et de créer la deuxième couche (y).
Javascript ne prend pas en charge les tableaux à deux dimensions, mais stocke un tableau dans un autre tableau et récupère les données de ce tableau en fonction de la position de ce tableau à laquelle vous souhaitez accéder. Rappelez-vous que la numérotation des tableaux commence àZ&EACUTE;RO.
Exemple de code:
/* Two dimensional array that's 5 x 5
C0 C1 C2 C3 C4
R0[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
En dessous de l’un, crée une matrice 5x5 et remplit-la avec null
var md = [];
for(var i=0; i<5; i++) {
md.Push(new Array(5).fill(null));
}
console.log(md);Je devais créer une fonction de tableau flexible pour y ajouter des "enregistrements" selon mes besoins, pour pouvoir les mettre à jour et faire les calculs nécessaires avant de les envoyer à une base de données pour un traitement ultérieur. Voici le code, j'espère que ça aide :).
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 array
aColumns = []; // Resets temporary array
aPos++ // Increments position not to overlap previous "records"
}
N'hésitez pas à optimiser et/ou signaler les bugs :)
Vous pouvez allouer un tableau de lignes, chaque ligne étant un tableau de même longueur. Vous pouvez également allouer un tableau unidimensionnel avec des éléments en lignes * et en colonnes et définir des méthodes pour mapper les coordonnées de lignes/colonnes avec les index d'éléments.
Quelle que soit l'implémentation que vous choisissez, si vous l'enveloppez dans un objet, vous pouvez définir les méthodes d'accès dans un prototype afin de rendre l'API facile à utiliser.
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 = '<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);J'ai trouvé que ce code fonctionne pour moi:
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];
}
}
}
Un exemple simplifié:
var blocks = [];
blocks[0] = [];
blocks[0][0] = 7;
Une ligne pour créer un tableau de dimensions m * n 2 rempli de 0.
new Array(m).fill(new Array(n).fill(0));
Vous pouvez également créer une fonction pour créer un tableau 2D comme ceci:
var myTable = [];
function createArray(myLength) {
myTable = new Array(myLength);
var cols, rows;
for (cols = 0; cols < myLength; cols++) {
myTable[cols] = new Array(myLength);
}
}
Vous pouvez l'appeler en utilisant ce qui suit, qui vous donnera un tableau 2D 10x10.
createArray(10);
Vous pouvez également créer un tableau 3D en utilisant cette méthode.
Fonction récursive pour créer un tableau multi-dimensionnel:
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;
}
Construisez un 4D-Array 2x3x4x2:
var array = makeArray([2, 3, 4, 2]);
J'ai modifié la réponse de Matthew Crumley pour la création d'une fonction de tableau multidimensionnel. J'ai ajouté les dimensions du tableau à transmettre en tant que variable de tableau et il y aura une autre variable - value, qui sera utilisée pour définir les valeurs des éléments des derniers tableaux du tableau multidimensionnel.
/*
* Function to create an n-dimensional array
*
* @param array dimensions
* @param any type value
*
* @return array array
*/
function createArray(dimensions, value) {
// Create new array
var 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 array
if (dimensions.length > 1) {
// Remove the first value from the array
var args = Array.prototype.slice.call(dimensions, 1);
// For each index in the created array create a new array with recursion
while(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]]
Il existe une autre solution, qui ne vous oblige pas à prédéfinir la taille du tableau 2D, et qui est très concise.
var table = {}
table[[1,2]] = 3 // Notice the double [[ and ]]
console.log(table[[1,2]]) // -> 3Cela fonctionne car [1,2] est transformé en une chaîne, utilisée comme clé string pour l'objet table.
nodejs + lodash version:
var _ = require("lodash");
var result = _.chunk(['a', 'b', 'c', 'd', 'e', 'f'], 2);
console.log(result);
console.log(result[2][0]);
Le résultat:
[ [ 'a', 'b' ], [ 'c', 'd' ], [ 'e', 'f' ] ]
e
Array.from({length: rows}).map(e => new Array(columns));
var _field = (function()
{
var array = [];
for(var y = 0; y != 3; y++) { array[y] = new Array(5); }
return array;
})();
// var item = _field[2][4];
Ceci est mentionné dans quelques commentaires, mais utiliser Array.fill () aidera à construire un tableau à deux dimensions:
function create2dArr(x,y) {
var arr = [];
for(var i = 0; i < y; i++) {
arr.Push(Array(x).fill(0));
}
return arr;
}
cela donnera un tableau de longueur x, y fois dans le tableau retourné.
Si tout ce que vous voulez, c'est une matrice 4x4, regardez DOMMatrix , il est facile à utiliser, je peux dire,
let m = new DOMMatrix();
// m.m11, m.m12, m.m13, m.m14, ..., m.m41, m.m42, m.m43, m.m44
Initialement introduit pour différentes raisons, il n’est pas disponible sur node.js et n’est limité qu’à 4x4.
Aussi, vous pouvez envisager d’utiliser un objet de vivification automatique à la place des tableaux pour JS, jetez un œil à ma réponse est ici
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]);
Il utilise le nouveau JS et n'agit pas correctement lorsque vous le parcourez, alors faites attention.
Regardez aussi this si vous avez besoin d’un générateur de tableaux multidimensionnel flexible.
Un dépôt génial ici .
api: masfufa.js
échantillon: masfufa.html
Deux exemples suffiront pour comprendre cette bibliothèque:
Exemple 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'});
puis :
MX.get[0][0] // -> 1 (first)
MX.get[2][2] // ->9 (last)
Exemple 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'});
puis :
MXB.get[0][0] // -> 1 (first)
MXB.get[1][3] // -> 2 (last)
MXB.get[1][2] // -> 6 (before last)
Que se passe-t-il si la taille du tableau est inconnue? Ou tableau doit être créé et rempli dynamiquement? La solution alternative qui a fonctionné pour moi est d'utiliser la classe avec une variable de tableau statique à 2d qui, en cas de non-existence d'index dans un tableau, l'initiera
function _a(x,y,val){
// return depending on parameters
switch(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 yet
if(typeof _a.a[x] == 'undefined')
_a.a[x] = [];
_a.a[x][y] = val;
}
// declare static empty variable
_a.a = [];
La syntaxe sera la suivante:
_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 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 01
alert(items[5][1]); // 54.4
Si vous recherchez un tableau 2D pour les graphiques Google, la meilleure façon de le faire est de:
var finalData = [];
[["key",value], ["2013-8-5", 13.5], ["2013-7-29",19.7]...]
faisant référence à Pas un tableau 2d valide google chart
Ceci est mon implémentation de Multi-Dimension Array.
Dans cette approche, je crée un tableau à une seule dimension
J'ai ajouté une fonction prototype multi à l'objet Array, qui peut être utilisé pour créer n'importe quel tableau de dimension.
J'ai également ajouté une fonction prototype index à Array object, qui peut être utilisée pour obtenir l'index dans Array linéaire à partir d'index multidimensionnels.
Créer un tableau
//Equivalent to arr[I][J][K]..[] in C
var arr = new Array().multi(I,J,K,..);
Accéder à la valeur d'un tableau à n'importe quel index
//Equivalent in C arr[i][j][k];
var vaue = arr[arr.index(i,j,k)];
EXTRAIT
/*
Storing array as single dimension
and access using Array.index(i,j,k,...)
*/
Array.prototype.multi = function(){
this.multi_size = arguments;
this.multi_len = 1
for(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 Array
arr2d[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 Array
arr3d[arr3d.index(1,1,1)] = 5;
console.log(arr3d[arr3d.index(1,1,1)]);
// A 4x3x3 4D Matrix
var arr4d = new Array().multi(4,3,3,3); // a 4D Array
arr4d[arr4d.index(4,0,0,1)] = 5;
console.log(arr4d[arr4d.index(4,0,0,1)]);