JS/webseite-react-php/react-app/README.md

Map

Ein Array ist eine geordnete Liste indizierter Werte (Zugriff über numerische Indizes 0, 1, 2...), während eine Map eine geordnete Sammlung von Schlüssel-Wert-Paaren (Key-Value Pairs) ist, bei der beliebige Datentypen als Schlüssel dienen können.

Merkmal	Array ([] / new Array())	Map (new Map())
Datenstruktur	Geordnete Liste von Elementen	Geordnete Schlüssel-Wert-Paare
Schlüssel / Indizes	Ausschließlich sequentielle Integer (0, 1, 2...)	Beliebige Typen (Objekte, Funktionen, Strings, Booleans)
Elementanzahl	array.length	map.size
Zugriff / Abfrage	Index arr[0] oder Suche arr.find(...) (O(n))	Direkter Lookup map.get(key) (O(1))
Vorhandensein prüfen	arr.includes(val) (O(n))	map.has(key) (O(1))
Einfügen / Löschen	push(), splice() (Verschiebung im Speicher)	set(key, val), delete(key) (Optimiert für Keys)

---

Wann macht Map Sinn?

• Häufiges Nachschlagen (Lookups): Wenn du Werte anhand eines eindeutigen Identifikators (ID, Slug, Token) extrem schnell abrufen musst (O(1) statt Array-Iteration mit find()).
• Objekte oder Funktionen als Schlüssel: Im Gegensatz zu regulären JS-Objekten (die Keys immer in Strings/Symbols umwandeln) akzeptiert Map Referenzen als Key:

const userMap = new Map();
const userObj = { id: 42 };

userMap.set(userObj, { role: "admin", active: true });
console.log(userMap.get(userObj)); // { role: "admin", active: true }

• Häufiges Hinzufügen und Entfernen: Map ist intern für dynamisches Hinzufügen (set) und Löschen (delete) optimiert. Beim Entfernen aus einem Array via splice() müssen alle nachfolgenden Indizes neu berechnet werden.
• Saubere Schlüssel ohne Prototype-Pollution: Ein normales Objekt {} erbt Standard-Methoden wie toString. Eine Map enthält strikt nur die Schlüssel, die du selbst definierst.

---

Wann bleibt Array die bessere Wahl?

• Wenn die Reihenfolge und Indexposition im Vordergrund stehen (z. B. Sortieren, Paginieren).
• Wenn du Transformations-Pipelines wie .map(), .filter(), .reduce() oder .flat() brauchst.
• Für homogene Datenlisten, die direkt als JSON serialisiert werden sollen (JSON.stringify() unterstützt Arrays nativ, Maps müssen vorher konvertiert werden).

---

React + Vite

This template provides a minimal setup to get React working in Vite with HMR and some Oxlint rules.

Currently, two official plugins are available:

• @vitejs/plugin-react uses Oxc
• @vitejs/plugin-react-swc uses SWC

React Compiler

The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see this documentation.

Expanding the Oxlint configuration

If you are developing a production application, we recommend using TypeScript with type-aware lint rules enabled. Check out the TS template for information on how to integrate TypeScript and Oxlint's TypeScript related rules in your project.