Javascript array.includes ()

Element in Array

array.includes () prüft, ob ein Element bereits in einem Array enthalten ist, und gibt true zurück, wenn der Wert bereits im Array gefunden wird, und false wenn nicht. Alle modernen Browser, Microsoft ab Edge.

23-02-02 SITEMAP CSS HTML JS Basis JS Web Tutorial SVG

array.includes ()

includes () ist case sensitive – beachtet also Groß- und Kleinschreibung – und hat ein oder zwei Parameter. Der erste Parameter ist das gesuchte Array-Element, der zweite Parameter ist optional und bildet einen Startindex.

 gesuchtes Element  +
                    |
array.includes (element, start)
                           |
                optional   +
suchen ab Position start
const colors = [ "Graublau", "Himmelblau", "Türkis", "taubenblau", "Kornblumenblau"];

if (colors.includes ( "Taubenblau" )) {
    console.log ( "Taubenblau liegt bereits in array colors");
} else {
	console.log ( "Taubenblau liegt nicht in array colors");
}
Taubenblau liegt nicht in array colors

Prüfen, ob der gesuchte Wert ab einer bestimmten Position vorkommt:

if (colors.includes ("Türkis", 2)) {
	console.log ( "Türkis liegt nach Position 1 im array colors");
} else {
	console.log ( "Türkis liegt nicht auf Position 0 bis 1 im array");
}
Türkis liegt nach Position 1 im array colors

Die Suche beginnt also auf der klassischen Position 0.

array.includes (object) ?

array.includes() führt einen einfachen Gleichheits-Vergleich auf jedem Element durch und gibt true zurück, wenn mindestens ein Element des Arrays gleich dem Wert ist.

Die Prüfung, ob ein Array eine Referenz auf ein Element enthält, ist einfach.

let arr = [
	{ "titel": "Eine kurze Geschichte von fast allem",	"autor": "Bryson, Bill" },
	{ "titel": "Accidental Empires", "autor": "Cringely, Robert X." },
	{ "titel": "Arm und Reich", "autor": "Diamond, Jared" }
];

const theBook = arr[3];
const included = arr.includes(theBook);
console.log (`theBook enthalten? ${included}`); // true

Häufig suchen wir eher nach einem Objekt anhand seines Inhalts – z.B. gibt es im Array ein Objekt mit dem Buchtitel "Accidental Empires".

let objBook = { "titel": "Accidental Empires", "autor": "Cringely, Robert X." };
const includesObj = arr.includes(objBook); // => false

array.some() hingegen nutzt individuelle Logik in der Callback-Funktion, um zu testen, ob das Array ein Element enthält.

let element1 = { "titel": "Arm und Reich" };
const el1 = arr.some (item => item.title === element1.title);
console.log (`titel Arm und Reich ${el1}`);

Also: Die Prüfung, ob ein einfacher Wert wie ein String oder eine Zahl in einem Array vorhanden sind, ist einfach: array.includes(value).

Für einen schnellen Check, ob ein Array ein Objekt mit einem bestimmten Wert enthält, ist bei array.some () besser aufgehoben.

array.indexOf

array.indexOf findet das erste Vorkommen eines Array-Elements. Genauso wie bei array inlcudes () kann ein optionaler zweiter Parameter checken, ob der Wert nach einer bestimmten Position vorkommt.

console.log ("Türkis liegt auf " + colors.indexOf("Türkis"));

Weil assoziative Arrays von Javascript nicht unterstützt werden, sondern im Grunde genommen nur schlichte Schlüssel-Wertpaare sind, gibt includes () bei der Abfrage, ob der Wert eines Elements im Array enthalten ist, false zurück.

const associative = [];
      associative["filename"]  = "raketenstart.svg";
      associative["path"]      = "icons";
      associative["rating"]    = 3;
      associative["urgency"]   = 6;
      associative["lightroom"] = "Fahrzeug, Rakete, Mond";

const index = associative.includes("rating");

console.log ("Index of Rating " + index);

Hier muss die Abfrage, ob ein Schlüssel im Array enthalten ist, mit

Und dann haben wir da noch JSON … Um zu prüfen, ob ein Element in einem JSON-Objekt liegt, haben wir hasOwnProperty.

const json = {
	"filename": "adobe-cloud-icon.svg",
	"path": "svg",
	"rating": {
		"0": "3"
	},
	"urgency": "0",
	"lightroom": "Computer, Computer|Icon, "
}

if(json.hasOwnProperty("lightroom")){
	console.log ("lightroom Stichwörter drin");
}