JavaScript-Arrays werden verwendet, um mehrere Werte in einer einzigen Variable zu speichern.
Anzeige Arrays
In diesem Tutorial werden wir ein Skript zum Anzeigen - Arrays innerhalb eines verwenden <p> Element mit id="demo" :
Beispiel
<p id="demo"></p>
<script>
var cars = ["Saab", "Volvo", "BMW"];
document.getElementById("demo").innerHTML = cars;
</script>
Die erste Zeile (im Skript) erstellt ein Array namens Autos.
Die zweite Zeile "findet" das Element mit id="demo" und "displays" die Anordnung in der "innerHTML" davon .;
Versuch es selber
Erstellen Sie ein Array und Werte zuweisen es:
Leerzeichen und Zeilenumbrüche sind nicht wichtig. Eine Erklärung kann mehrere Zeilen umfassen:
Niemals ein Komma nach dem letzten Element (wie "BMW" ,).
Der Effekt wird in allen Browsern inkonsistent.
Was ist ein Array?
Ein Array ist eine spezielle Variable, die mehr als einen Wert zu einer Zeit aufnehmen kann.
Wenn Sie eine Liste der Elemente (eine Liste der Autonamen, zum Beispiel) haben, die Speicherung der Autos in einzelne Variablen könnte wie folgt aussehen:
var car1 = "Saab";
var car2 = "Volvo";
var car3 = "BMW";
Was aber, wenn Sie eine Schleife wollen durch die Autos und eine spezifische finden? Und was ist, wenn Sie nicht mehr als 3 Autos gehabt, aber 300?
Die Lösung ist ein Array!
Ein Array kann viele Werte unter einem einzigen Namen halten, und Sie die Werte unter Bezugnahme auf eine Indexnummer zugreifen können.
Erstellen eines Arrays
ein Arrayliteral ist der einfachste Weg, um einen JavaScript-Array zu erstellen.
Syntax:
var array-name = [ item1 , item2 , ...];
Beispiel:
var cars = ["Saab", "Volvo", "BMW"];Mit dem JavaScript-Schlüsselwörter neu
Im folgenden Beispiel wird auch ein Array, und weist Werte hinzu:
Die beiden Beispiele oben genau das gleiche tun. Es besteht keine Notwendigkeit zu verwenden , new Array() .
Zur Vereinfachung der Lesbarkeit und die Ausführungsgeschwindigkeit, verwenden Sie die erste (die Arrayliteral Methode).
Greifen Sie auf die Elemente eines Arrays
Sie beziehen sich auf ein Array - Element von derIndexnummer verweist.
Diese Aussage greift auf den Wert des ersten Elements in Autos:
var
name = cars[0];
Diese Anweisung ändert das erste Element in Autos:
cars[0] = "Opel";
[0] ist das erste Element in einem Array. [1] die zweite ist. Array-Indizes beginnen mit 0.
Sie können verschiedene Objekte in einer Array
JavaScript-Variablen können Objekte sein. Arrays sind spezielle Arten von Objekten.
Aus diesem Grund können Sie Variablen verschiedener Typen im selben Array haben.
Sie können Objekte in einem Array haben. Sie können Funktionen in einem Array haben. Sie können Arrays in einem Array haben:
myArray[0] = Date.now;
myArray[1] = myFunction;
myArray[2] = myCars;
Arrays sind Objekte
Arrays sind eine spezielle Art von Objekten. Der typeof Operator in JavaScript gibt "object" für Arrays.
Aber JavaScript-Arrays lassen sich am besten als Arrays beschrieben.
Arrays verwenden numbers seine für den Zugriff auf "elements" . In diesem Beispiel person[0] kehrt John :
Objekte verwenden , um Namen seiner "Mitglieder" zuzugreifen. In diesem Beispiel gibt person.firstName John :
Array-Eigenschaften und Methoden
Die wahre Stärke von JavaScript-Arrays sind die integrierte Array-Eigenschaften und Methoden:
Beispiele
var x = cars.length;
// The length property returns the number of elements in cars
var y = cars.sort();
// The sort() method sort cars in alphabetical order
Array-Methoden werden im nächsten Kapitel behandelt.
Die Länge der Immobilie
Die length Eigenschaft eines Arrays gibt die Länge eines Arrays (die Anzahl der Array - Elemente).
Beispiel
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.length; // the length of fruits is 4
Versuch es selber " Die Länge Eigenschaft ist immer eine mehr als die höchste Array-Index.
Hinzufügen von Array-Elemente
Der einfachste Weg, ein neues Element in einem Array wird mit Hilfe der Push-Methode hinzuzufügen:
Beispiel
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Lemon"); // adds a new element (Lemon) to fruits Versuch es selber " Neues Element kann auch die zu einem Array hinzugefügt werden , indem length Eigenschaft:
Beispiel
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Lemon"; // adds a new element (Lemon) to fruits Versuch es selber " ACHTUNG!
Hinzufügen von Elementen mit hoher Indizes können nicht definiert schaffen "holes" in einem Array:
Beispiel
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[10] = "Lemon"; // adds a new element (Lemon) to fruits Versuch es selber " Looping Array-Elemente
Der beste Weg , durch eine Anordnung zur Schleife wird ein mit "for" Schleife:
Beispiel
var fruits, text, fLen, i;
fruits = ["Banana", "Orange", "Apple", "Mango"];
fLen = fruits.length;
text = "<ul>";
for (i = 0; i < fLen; i++) {
text += "<li>" + fruits[i] + "</li>";
}
Versuch es selber " Assoziative Arrays
Viele Programmiersprachen unterstützen Arrays mit dem Namen Indizes.
Arrays mit dem Namen Indizes sind assoziative Arrays (oder Hashes) genannt.
JavaScript nicht unterstützt Arrays mit dem Namen Indizes.
In JavaScript immer Arrays nummerierten Indizes verwenden.
Beispiel
var person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
var x = person.length;
// person.length will return 3
var y = person[0];
// person[0] will return "John" Versuch es selber " ACHTUNG !!
Wenn Sie einen benannten Index verwenden, wird JavaScript um das Array zu einem Standard-Objekt neu zu definieren.
Danach werden alle Array Methoden und Eigenschaften werden zu falschen Ergebnissen führen.
Beispiel:
var person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
var x = person.length; // person.length will
return 0
var y = person[0];
// person[0] will return undefined Versuch es selber " Der Unterschied zwischen Arrays und Objekte
In JavaScript - Arrays verwenden nummerierten Indizes.
In JavaScript verwenden , um Objekte namens Indizes.
Arrays sind eine spezielle Art von Objekten, mit nummerierten Indizes.
Wann Verwenden von Arrays. Wenn Objekte zu verwenden.
- JavaScript unterstützt keine assoziative Arrays.
- Sie sollten Objekte verwenden , wenn Sie die Elementnamen wollen Strings (Text) zu sein.
- Sie sollten Arrays verwenden , wenn Sie die Elementnamen Zahlen sein wollen.
Vermeiden new Array()
Es gibt keine Notwendigkeit , die JavaScript-interne Array - Konstruktor verwenden new Array() .
Verwenden Sie [] statt.
Diese beiden unterschiedlichen Aussagen sowohl Erstellen Sie ein neues leeres Array namens Punkte:
var points = new Array();
// Bad
var points = [];
// Good
Diese beiden unterschiedlichen Aussagen schaffen beide ein neues Array mit 6 Zahlen:
var points = new Array(40, 100, 1, 5, 25, 10) // Bad
var points = [40, 100, 1, 5, 25, 10];
// Good
Versuch es selber " Das new Schlüsselwort erschwert nur den Code. Es kann auch einige unerwartete Ergebnisse produzieren:
var points = new Array(40, 100); // Creates an array with two elements (40 and 100)Was ist, wenn ich entfernen eines der Elemente?
var points = new Array(40); // Creates an array with 40 undefined elements !!!!! Versuch es selber " Wie ein Array zu erkennen
Eine häufig gestellte Frage ist: Wie kann ich wissen, ob eine Variable ein Array ist?
Das Problem ist , dass der JavaScript - Operator typeof gibt "Objekt":
var fruits = ["Banana", "Orange", "Apple", "Mango"];
typeof fruits; // returns object Versuch es selber " Die typeof Operator kehrt das Objekt, weil ein JavaScript-Array ein Objekt ist.
Lösung 1:
Zur Lösung dieses Problems ECMAScript 5 definiert eine neue Methode Array.isArray() :
Array.isArray(fruits); // returns true Versuch es selber " Das Problem bei dieser Lösung ist , dass ECMAScript 5 nicht in älteren Browsern unterstützt.
Lösung 2:
Zur Lösung dieses Problems können Sie Ihre eigene erstellen können isArray() Funktion:
function isArray(x) {
return
x.constructor.toString().indexOf("Array") > -1;
} Versuch es selber " Die Funktion oben immer wahr, wenn das Argument ein Array ist.
Oder genauer gesagt: es gibt true zurück, wenn das Objekt Prototyp das Wort "Array" enthält.
Lösung 3:
Der instanceof - Operator gibt true , wenn ein Objekt von einem bestimmten Konstruktor erstellt wird:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits instanceof Array // returns true Versuch es selber " Testen Sie sich mit Übungen!
Übung 1 » Übung 2» Übung 3 » Übung 4» Übung 5 »