JavaScript: Arrays
► JavaScript-Referenz: length isArray() fill() copyWithin()
Arrays sind Feldvariablen, die beliebige Elemente enthalten können, die über ihren Index (die „laufende Nummer“ beginnend mit 0) angesprochen werden können.
Die Liste der Elemente eines Arrays wird in eckigen Klammern [] notiert.
Ein leeres Array kann mit new Array(n) erzeugt werden, wobei n die Anzahl der Elemente angibt.
Die Anzahl der enthaltenen Elemente (in der obersten Ebene) kann mit der Eigenschaft length bestimmt werden.
Mit Array.isArray(a) kann ermittelt werden, ob a ein Array ist.
MIt der Methode fill(f, x, y) kann ein Array von einschließlich Index x bis ausschließlich Index y mit f gefüllt werden. Wird Argument y nicht angegeben, wird bis zum Ende des Arrays gefüllt. Wird Argument x ebenfalls nicht angegeben, wird das gesamte Array gefüllt.
Mit der Methode copyWithin(z, x, y) werden die Elemente des Arrays ab einschließlich Index z mit den Elementen von einschließlich Index x bis ausschließlich Index y überschrieben. Wird y nicht angegeben, werden die Elemente bis zum Ende des Array nach z kopiert. Wird x ebenfalls nicht angegeben, Wird das gesamte Array nach z kopiert.
Mit einer sogenannten destrukturierenden Zuweisung ist es möglich, einer Reihe von Variablen die Elemente eines Arrays zuzuweisen.
a = ["Paula", "Olaf", "Nina"];
b = ["Schmidt", "Anneliese", "Gartenstr.", "25", "12345", "Hintertupfingen", 42, a];
Eltern = new Array(10);
console.log(Eltern); // (10) [empty × 10]
Eltern.fill(0);
console.log(Eltern); // (10) [0, 0, 0, 0, 0, 0, 0, 0, 0, 0]
Eltern.fill("leer", 5);
console.log(Eltern); // (10) [0, 0, 0, 0, 0, "leer", "leer", "leer", "leer", "leer"]
Eltern.fill(null, 6, 8);
console.log(Eltern); // (10) [0, 0, 0, 0, 0, "leer", null, null, "leer", "leer"]
Eltern.copyWithin(1, 7, 9);
console.log(Eltern); // (10) [0, null, "leer", 0, 0, "leer", null, null, "leer", "leer"]
Eltern.copyWithin(8, 3);
console.log(Eltern); // (10) [0, null, "leer", 0, 0, "leer", null, null, 0, 0]
Eltern.copyWithin(7);
console.log(Eltern); // (10) [0, null, "leer", 0, 0, "leer", null, 0, null, "leer"]
console.log(b.length); // 8
console.log(Eltern.length); // 10
Eltern[0] = b;
console.log(Eltern[0][1]); // Anneliese
console.log(Eltern[0][7].length); // 3
console.log(Eltern[0][7][2]); // Nina
console.log(Array.isArray(Eltern[0][6])); // false
console.log(Array.isArray(Eltern[0][7])); // true
// Destrukturierende Zuweisung:
[a, b, c] = ["Paula", "Olaf", "Nina"];
console.log(a, b, c); // Paula Olaf Nina
► JavaScript-Referenz: pop() push() shift() unshift() splice() reverse() sort()
Die Methode pop() entfernt das letzte Element eines Arrays.
Die Methode push() fügt dem Array die als Argumente übergebenen Elemente am Ende an.
Die Methode shift() entfernt das erste Element eines Arrays.
Die Methode unshift() fügt dem Array die als Argumente übergebenen Elemente am Anfang an.
MIt der Methode splice(x, n, i1, i2, i3,...) werden n Elemente ab einschließlich Index x gelöscht und an dieser Stelle die Elemente i1, i2, i3 etc. eingefügt. Ist x negativ, wird der Index ab dem Ende des Arrays gezählt. Werden keine Elemente angegeben, werden lediglich n Elemente gelöscht. Ist n == 0 werden die neuen Elemente zwischen x und x+1 eingefügt.
Die Methode reverse() kehrt die Reihenfolge der Elemente des Arrays um.
Die Methode sort() sortiert die Elemente des Arrays aufsteigend.
Eltern[0][7].pop();
Eltern[0][7].unshift("Sofie", "Lotte");
console.log(Eltern[0][7]); // (4) ["Sofie", "Lotte", "Paula", "Olaf"]
Eltern[0][7].shift();
Eltern[0][7].push("Hauke", "Leo");
console.log(Eltern[0][7]); // (5) ["Lotte", "Paula", "Olaf", "Hauke", "Leo"]
Eltern[0][7].splice(2, 2, "Till", "Mona", "Brian");
console.log(Eltern[0][7]); // (6) ["Lotte", "Paula", "Till", "Mona", "Brian", "Leo"]
Eltern[0][7].splice(1, 0, "Sarah");
console.log(Eltern[0][7]); // (7) ["Lotte", "Sarah", "Paula", "Till", "Mona", "Brian", "Leo"]
Eltern[0][7].reverse();
console.log(Eltern[0][7]); // (7) ["Leo", "Brian", "Mona", "Till", "Paula", "Sarah", "Lotte"]
Eltern[0][7].sort();
console.log(Eltern[0][7]); // (7) ["Brian", "Leo", "Lotte", "Mona", "Paula", "Sarah", "Till"]
► JavaScript-Referenz: concat() slice()
Mit der Methode concat(z) kann ein neues Array erzeugt werden, dass die Elemente im Array z an ein vorhandenes Array anhängt.
MIt der Methode slice(x, y) kann ein Teilbereich eines Arrays ab einschließlich Index x bis ausschließlich Index y ausgegeben werden. Wird y nicht angegeben, werden alle Elemente ab x bis zum Ende des Arrays ausgewählt.
c = Eltern[0][7].concat(["Lasse", "Bosse", "Ole"]);
console.log(c); // (10) ["Brian", "Leo", "Lotte", "Mona", "Paula", "Sarah", "Till", "Lasse", "Bosse", "Ole"]
console.log(c.slice(4)); // (6) ["Paula", "Sarah", "Till", "Lasse", "Bosse", "Ole"]
console.log(c.slice(0, 4)); // (4) ["Brian", "Leo", "Lotte", "Mona"]
► JavaScript-Referenz: includes() indexOf() lastIndexOf()
► JavaScript-Referenz: some() every() find() findIndex() filter()
Mit der Methode includes(z) kann geprüft werden, ob ein Array das Element z enthält.
Die Methode indexOf(z) gibt den Index des ersten Vorkommens des Elements z im Array zurück. Die Methode lastIndexOf(z) gibt den Index des letzten Vorkommens des Elements z im Array zurück. Bei beiden Methoden wird -1 zurückgegeben, wenn z im Array nicht enthalten ist.
console.log(Eltern[0][7].includes("Heino")); // false
console.log(Eltern[0][7].includes("Paula")); // true
console.log(Eltern[0][7].indexOf("Paula")); // 4
console.log(Eltern[0][7].lastIndexOf("Heino")); // -1Assoziative Arrays
Assoziative Arrays im eigentlichen Sinne, die mit alphanumerischen Schlüsseln arbeiten, sind in JavaScript nicht vorgesehen. Sie lassen sich aber nachbilden, indem man statt eines Arrays ein Objekt anlegt. Die Eigenschaften dieses Objekts entsprechen den einzelnen Schlüsseln eines assoziativen Arrays.
// Objekt erstellen
person = {
vorname: 'Zaphod',
nachname: 'Beeblebrox',
wohnort: 'Heart of Gold',
};
// Anzahl der Einträge, Schlüssel oder Werte abfragen
console.log(Object.entries(person).length);
console.log(Object.keys(person).length);
console.log(Object.values(person).length);
// Eigenschaft abfragen
console.log(person.vorname);
console.log(person['nachname']);
// Eigenschaft ergänzen
person['telefon'] = "(01234) 56 789";
// Eigenschaft löschen
delete person.wohnort;
// Schleifen über alle Eigenschaften
for (schluessel in person) console.log(schluessel, person[schluessel]);
Object.keys(person).forEach(key => {
console.log(key + ': ' + person[key]);
});
// Existenz einer Eigenschaft prüfen
if (person.hasOwnProperty('vorname')) console.log("Der Schlüssel 'vorname' ist vorhanden.");Stichworte: webdesign,webgestaltung,programmierung,javascript,anleitung,tutorial,arrays