Wie kann ich ein zweidimensionales Array in JavaScript erstellen?


1136

Ich habe online gelesen und einige Orte sagen, dass es nicht möglich ist, einige sagen, dass es möglich ist und geben dann ein Beispiel und andere widerlegen das Beispiel usw.

  1. Wie deklariere ich ein zweidimensionales Array in JavaScript? (vorausgesetzt es ist möglich)

  2. Wie würde ich auf seine Mitglieder zugreifen? ( myArray[0][1]oder myArray[0,1]?)


21
Unter der Annahme einer etwas pedantischen Definition ist es technisch unmöglich, ein 2D-Array in Javascript zu erstellen. Sie können jedoch ein Array von Arrays erstellen, was gleichbedeutend ist.
IJ Kennedy

10
Zu Ihrer Information ... Wenn Sie ein Array mit mehr Arrays füllen var arr2D = new Array(5).fill(new Array(3));, zeigt jedes Element von Array (5) auf dasselbe Array (3). Verwenden Sie daher am besten eine for-Schleife, um Sub-Arrays dynamisch zu füllen.
Josh Stribling

51
a = Array(5).fill(0).map(x => Array(10).fill(0))
Longfei Wu

2
Mit anderen Worten, fillruft nicht new Array(3)jeden Index des Arrays auf, der gefüllt wird, da es sich nicht um einen Lambda-Ausdruck oder etwas anderes handelt, wie zum Beispiel den obigen Kommentar von Longfei Wu, der das Array zunächst mit Nullen füllt und dann die Map-Funktion mit einem Lambda verwendet Füllen Sie jedes Element mit einem neuen Array. Die Füllfunktion füllt das Array einfach mit genau dem, was Sie ihm sagen. Ist das sinnvoll? Weitere Informationen zur mapFunktion finden Sie unter: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
Josh Stribling

2
@kalehmann das ist in Ordnung: meta.stackoverflow.com/a/252017/2311074 If the new question is a better question or has better answers, then vote to close the old one as a duplicate of the new one.
Adam

Antworten:


1231

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


32
Es wäre schwierig, ein großes mehrdimensionales Array auf diese Weise zu initialisieren. Mit dieser Funktion kann jedoch eine leere mehrdimensionale Datei mit den als Parameter angegebenen Dimensionen erstellt werden.
Anderson Green

2
@AndersonGreen Es ist gut, dass Sie einen Link für diejenigen erwähnt haben, die an einer Multi-D-Array-Lösung interessiert sind, aber die Frage und die Antwort von Ballsacian1 beziehen sich auf "2D" -Array, nicht auf "Multi-D"
-Array

Sie sollten das Ganze durchgehen ... zB Alarm (Elemente [0] [1]); // 2 etc.
Dois

1
@SashikaXP, dies funktioniert nicht für andere erste Indizes als 0.
Michael Franzl

1
Die Frage ist, wie ein zweidimensionales Array deklariert wird. Welches ist, wonach ich gesucht und diese und folgende Antworten gefunden habe, die den Unterschied zwischen deklarieren und initialisieren nicht erkennen. Es gibt auch eine Erklärung mit bekannter Länge oder unbegrenzt, von der keine diskutiert wird.
Chris

444

Sie machen einfach jedes Element innerhalb des Arrays zu einem Array.

var x = new Array(10);

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

console.log(x);


6
Können sie Dinge wie Zeichenfolgen für ihre Schlüssel und Werte verwenden? myArray ['Buch'] ['item1']?
Diego

42
@Diego, ja, aber dafür sind Arrays nicht gedacht. Es ist besser, ein Objekt zu verwenden, wenn Ihre Schlüssel Zeichenfolgen sind.
Matthew Crumley

10
Ich mag dieses Beispiel besser als die akzeptierte Antwort, da dies für Arrays mit dynamischer Größe implementiert werden kann, z. B. new Array(size)wo sizeeine Variable ist.
Variadicism

1
funktioniert nicht - Fehler bei der Zuordnung. Wie hat diese Antwort 280 Likes bekommen, wenn sie nutzlos ist?
Gargo

1
Das funktioniert, danke. Sie können das Beispiel Gargo jsfiddle.net/matasoy/oetw73sj
matasoy

198

Ähnlich wie bei Activas Antwort gibt es hier eine Funktion zum Erstellen eines n-dimensionalen Arrays:

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

2
Kann dies ein 4-dimensionales Array erzeugen?
trusktr

4
@trusktr: Ja, Sie können so viele Dimensionen erstellen, wie Sie möchten (innerhalb Ihrer Speicherbeschränkungen). Geben Sie einfach die Länge der vier Dimensionen ein. Zum Beispiel var array = createArray(2, 3, 4, 5);.
Matthew Crumley

4
Beste Antwort ! Ich würde jedoch nicht empfehlen, es mit 0 oder 1 Parametern zu verwenden (nutzlos)
Apolo

2
@BritishDeveloper Ja. Dies ist ein 5D-Array mit jeder Länge um 5:[[[[[null,null],[null,null]],[[null,null],[null,null]]],[[[null,null],[null,null]],[[null,null],[null,null]]]],[[[[null,null],[null,null]],[[null,null],[null,null]]],[[[null,null],[null,null]],[[null,null],[null,null]]]]]
Haykam

2
@ Haykam Entschuldigung, um Ihre Zeit zu verschwenden - Ich war sarkastisch: /
BritishDeveloper

84

Javascript hat nur eindimensionale Arrays, aber Sie können Arrays von Arrays erstellen, wie andere betonten.

Die folgende Funktion kann verwendet werden, um ein 2D-Array mit festen Abmessungen zu erstellen:

function Create2DArray(rows) {
  var arr = [];

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

  return arr;
}

Die Anzahl der Spalten ist nicht wirklich wichtig, da die Größe eines Arrays vor der Verwendung nicht angegeben werden muss.

Dann können Sie einfach anrufen:

var arr = Create2DArray(100);

arr[50][2] = 5;
arr[70][5] = 7454;
// ...

Ich möchte ein 2-Dim-Array erstellen, das ein Kartenspiel darstellt. Welches wäre ein 2-Dim-Array, das den Kartenwert und dann in der Farbe enthält. Was wäre der einfachste Weg, das zu tun.
Doug Hauf

1
Funktion Create2DArray (Zeilen) {var arr = []; für (var i = 0; i <Zeilen; i ++) {arr [i] = []; } return arr; } function print (deck) {für (t = 1; t <= 4; t ++) {für (i = 1; i <= 13; i ++) {document.writeln (deck [t] [i]); }}} fucntion fillDeck (d) {für (t = 1; t <= 4; t ++) {myCardDeck [t] [1] = t; für (i = 1; i <= 13; i ++) {myCardDeck [t] [i] = i; }}} Funktion loadCardDeck () {var myCardDeck = Create2DArray (13); fillDeck (myCardDeck); print (myCardDeck); }
Doug Hauf

2
@Doug: Sie möchten tatsächlich ein eindimensionales Array von Objekten mit 2 Attributen. var deck = []; Deck [0] = {Gesicht: 1, Anzug: 'H'};
TeasingDart

@DougHauf das ist ein minimiertes 2D-Array ?? : P: D
Mahi

78

Der einfachste Weg:

var myArray = [[]];

29
Das ist ein 2-dimensionales Array
Maurizio In Dänemark

15
Ja, sei vorsichtig damit. Das Zuweisen von myArray [0] [was auch immer] ist in Ordnung, aber versuchen Sie, myArray [1] [was auch immer] einzustellen, und es wird beanstandet, dass myArray [1] undefiniert ist.
Philip

22
@Philip müssen Sie myArray[1]=[];vor dem Zuweisen myArray[1][0]=5;
einstellen

4
Beachten Sie , dass dies nicht "ein leeres 1x1-Array erstellt", wie @AndersonGreen schrieb. Es wird ein "1x0" -Array erstellt (dh 1 Zeile mit einem Array mit 0 Spalten). myArray.length == 1und myArray[0].length == 0. Was dann das falsche Ergebnis ergibt, wenn Sie dann ein "wirklich leeres" "0x0" -Array hinein kopieren.
JonBrave

3
@ 182764125216 das war für mich das Wissen des Tages . Danke :)
th3pirat3

76

So erstellen Sie ein leeres zweidimensionales Array (einzeilig)

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

2 und 4 sind die erste bzw. zweite Dimension.

Wir verwenden Array.from, die einen Array-ähnlichen Parameter und eine optionale Zuordnung für jedes der Elemente verwenden können.

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

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

Der gleiche Trick kann verwendet werden, um ein JavaScript-Array mit 1 ... N zu erstellen


Alternativ (aber ineffizienter 12% mit n = 10,000)

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

Der Leistungsabfall ist darauf zurückzuführen, dass die ersten Dimensionswerte für die Ausführung initialisiert werden müssen .map. Denken ArraySie daran, dass die Positionen erst zugewiesen werden, wenn Sie sie durch .filloder direkt zuweisen .

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


Nachverfolgen

Hier ist eine Methode, die korrekt erscheint, aber Probleme aufweist .

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

Während es das scheinbar gewünschte zweidimensionale Array ( [ [ <4 empty items> ], [ <4 empty items> ] ]) zurückgibt , gibt es einen Haken: Arrays der ersten Dimension wurden als Referenz kopiert. Das bedeutet, dass a arr[0][0] = 'foo'tatsächlich zwei Zeilen anstelle von einer ändern würde.

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


Ich schlage vor:Array.from({length:5}, () => [])
vsync

Subjektiv hier, aber diese Antwort (die erste und die zweite darin) scheint die beste Balance zwischen prägnant, schnell und modern zu sein.
Brady Dowling

@zurfyx eine Idee, oder weiß jemand, warum Websturm sich darüber beschwert? Es scheint, dass array.from weiterhin Werte als undefiniert belässt und ich dann nicht mit dem erstellten Array arbeiten kann, obwohl das Snippet hier auf stackoverflow
einwandfrei

46

Einige sagen, dass dies nicht möglich ist, weil ein zweidimensionales Array eigentlich nur ein Array von Arrays ist. Die anderen Kommentare hier bieten vollkommen gültige Methoden zum Erstellen zweidimensionaler Arrays in JavaScript. Der reinste Gesichtspunkt wäre jedoch, dass Sie ein eindimensionales Array von Objekten haben. Jedes dieser Objekte wäre ein eindimensionales Array, das aus zwei Elementen besteht.

Das ist also die Ursache für die widersprüchlichen Sichtweisen.


41
Nein, ist es nicht. In einigen Sprachen können Sie mehrdimensionale Arrays wie haben string[3,5] = "foo";. Für einige Szenarien ist dies ein besserer Ansatz, da die Y-Achse eigentlich kein Kind der X-Achse ist.
Rafael Soares

3
Sobald der zugrunde liegende Maschinencode erreicht ist, sind alle Tensoren der Dimension> 1 Arrays von Arrays, unabhängig von der Sprache, über die wir sprechen. Aus Gründen der Cache-Optimierung lohnt es sich, dies zu berücksichtigen. Mit jeder anständigen Sprache, die sich ernsthaft mit numerischen Berechnungen befasst, können Sie Ihre mehrdimensionale Struktur im Speicher so ausrichten, dass Ihre am häufigsten verwendete Dimension zusammenhängend gespeichert wird. Pythons Numpy, Fortran und C kommen mir in den Sinn. In der Tat gibt es Fälle, in denen es aus diesem Grund sinnvoll ist, die Dimensionalität auf mehrere Strukturen zu reduzieren.
Thomas Browne

Computer haben keine Vorstellung von Dimensionen. Es gibt nur eine Dimension, die Speicheradresse. Alles andere ist eine Notationsdekoration zum Nutzen des Programmierers.
TeasingDart

3
@ ThomasBrowne Nicht genau. "Arrays von Arrays" erfordern etwas Speicher für die Größe der inneren Arrays (sie können unterschiedlich sein) und eine andere Zeiger-Dereferenzierung, um den Ort zu finden, an dem ein inneres Array gespeichert ist. In jeder "anständigen" Sprache unterscheiden sich multidimentionale Arrays von gezackten Arrays, weil sie per se unterschiedliche Datenstrukturen sind. (Und der verwirrende Teil ist, dass C-Arrays multidimentional sind, obwohl sie mit [a] [b]
-Syntax

33

Nur wenige Leute zeigen die Verwendung von Push:
Um etwas Neues zu bringen, zeige ich Ihnen, wie Sie die Matrix mit einem Wert initialisieren, zum Beispiel: 0 oder einer leeren Zeichenfolge "".
Wenn Sie ein Array mit 10 Elementen haben, ist der letzte Index in Javascript 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;
}

Anwendungsbeispiele:

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

Ich entferne den letzten for(der den Standardwert festlegt) aus Ihrer Prozedur und schreibe m=matrix(3,4); m[1][2]=2; console.log(JSON.stringify(m));- und wir erhalten eine sehr strenge Matrix (zu viel verschachtelt) - Sie reparieren ihn im letzten for-defaultValue-Schritt, aber ich denke, Sie können die Prozedur neu schreiben, um zuvor weniger verschachtelte Arras zu verwenden Festlegen von Standardwerten.
Kamil Kiełczewski

27

Zweiliner:

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

Es wird ein Array a der Länge 10 generiert, das mit Arrays gefüllt ist. (Push fügt einem Array ein Element hinzu und gibt die neue Länge zurück.)


13
Einzeiler : for (var a=[]; a.push([])<10;);?
Bergi

@Bergi Wird die Variable a in der nächsten Zeile noch definiert?
StinkyCat

1
@StinkyCat: Ja, so varfunktioniert es. Es ist immer funktionsbezogen.
Bergi

Ich weiß, daher ist Ihr
Einzeiler

1
Domenukk und @Bergi, Sie haben beide Recht. Ich habe es ausprobiert und kann auf ein nach dem für zugreifen. Ich entschuldige mich! und danke, möge dies eine Lektion für mich sein;)
StinkyCat

24

Die vernünftigste Antwort scheint zu sein

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


Beachten Sie, dass wir nicht direkt mit den Zeilen füllen können, da die Füllung einen flachen Kopierkonstruktor verwendet. Daher würden alle Zeilen denselben Speicher verwenden. Hier ist ein Beispiel, das zeigt, wie jede Zeile gemeinsam genutzt wird (aus anderen Antworten entnommen):

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

Dies sollte ganz oben sein. Ich habe etwas Ähnliches gemacht, Array.apply(null, Array(nrows))aber das ist viel eleganter.
Dimiguel

Diesbezüglich mein letzter Kommentar ... Internet Explorer und Opera haben keine Unterstützung für fill. Dies funktioniert in den meisten Browsern nicht.
Dimiguel

@ Dimgl Fill kann in diesem Fall mit einer konstanten Karte emuliert werden: Array(nrows).map(() => 0)oderArray(nrows).map(function(){ return 0; });
Conor O'Brien

20

Der einfachste Weg:

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'

18

Das habe ich erreicht:

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

Das buchstabierte mich bineeshkumar


2
Beachten Sie, dass Sie nur auf den 0-Index des übergeordneten Arrays zugreifen können. Dies ist nicht so nützlich wie etwas, mit dem Sie beispielsweise appVar [5] [9] = 10 festlegen können. ... Sie würden damit die Eigenschaft "9" von undefined nicht setzen können.
RaisinBranCrunch

Aber appVar[1][4] = "bineesh";ist falsch, wie man es löst?
Gank

16

Zweidimensionale Arrays werden genauso erstellt wie eindimensionale Arrays. Und Sie greifen gerne darauf zu array[0][1].

var arr = [1, 2, [3, 4], 5];

alert (arr[2][1]); //alerts "4"

14

Ich bin mir nicht sicher, ob jemand darauf geantwortet hat, aber ich fand, dass dies für mich ziemlich gut funktioniert hat -

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

z.B:

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

Zum Beispiel für ein zweidimensionales Array.


Wie kann ich das dynamisch machen? Ich möchte die inneren Arrays mit unterschiedlichen Größen.
Alap

3
Sie brauchen keine zusätzlichen Kommas var array = [[],[]]ist ausreichend.
Kaya Toast

13

Um ein 2D-Array in JavaScript zu erstellen, können wir zuerst ein Array erstellen und dann Arrays als Elemente hinzufügen. Diese Methode gibt ein 2D-Array mit der angegebenen Anzahl von Zeilen und Spalten zurück.

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

Verwenden Sie diese Methode wie folgt, um ein Array zu erstellen.

var array = Create2DArray(10,20);

2
Bitte fügen Sie Ihrer Antwort einige erklärende Informationen hinzu, die zeigen, wie es funktioniert und warum es das Problem löst. Dies wird anderen helfen, die diese Seite in Zukunft finden
Unser Mann in Bananen

Wann benötigen Sie ein Array, das mit einer bestimmten Anzahl von Spalten in Javascript vorinitialisiert ist? Sie können auch auf das n-te Element eines [] -Arrays zugreifen.
Domenukk

Ich habe festgestellt, dass die Funktion mit Großbuchstaben C beginnt, was (nach bestimmten Konventionen) darauf hindeutet, dass es sich um einen Funktionskonstruktor handelt und Sie ihn mit dem neuen Schlüsselwort verwenden würden. Ein sehr kleines und etwas eigensinniges Wort, aber ich würde immer noch ein nicht großgeschriebenes Wort vorschlagen.
Hachi

12

So erstellen Sie ein nicht spärliches "2D" -Array (x, y) mit allen adressierbaren Indizes und auf null gesetzten Werten:

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

Bonus "3D" Array (x, y, z)

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

Variationen und Korrekturen hierzu wurden in Kommentaren und an verschiedenen Stellen als Antwort auf diese Frage erwähnt, jedoch nicht als tatsächliche Antwort, daher füge ich sie hier hinzu.

Es sollte beachtet werden, dass dies (ähnlich wie die meisten anderen Antworten) eine O (x * y) -Zeitkomplexität aufweist, so dass es wahrscheinlich nicht für sehr große Arrays geeignet ist.


1
Seien Sie vorsichtig, da Sie fillden gleichen Wert einstellen. Wenn Sie nullzu "Objekt" wechseln , wird es in jeder Spalte dasselbe Objekt sein
Stanislav Mayorov

@ StanislavMayorov Wenn Sie den Wert jeder Zelle festlegen möchten, verwenden Sie einfach den gleichen Trick:let 2Darray = new Array(x).fill(null).map(item =>(new Array(y).fill(null).map(cell =>(yourValueHere))))
Haykam

10

Verwenden Sie Array-Verständnisse

In JavaScript 1.7 und höher können Sie Array-Verständnis verwenden , um zweidimensionale Arrays zu erstellen. Sie können die Einträge auch filtern und / oder bearbeiten, während Sie das Array füllen, und müssen keine Schleifen verwenden.

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"]
         ]
*/

Sie können jedes n x mgewünschte Array erstellen und durch Aufrufen mit einem Standardwert füllen

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],
         ]
*/

Weitere Beispiele und Dokumentationen finden Sie hier .

Bitte beachten Sie, dass dies noch keine Standardfunktion ist .


Ein kurzer Google-Check hier ... yup ... die forAussage ist immer noch eine Schleife ...
Pimp Trizkit

1
Es wird von keinem Browser unterstützt - HIER ?
Kamil Kiełczewski

10

Für Einzeiler Liebhaber Array.from ()

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

Ein anderer (aus dem Kommentar von dmitry_romanov) verwendet Array (). Fill ()

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

Verwenden des ES6 + Spread- Operators ("inspiriert" von der InspiredJW- Antwort :))

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

2
wir können 0in der ersten fill()Funktion entfernen :const arr2d = Array(8).fill().map(() => Array(8).fill("0"));
Jinsong Li

8

Mein Ansatz ist der Antwort von @Bineesh sehr ähnlich, jedoch mit einem allgemeineren Ansatz.

Sie können das Double-Array wie folgt deklarieren:

var myDoubleArray = [[]];

Und das Speichern und Zugreifen auf die Inhalte auf folgende Weise:

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'],) 

Dadurch wird die erwartete Ausgabe gedruckt

[ 9, 8 ] 9 123

7

Ich fand unten ist der einfachste Weg:

var array1 = [[]];   
array1[0][100] = 5; 

alert(array1[0][100]);
alert(array1.length);
alert(array1[0].length);

array1[1][100] = 666;WürfeUncaught TypeError: Cannot set property '100' of undefined
Kamil Kiełczewski

@ KamilKiełczewski Sie haben Recht, sieht so aus, als würde dies nur für das erste Array von Array initiiert, für das zweite, bevor Sie dies tun array1[1][100] = 666;, müssen Sie dies tun array1[1] = [];.
GMsoF

7

Performance

Heute 2020.02.05 führe ich Tests auf MacOs HighSierra 10.13.6 unter Chrome v79.0, Safari v13.0.4 und Firefox v72.0 für ausgewählte Lösungen durch.

Schlussfolgerungen für nicht initialisiertes 2d-Array

  • esoterische Lösung {}/arr[[i,j]] (N) ist für große und kleine Arrays am schnellsten und scheint für große, spärliche Arrays eine gute Wahl zu sein
  • Lösungen, die auf for-[]/while(A, G) basieren , sind schnell und eine gute Wahl für kleine Arrays.
  • Lösungen for-[](B, C) sind schnell und eine gute Wahl für große Arrays
  • Lösungen, die auf Array..map/from/fill(I, J, K, L, M) basieren, sind für kleine Arrays ziemlich langsam und für große Arrays ziemlich schnell
  • überraschenderweise ist for-Array(n)(B, C) auf Safari viel langsamer als for-[](A)
  • Überraschenderweise ist for-[](A) für große Arrays in allen Browsern langsam
  • Lösungen K ist langsam für kleine Arrays für alle Browser
  • Die Lösungen A, E, G sind für große Arrays für alle Browser langsam
  • Lösung M ist für alle Arrays in allen Browsern am langsamsten

Geben Sie hier die Bildbeschreibung ein

Schlussfolgerungen für das initialisierte 2d-Array

  • Lösungen basierend auf for/while (A, B, C, D, E, G) basieren, sind für kleine Arrays in allen Browsern am schnellsten / ziemlich schnell
  • Lösungen, die auf for(A, B, C, E) basieren, sind für große Arrays in allen Browsern am schnellsten / ziemlich schnell
  • Lösungen, die auf Array..map/from/fill(I, J, K, L, M) basieren, sind für kleine Arrays in allen Browsern mittelschnell oder langsam
  • Die Lösungen F, G, H, I, J, K, L für große Arrays sind auf Chrom und Safari mittel oder schnell, auf Firefox jedoch am langsamsten.
  • Die esoterische Lösung {}/arr[[i,j]](N) ist für kleine und große Arrays in allen Browsern am langsamsten

Geben Sie hier die Bildbeschreibung ein

Einzelheiten

Testen Sie auf Lösungen, die das Ausgabearray nicht füllen (initialisieren)

Wir testen die Geschwindigkeit von Lösungen für

  • kleine Arrays (12 Elemente) - Sie können HIER Tests auf Ihrem Computer durchführen
  • Große Arrays (1 Million Elemente) Arrays - Sie können HIER Tests auf Ihrem Computer durchführen

Testen Sie auf Lösungen, die das Ausgabearray füllen (initialisieren)

Wir testen die Geschwindigkeit von Lösungen für

  • kleine Arrays (12 Elemente) - Sie können HIER Tests auf Ihrem Computer durchführen
  • Große Arrays (1 Million Elemente) Arrays - Sie können HIER Tests auf Ihrem Computer durchführen

Geben Sie hier die Bildbeschreibung ein


6

Javascript unterstützt keine zweidimensionalen Arrays. Stattdessen speichern wir ein Array in einem anderen Array und rufen die Daten von diesem Array ab, je nachdem, auf welche Position des Arrays Sie zugreifen möchten. Denken Sie daran , Array Numerierung beginnt bei Null .

Codebeispiel:

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

6

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


6

ES6 +, ES2015 + können dies noch einfacher tun


Erstellen eines 3 x 2-Arrays, das mit true gefüllt ist

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

Ich muss gestehen. Ich habe Ihre Antwort "übernommen" und meiner Einzeilersammlung hinzugefügt .
my-

5

Ich musste eine flexible Array-Funktion erstellen, um "Datensätze" nach Bedarf hinzuzufügen und sie aktualisieren und alle erforderlichen Berechnungen durchführen zu können, bevor ich sie zur weiteren Verarbeitung an eine Datenbank schickte. Hier ist der Code, hoffe es hilft :).

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"
}

Fühlen Sie sich frei zu optimieren und / oder auf Fehler hinzuweisen :)


Wie wäre es einfach aLine.push([clmn1, clmn2, clmn3]);?
Pimp Trizkit

5

Hier ist eine schnelle Möglichkeit, ein zweidimensionales Array zu erstellen.

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

Sie können diese Funktion auch problemlos in eine ES5-Funktion umwandeln.

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

Warum dies funktioniert: Der new Array(n)Konstruktor erstellt ein Objekt mit einem Prototyp von Array.prototypeund weist dann das Objekt zu length, was zu einem nicht ausgefüllten Array führt. Aufgrund des Mangels an tatsächlichen Mitgliedern können wir die Array.prototype.mapFunktion nicht darauf ausführen .

Wenn Sie dem Konstruktor jedoch mehr als ein Argument bereitstellen, z. B. wenn Sie dies tun Array(1, 2, 3, 4), verwendet der Konstruktor das argumentsObjekt, um ein ArrayObjekt korrekt zu instanziieren und zu füllen .

Aus diesem Grund können wir verwenden Array.apply(null, Array(x)), da die applyFunktion die Argumente im Konstruktor verteilt. Zur Verdeutlichung ist das Tun Array.apply(null, Array(3))gleichbedeutend mit dem Tun Array(null, null, null).

Nachdem wir ein tatsächlich bestücktes Array erstellt haben, müssen wir nur noch mapdie zweite Ebene ( y) aufrufen und erstellen .


5

Erstellen Sie unter einer eine 5x5-Matrix und füllen Sie sie mit null

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

console.log(md);


3
Diese Antwort ist falsch. Es wird ein Array mit demselben Array erstellt, das seine Slots ausfüllt. md[1][0] = 3 und alle anderen Elemente werden ebenfalls aktualisiert
Qiang

5

Zeilen- und Spaltengrößen eines Arrays, die nur zur Laufzeit bekannt sind, und die folgende Methode können zum Erstellen eines dynamischen 2D-Arrays verwendet werden .

var num = '123456';
var row = 3; // Known at run time
var col = 2; // Known at run time
var 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

4

Es gibt eine andere Lösung, die Sie nicht zwingt, die Größe des 2D-Arrays vorab zu definieren, und die sehr präzise ist.

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

Dies funktioniert, weil [1,2]es in eine Zeichenfolge umgewandelt wird, die als Zeichenfolgenschlüssel für das tableObjekt verwendet wird.


Diese Antwort allein lässt mich nicht mit dem Müll herumspielen, der "mehrdimensionale" Arrays in JavaScript sind, obwohl ich eine sehr elegante Lösung habe. Dies zeigt auch, dass alle anderen überhaupt keine mehrdimensionalen Arrays erstellen ein "Array" in JavaScript; Diese Antwort "simuliert" ein pseudo-unendlich großes Array mit unendlichen Dimensionen beliebiger Größen und Inhalte vollständig. Alle anderen rekursions- und schleifenbasierten Antworten haben eine viel niedrigere Obergrenze für die Größe der Array-Struktur, die sie erstellen können. Und die Erstellung Geschwindigkeit wird ein Hauptproblem für diese größeren Strukturen sein.
Pimp Trizkit

Verwenden Sie stattdessen diese Zeile, um das var table = new Proxy({}, {get:(t,n)=>n in t ? t[n] : 42});
Vorfüllen

Schöne, kreative Art, Array2D nach Objekt zu emulieren :)
Kamil Kiełczewski

4

Führen Sie dies einfach aus, um ein 4x6-Array zu erstellen

const x = [...Array(6)].map(elem => new Array(4))
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.