3 Dinge, die Sie nicht über JavaScript-Arrays wissen

Arrays sind ein weit verbreitetes Merkmal von Programmiersprachen; Sie sind spezielle Variablen, mit denen mehrere Werte gleichzeitig gespeichert werden können. Wenn es jedoch um JavaScript geht, so einfach wie es zu lernen ist, gibt es immer mehr zu entdecken.

In diesem Beitrag werden wir uns drei weniger bekannte und dennoch wichtige Funktionen von JavaScript-Arrays ansehen, die Sie vielleicht noch nicht kennen.

1. Fügen Sie benutzerdefinierte Eigenschaften zu Arrays hinzu

Wenn Sie das Internet auf der Suche nach einer gründlichen Definition von JavaScript-Arrays durchsuchen würden, werden Sie feststellen, dass fast jede Quelle ohne Fehler das Array als das anzeigt, was es wirklich ist, ein Objekt .

In der Tat wird fast alles, was wir mit JavaScript zu tun haben , ein Objekt sein . Es gibt zwei Arten von Datentypen in JavaScript, Primitiven und Objekten, aber Primitive sind immer in Objekten eingeschlossen .

Array, Function, Date usw. sind vordefinierte JavaScript-Objekte, die über integrierte Methoden, Eigenschaften und eine eigene standardisierte Syntax verfügen.

JavaScript-Arrays können drei verschiedene Arten von Eigenschaften haben :

1. Indizes eines Arrays sind ebenfalls Eigenschaften
2. Eingebaute Eigenschaften
3. Benutzerdefinierte Eigenschaften, die Sie selbst hinzufügen können

Die ersten beiden sind bekannter, Sie können sie jeden Tag verwenden, aber lassen Sie uns sie schnell sehen, bevor Sie darüber sprechen, wie Sie einem Array eine eigene benutzerdefinierte Eigenschaft hinzufügen können.

Indizes als Eigenschaften

JavaScript-Arrays verwenden die Syntax der eckigen Klammer, z. B. var ary = ["orange", "apple", "lychee"]; .

Indizes von Array-Elementen sind grundsätzlich Eigenschaften, bei denen die Eigenschaftsnamen immer nicht negative ganze Zahlen sind .

Das Index-Element-Paar eines Arrays ähnelt dem Schlüssel-Wert-Paar eines Objekts.

Indizes sind ein einzigartiges Merkmal des Array-Objekts und können im Gegensatz zu anderen integrierten Eigenschaften nur mit der eckigen Syntax festgelegt werden, z. B. ary[3] = "peach"; .

Eingebaute Eigenschaften

Arrays verfügen auch über integrierte Eigenschaften wie array.length . Die length Eigenschaft trägt einen ganzzahligen Wert, der die Länge eines Arrays angibt .

Im Allgemeinen können integrierte Eigenschaften häufig in vordefinierten JavaScript-Objekten wie Arrays gefunden werden. Zusammen mit den integrierten Methoden helfen sie dabei, generische Objekte so anzupassen, dass die Objekte für unterschiedliche Anforderungen geeignet sind .

Auf integrierte Eigenschaften kann entweder mit der object.key oder object["key"] zugegriffen werden. Sie können also auch ary["length"] schreiben, um auf die Länge eines Arrays zuzugreifen.

Erstellen Sie benutzerdefinierte Eigenschaften für das Array-Objekt

Lassen Sie uns nun über das Hinzufügen eigener Eigenschaften zu Arrays sprechen. Arrays sind vordefinierte Objekte, die unterschiedliche Arten von Werten bei unterschiedlichen Indizes speichern.

Normalerweise müssen Sie einem Array keine benutzerdefinierten Eigenschaften hinzufügen. Dies ist einer der Gründe, warum Anfänger nicht über dieses Feature unterrichtet werden. Wenn Sie ein Array wie ein normales Objekt behandeln möchten, indem Sie ihm Schlüssel / Wert-Paare hinzufügen, können Sie auch ein normales Objekt für Ihren Zweck verwenden . Dies bedeutet jedoch nicht, dass es keine speziellen Fälle gibt, in denen Sie die Tatsache, dass ein Array ein Objekt ist, nutzen können, indem Sie ihm eine oder mehrere benutzerdefinierte Eigenschaften hinzufügen.

Beispielsweise können Sie einem Array eine benutzerdefinierte Eigenschaft hinzufügen, die die "Art" oder die "Klasse" ihrer Elemente angibt, wie Sie es im folgenden Beispiel sehen können.

 var ary = ["Orange", "Apfel", "Litschi"]; ary.itemClass = "Früchte"; console.log (ary + "ist" + ary.itemClass); // "Orange, Apfel, Litschi sind Früchte" 

Beachten Sie, dass die benutzerdefinierte Eigenschaft, die Sie einem Array hinzufügen, aufzählbar ist. Dies bedeutet, dass sie von Schleifen wie der Anweisung for…in aufgerufen wird.

2. Wiederholen Sie die Array-Elemente

Sie sagen wahrscheinlich "Ich weiß das schon", was höchstwahrscheinlich der Fall ist, Sie wissen bereits, wie man Array-Elemente durchläuft. Aber es ist auch wahr, dass das Sprichwort "Schleifen durch Array-Elemente" ein bisschen abstrakt ist, denn was wir tatsächlich durchlaufen, sind die Indizes des Arrays .

Da Array-Indizes nur aus nicht-negativen ganzen Zahlen bestehen, iterieren wir einen ganzzahligen Wert, der normalerweise bei Null beginnt und bei der vollen Länge des Arrays endet. Verwenden Sie dann diesen iterierten Wert, um auf das Array-Element bei einem bestimmten Index zuzugreifen.

Seit ECMAScript6 gibt es jedoch eine Möglichkeit, Array-Werte direkt zu durchlaufen, ohne sich um Indizes kümmern zu müssen. Dies kann mit der for…of Schleife geschehen.

In einem Array durchläuft die for...of Schleife die Array-Elemente in der Reihenfolge der Indizes, dh sie sorgt dafür, dass über die Indizes iteriert und ein vorhandener Array-Wert auf einen bestimmten Index gesetzt wird. Diese Schleife ist ideal, wenn Sie nur alle Array-Elemente durchlaufen und mit ihnen arbeiten möchten.

 var ary = ["Orange", "Apfel", "Litschi"]; für (let item of ary) {console.log (Element); } // "Orange", "Apfel", "Litschi" 

Zum Vergleich, mit der regulären for Schleife, erhalten wir die Indizes anstelle der Werte als Ausgabe.

 var ary = ["Orange", "Apfel", "Litschi"]; für (var item = 0; item <ary.length; item ++) {console.log (item); } // 0, 1, 2 

3. Die Anzahl der Elemente ist nicht ihre Länge

Wenn wir über die Länge eines Arrays sprechen, denken wir normalerweise, dass es entweder die Anzahl der Werte ist, die ein Array enthält, oder die Länge, die wir dem Array manuell gegeben haben. In Wirklichkeit hängt die Länge eines Arrays jedoch von dem größten existierenden Index ab .

Länge ist eine sehr flexible Eigenschaft . Ob Sie bereits die Länge eines Arrays vorher festgelegt haben oder nicht, wenn Sie weiterhin Werte zum Array hinzufügen, nimmt seine Länge entsprechend zu .

 var ary = []; ary.length = 3; console.log (ary.length); // 3 ary [5] = "abcd"; console.log (ary.length); // 6 

Im obigen Beispiel können Sie sehen, dass ich dem Array nur einen Wert bei Index 5 und die Länge 6 gegeben habe. Wenn Sie nun meinen, dass durch Hinzufügen eines Werts bei Index 5 das Array automatisch die Indizes 0 bis 4 erstellt dann ist deine Annahme falsch . Es gibt wirklich keine existierenden Indizes von 0 bis 4 in diesem Array. Sie können dies mit dem Operator in überprüfen.

 var ary = []; ary.length = 3; console.log (ary.length); // 3 ary [5] = "abcd"; console.log (ary.length); // 6 console.log (0 in ary); // falsch 

Das Array ary ist das, was wir ein "Sparse" -Array nennen, ein Array, bei dem die Indizes nicht kontinuierlich erzeugt werden und Lücken haben . Das Gegenteil von einem "spärlichen" Array ist das "dichte" Array, in dem Indizes kontinuierlich in dem Array existieren und die Anzahl der Elemente die gleiche ist wie die length .

Die length -Eigenschaft kann auch ein Array abschneiden und sicherstellen, dass der höchste im Array vorhandene Index immer kleiner ist als er selbst, da die length standardmäßig numerisch immer größer als der höchste Index ist.

Im folgenden Beispiel können Sie sehen, wie wir das Element bei Index 5 verlieren, indem Sie die length des ary Arrays verringern.

 var ary = []; ary.length = 3; console.log (ary.length); // 3 ary [5] = "abcd"; console.log (ary.length); // 6 ary.length = 2; console.log (ary.length); // 2 console.log (ary [5]); // nicht definiert 

Weiterführende Literatur

• 10 JavaScript-Begriffe, die Sie jetzt kennen sollten
• 4 nicht so häufige, aber hilfreiche JavaScript-Anweisungen, die Sie kennen sollten
• Code-Optimierung mit JS Tipp - ein Tool zum Linting von Javascript

Wie man "Facebook Likes" mit Node.js anzeigt / aktualisiert

Wenn Sie die Beispielcodes aus dem vorherigen Beitrag ausgearbeitet haben, haben Sie möglicherweise das Gefühl, dass der Nutzen von Node.js tatsächlich vorhanden ist. In der heutigen Post werfen wir ein praktisches Skript auf, das den Einsatz von Node.js in der ereignisbasierten Programmierung deutlich demonstriert.Wi

(Tech- und Design-Tipps)

20 Tech-Knockoffs, die dich sprachlos machen

Denken Sie an all die beliebten Hardware-Marken in der Technologie jetzt. Die Äpfel und Sonys, die die Ehre haben, eine Luxusmarke zu sein. Jeder will einen, und jeder, der irgendjemand ist, würde sie kaufen und ihren Mitschülern zur Schau stellen. Leider kann sich das nicht jeder leisten, und genau hier helfen uns die Plagiate.Di

(Tech- und Design-Tipps)