diff options
Diffstat (limited to 'files/de/web/javascript/data_structures/index.html')
| -rw-r--r-- | files/de/web/javascript/data_structures/index.html | 272 |
1 files changed, 272 insertions, 0 deletions
diff --git a/files/de/web/javascript/data_structures/index.html b/files/de/web/javascript/data_structures/index.html new file mode 100644 index 0000000000..31c2ff40ef --- /dev/null +++ b/files/de/web/javascript/data_structures/index.html @@ -0,0 +1,272 @@ +--- +title: JavaScript Datentypen und Datenstrukturen +slug: Web/JavaScript/Data_structures +tags: + - Beginner + - JavaScript + - Types +translation_of: Web/JavaScript/Data_structures +original_slug: Web/JavaScript/Datenstrukturen +--- +<div>{{jsSidebar("More")}}</div> + +<p>Alle Programmiersprachen besitzen eingebaute Datenstrukturen. Diese unterschieden sich aber je nach Programmiersprache. Dieser Artikel versucht, die in JavaScript verfügbaren Datenstrukturen und ihre Eigenschaften zu erläutern. Außerdem werden an passenden Stellen Vergleiche zu anderen Programmiersprachen gezogen.</p> + +<h2 id="Dynamische_Typisierung">Dynamische Typisierung</h2> + +<p>JavaScript ist eine <em>schwach typisierte</em> oder <em>dynamische</em> Programmiersprache. Datentypen werden bei einer Variable nicht explizit deklariert und jede Variable kann mit Werten jedes Typen beschrieben (überschrieben) werden:</p> + +<pre class="brush: js">var foo = 42; // foo ist jetzt eine number +var foo = "bar"; // foo ist jetzt ein string +var foo = true; // foo ist jetzt ein boolean +</pre> + +<h2 id="Datentypen">Datentypen</h2> + +<p>Der aktuelle ECMAScript Standard definiert sieben Datentypen:</p> + +<ul> + <li>Sechs Datentypen sind {{Glossary("Primitive", "primitives")}}: + <ul> + <li>{{Glossary("Boolean")}}</li> + <li>{{Glossary("Null")}}</li> + <li>{{Glossary("Undefined")}}</li> + <li>{{Glossary("Number")}}</li> + <li>{{Glossary("String")}}</li> + <li>{{Glossary("Symbol")}} (new in ECMAScript 2015)</li> + </ul> + </li> + <li>und {{Glossary("Object")}}</li> +</ul> + +<h2 id="Primitive_Werte">Primitive Werte</h2> + +<p>Alle Datentypen, bis auf Object, definieren unveränderbare Werte (Werte, die nicht verändert werden können). Zum Beispiel im Gegensatz zu C sind Strings unveränderbar. Die Werte dieser Datentypen werden als "primitive Werte" bezeichnet.</p> + +<h3 id="Boolean_Datentyp">Boolean Datentyp</h3> + +<p>Boolean repräsentiert eine logische Einheit und kann zwei Werte annehmen: <code>true</code> und <code>false</code>.</p> + +<h3 id="Null_Datentyp">Null Datentyp</h3> + +<p>Der Null Typ hat genau einen Wert: <code>null</code>. Siehe {{jsxref("null")}} und {{Glossary("Null")}} für mehr Details.</p> + +<h3 id="Undefined_Datentyp">Undefined Datentyp</h3> + +<p>Eine Variable, der noch kein Wert zugewiesen wurde, hat den Wert <code>undefined</code>. Siehe {{jsxref("undefined")}} und {{Glossary("Undefined")}} für mehr Details.</p> + +<h3 id="Number_Datentyp">Number Datentyp</h3> + +<p>Laut dem ECMAScript Standard gibt es nur einen Datentyp für Zahlen: <a href="https://de.wikipedia.org/wiki/Doppelte_Genauigkeit">double-precision 64-bit binary format IEEE 754 value</a> (Zahlen zwischen -(2<sup>63</sup>) und +2<sup>63</sup>-1). <strong>Es gibt keinen spezifischen Datentyp für Ganzzahlen</strong>. Neben Gleitkommazahlen kann der Datentyp für Zahlen auch drei symbolische Werte annehmen: <code>+Infinity</code>, <code>-Infinity</code> und <a href="/de/docs/Web/JavaScript/Reference/Global_Objects/NaN"><code>NaN</code></a> (not-a-number = keine Zahl).</p> + +<p>Um auf größere oder kleinere Werte als <code>+/-Infinity</code> zu prüfen, können die Konstanten {{jsxref("Number.MAX_VALUE")}} oder {{jsxref("Number.MIN_VALUE")}} verwendet werden. Ab ECMAScript 2015 kann auch geprüft werden, ob sich eine Zahl innerhalb des Bereichs der Gleitkommazahlen mit doppelter Präzision befindet. Die ist mit {{jsxref("Number.isSafeInteger()")}} als auch {{jsxref("Number.MAX_SAFE_INTEGER")}} und {{jsxref("Number.MIN_SAFE_INTEGER")}} möglich. Zahlen außerhalb diesen Bereichs sind in JavaScript nicht mehr sicher.</p> + +<p>Der Datentyp für Zahlen hat eine Ganzzahl mit zwei Repräsentationen: 0 kann als -0 und +0 repräsentiert werden. ("0" ist ein Alias für +0). In der Praxis hat dies fast keinen Einfluss. <code>+0 === -0</code> ist zum Beispiel <code>true</code>. Eine Division ergibt aber zwei unterschiedliche Werte:</p> + +<pre class="brush: js">> 42 / +0 +Infinity +> 42 / -0 +-Infinity +</pre> + +<p>Obwohl eine Zahl oft ihren Wert repräsentiert, bietet JavaScript <a href="/de/docs/Web/JavaScript/Reference/Operators/Bitwise_Operators" title="en/JavaScript/Reference/Operators/Bitwise_Operators">einige binäre Operatoren</a> an. Mit ihnen können zum Beispiel mehrere Boolean Werte innerhalb einer einzigen Zahl mittels <a class="external" href="http://en.wikipedia.org/wiki/Mask_%28computing%29">Bitmaskierung</a> repräsentiert werden. Das gilt generell als schlechte Praxis, da JavaScript andere Wege anbietet, um eine Menge von Booleans zu repräsentierten (wie zum Beispiel ein Array von Booleans oder ein Objekt mit Boolean Werten als benannte Eigenschaften). Bitmaskierung führt außerdem dazu, dass Code schwerer zu lesen, zu verstehen und zu warten ist. In sehr speziellen Anwendungsgebiete kann eine Bitmaskierung aber notwendig sein. Zum Beispiel wenn nur geringe Speichermengen verfügbar sind oder in extremen Fällen, wenn jedes übertragene Bit im Netzwerk zählt. Diese Technik sollte aber als letzter Ausweg gesehen werden, um die Größe zu optimieren.</p> + +<h3 id="String_Datentyp">String Datentyp</h3> + +<p>Der Datentyp String wird in JavaScript für die Repräsentation von textuellen Daten verwendet. Er ist eine Menge von "Elementen" aus 16-Bit vorzeichenlosen Ganzzahlenwerten. Jedes Element im String nimmt eine Position im String ein. Das erste Element befindet sich an der Position mit dem Index 0, das nächste beim Index 1 und so weiter. Die Länge eines String ist die Anzahl der sich darin befindenden Elemente.</p> + +<p>In Gegensatz zu anderen Programmiersprachen wie C kann ein String in JavaScript nicht verändert werden. Das bedeutet, dass ein String nicht mehr verändert werden kann, nachdem er erstellt wurde. Es ist aber möglich einen anderen String mit der Hilfe von Operationen aus dem ursprünglichen String zu erstellen:</p> + +<ul> + <li>Eine Teilzeichenfolge vom ursprünglichen String durch das Auswählen von bestimmten Zeichen oder mit der Methode {{jsxref("String.substr()")}}.</li> + <li>Eine Verkettung von zwei Strings mit dem Operator (<code>+</code>) oder {{jsxref("String.concat()")}}.</li> +</ul> + +<h4 id="Vermeiden_Sie_stringly-typing_in_Ihrem_Code!">Vermeiden Sie "stringly-typing" in Ihrem Code!</h4> + +<p>Es kann verlockend sein mit String komplexe Daten zu repräsentieren. Es bringt kurzfristige Vorteile mit sich:</p> + +<ul> + <li>Komplexe Strings können einfach durch Verkettung erstellt werden.</li> + <li>Strings sind einfacher im Debug (die Ausgabe entspricht dem Inhalt vom String).</li> + <li>Strings sind bei vielen APIs gebräuchlich (<a href="/de/docs/Web/API/HTMLInputElement" title="HTMLInputElement">Eingabefeldern</a>, <a href="/de/docs/Storage" title="Storage">Local Storage</a> Werte, {{ domxref("XMLHttpRequest") }} Antworten in ihrer Eigenschaft als <code>responseText</code>, etc.). Dadurch kann es verlockend sein nur mit Strings zu arbeiten.</li> +</ul> + +<p>Ohne Konventionen kann jede Datenstruktur als String repräsentiert werden. Das ist aber keine gute Idee. Es könnte zum Beispiel eine Liste emuliert werden, indem die Listenelemente im String durch einen Separator getrennt werden. In diesem Fall ist ein JavaScript Array aber geeigneter, denn die Liste kann zerstört werden sobald ein Listenelement den Separator enthält. Ein Escape-Zeichen oder Ähnliches müsste verwendet werden. Dafür sind aber zusätzliche Konventionen nötig und die Wartung des Codes nimmt an Komplexität zu.</p> + +<p>Strings sollten nur für textuelle Daten verwendet werden. Wenn komplexe Daten repräsentiert werden sollen, parsen Sie den String und verwenden Sie eine geeignete Abstraktion.</p> + +<h3 id="Symbol_Datentyp">Symbol Datentyp</h3> + +<p>Symbole in JavaScript sind mit ECMAScript 2015 eingeführt worden. Ein Symbol ist ein <strong>eindeutiger</strong> und <strong>unveränderbarer</strong> primitiver Wert. Er kann als Schlüssel einer Eigenschaft eines Objekts (siehe unten) verwendet werden. In manchen Programmiersprachen werden Symbole auch Atoms genannt. Details dazu sind unter {{Glossary("Symbol")}} und dem {{jsxref("Symbol")}} Object Wrapper in JavaScript zu finden.</p> + +<h2 id="Objekte">Objekte</h2> + +<p>Objekte sind in der Informatik Werte im Speicher, die möglicherweise über einen {{Glossary("Identifier", "identifier")}} referenziert werden.</p> + +<h3 id="Eigenschaften">Eigenschaften</h3> + +<p>In JavaScript können Objekte als eine Sammlung von Eigenschaften (Properties) angesehen werden. Mit der <a href="/de/docs/Web/JavaScript/Guide/Werte_Variablen_und_Literale#Objekt-Literale">Object Literal Syntax</a> werden die nötigsten Eigenschaften initialisiert. Danach können Eigenschaften hinzugefügt oder wieder entfernt werden. Der Wert einer Eigenschaft kann von jedem Datentyp sein. Darunter können sich auch andere Objekte befinden. Dadurch können komplexe Datenstrukturen realisiert werden. Eigenschaften werden mit einem Key identifiziert. Ein Key ist entweder ein String oder ein Symbol.</p> + +<p>Es gibt zwei Arten von Eigenschaften, die bestimmte Attribute haben: Die Dateneigenachften und Zugriffseigenschaften.</p> + +<h4 id="Dateneigenschaften">Dateneigenschaften</h4> + +<p>Assoziiert einen Key mit einem Wert und besitzt die folgenden Attribute:</p> + +<table class="standard-table"> + <caption>Attribute einer Dateneigenschaft</caption> + <tbody> + <tr> + <th>Attribut</th> + <th>Datentyp</th> + <th>Beschreibung</th> + <th>Standardwert</th> + </tr> + <tr> + <td>[[Value]]</td> + <td>beliebiger JavaScript Datentyp</td> + <td>Der Wert, der bei einem Get-Zugriff auf die Eigenschaft zurückgegeben wird</td> + <td>undefined</td> + </tr> + <tr> + <td>[[Writable]]</td> + <td>Boolean</td> + <td><code>false</code>, wenn [[Value]] der Eigenschaft nicht verändert werden kann.</td> + <td>false</td> + </tr> + <tr> + <td>[[Enumerable]]</td> + <td>Boolean</td> + <td><code>true</code>, wenn die Eigenschaft in <a href="/de/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a> Schleifen aufgelistet wird. Siehe dazu auch <a href="/de/docs/Web/JavaScript/Enumerability_and_ownership_of_properties">Aufzählbarkeit und Eigentum von Eigenschaften</a>.</td> + <td>false</td> + </tr> + <tr> + <td>[[Configurable]]</td> + <td>Boolean</td> + <td><code>false</code>, wenn die Eigenschaft nicht gelöscht und die Attribute [[Value]] und [[Writable]] nicht verändert werden können.</td> + <td>false</td> + </tr> + </tbody> +</table> + +<h4 id="Zugriffseigenschaften">Zugriffseigenschaften</h4> + +<p>Assoziiert einen Key mit einer oder zwei Accessor-Funktionen (get und set), um einen Wert zu erhalten oder zu speichern. Es besitzt die folgenden Attribute:</p> + +<table class="standard-table"> + <caption>Attribute eines Zugriffseigenschaft</caption> + <tbody> + <tr> + <th>Attribut</th> + <th>Datentyp</th> + <th>Beschreibung</th> + <th>Standardwert</th> + </tr> + <tr> + <td>[[Get]]</td> + <td>Funktionsobjekt oder undefined</td> + <td>Die Funktion wird ohne ein Argument aufgerufen und gibt den Wert der Eigenschaft zurück, sobald ein Get-Zugriff auf den Wert ausgeführt wird. Siehe auch <a href="/de/docs/Web/JavaScript/Reference/Operators/get"><code>get</code></a>.</td> + <td>undefined</td> + </tr> + <tr> + <td>[[Set]]</td> + <td>Funktionsobjekt oder undefined</td> + <td>Die Funktion wird mit einem Argument aufgerufen, das den Wert für die Zuweisung enthält. Sie wird immer aufgerufen, sobald eine bestimmte Eigenschaft verändert werden soll. Siehe auch <a href="/de/docs/Web/JavaScript/Reference/Operators/set"><code>set</code></a>.</td> + <td>undefined</td> + </tr> + <tr> + <td>[[Enumerable]]</td> + <td>Boolean</td> + <td><code>true</code>, wenn die Eigenschaft in <a href="/de/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a> Schleifen aufgelistet wird.</td> + <td>false</td> + </tr> + <tr> + <td>[[Configurable]]</td> + <td>Boolean</td> + <td><code>false</code>, wenn die Eigenschaft nicht gelöscht und nicht zu einer Dateneigenschaft verändert werden kann.</td> + <td>false</td> + </tr> + </tbody> +</table> + +<div class="note"> +<p><strong>Hinweis:</strong> Attribut wird normalerweise von der JavaScript-Umgebung genutzt und man kann nicht direkt zugreifen (mehr darüber: <a href="/de/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">Object.defineProperty()</a>). Deswegen sind die Attribute in doppelten eckigen Klammern statt in einfachen.</p> +</div> + +<h3 id="Normale_Objekte_und_Funktionen">"Normale" Objekte und Funktionen</h3> + +<p>Ein Objekt in JavaScript ist ein Mapping zwischen Keys und Werten. Keys sind Strings oder Symbole und Werte können von jedem Datentyp sein. Dadurch sind Objekte eine Art <a class="external" href="https://de.wikipedia.org/wiki/Hashtabelle">Hashtabelle</a>.</p> + +<p>Funktionen sind reguläre Objekte mit der Fähigkeit direkt aufgerufen werden zu können.</p> + +<h3 id="Datum">Datum</h3> + +<p>Mit der in JavaScript eingebauten <a href="/de/docs/Web/JavaScript/Reference/Global_Objects/Date"><code>Date</code> Utility</a> kann ein Datum repräsentiert werden.</p> + +<h3 id="Indizierte_Collections_Arrays_und_typisierte_Arrays">Indizierte Collections: Arrays und typisierte Arrays</h3> + +<p><a href="/de/docs/JavaScript/Reference/Global_Objects/Array" title="Array">Arrays</a> sind reguläre Objekte bei denen eine Beziehung zwischen Eigenschaften, die über Ganzzahlen indiziert werden, und der Eigenschaft 'length' besteht. Zusätzlich erben Arrays von <code>Array.prototype</code>, einer Helfermethoden, die die Manipulation von Arrays anbietet, wie zum Beispiel <code><a href="/de/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf" title="en/JavaScript/Reference/Global_Objects/Array/indexOf">indexOf</a></code> (zur Suche eines Werts im Array) oder <code><a href="/de/docs/JavaScript/Reference/Global_Objects/Array/push" title="en/JavaScript/Reference/Global_Objects/Array/push">push</a></code> (um Elemente zu einem Array hinzufügen). Dadurch können Listen und Mengen über ein Array repräsentiert werden.</p> + +<p><a href="/de/docs/Web/JavaScript/Typed_arrays">Typisierte Arrays</a> sind in JavaScript mit ECMAScript Edition 2015 eingeführt worden. Sie bieten eine Array-ähnliche Sicht auf einen darunterliegenden binären Datenpuffer an. Die folgende Tabelle stellt äquivalente C Datentypen dar:</p> + +<p>{{page("/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray", "TypedArray_objects", "", 0, 3)}}</p> + +<h3 id="Keyed_Collections_Maps_Sets_WeakMaps_WeakSets">Keyed Collections: Maps, Sets, WeakMaps, WeakSets</h3> + +<p>Diese Datenstrukturen verwenden Objektreferenzen als Keys. Sie wurden mit ECMAScript Edition 6 eingeführt. {{jsxref("Set")}} und {{jsxref("WeakSet")}} repräsentieren eine Menge von Objekten, während {{jsxref("Map")}} und {{jsxref("WeakMap")}} einen Wert mit einem Objekt assoziieren. Der Unterschied zwischen Maps und WeakMaps ist, dass bei Maps über Objekt-Keys iteriert werden kann. Das erlaubt eine spätere Optimierung der Garbage Collection.</p> + +<p>Maps und Sets könnten in reinem ECMAScript 5 implementiert werden. Da Objekte aber nicht verglichen werden können (im Sinne von zum Beispiel "kleiner gleich"), wäre die Performance für einen Look-Up linear. Native Implementierungen (inklusive WeakMaps) können eine ungefähr logarithmische Look-Up Performance haben.</p> + +<p>Um Daten an einen DOM-Knoten zu binden, werden normalerweise die Eigenschaften direkt auf dem Objekt gesetzt oder es werden <code>data-*</code> Attribute verwendet. Das hat aber den Nachteil, dass die Daten für jedes Skript in demselben Kontext verfügbar sind. Mit Maps und WeakMaps können Daten einfach privat an ein Objekt gebunden werden.</p> + +<h3 id="Strukturierte_Daten_JSON">Strukturierte Daten: JSON</h3> + +<p>JSON (JavaScript Object Notation) ist ein leichtgewichtges Format zum Datenaustausch, das von JavaScript abgeleitet aber auch von vielen anderen Programmiersprachen verwendet wird. Mit JSON können universelle Datenstrukturen aufgebaut werden. Siehe {{Glossary("JSON")}} und {{jsxref("JSON")}} für mehr Details.</p> + +<h3 id="Mehr_Objekte_in_der_Standardbibliothek">Mehr Objekte in der Standardbibliothek</h3> + +<p>JavaScript hat eine Standardbibliothek mit zahlreichen eingebauten Objekten. Details darüber sind unter <a href="/de/docs/Web/JavaScript/Reference/Global_Objects">Referenz</a> zu finden.</p> + +<h2 id="Datentypen_mit_dem_typeof_Operator_bestimmen">Datentypen mit dem <code>typeof</code> Operator bestimmen</h2> + +<p>Der <code>typeof</code> Operator kann den Datentyp einer Variablen herausfinden. Unter der <a href="/de/docs/Web/JavaScript/Reference/Operators/typeof">Referenzseite</a> sind mehr Details und Grenzfälle zu finden.</p> + +<h2 id="Spezifikationen">Spezifikationen</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spezifikation</th> + <th scope="col">Status</th> + <th scope="col">Kommentar</th> + </tr> + <tr> + <td>{{SpecName('ES1')}}</td> + <td>{{Spec2('ES1')}}</td> + <td>initiale Definition</td> + </tr> + <tr> + <td>{{SpecName('ES5.1', '#sec-8', 'Types')}}</td> + <td>{{Spec2('ES5.1')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ES2015', '#sec-ecmascript-data-types-and-values', 'ECMAScript Data Types and Values')}}</td> + <td>{{Spec2('ES2015')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName('ESDraft', '#sec-ecmascript-data-types-and-values', 'ECMAScript Data Types and Values')}}</td> + <td>{{Spec2('ESDraft')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<h2 id="Siehe_auch">Siehe auch</h2> + +<ul> + <li><a class="link-https" href="https://github.com/nzakas/computer-science-in-javascript/">Nicholas Zakas Sammlung von gebräuchlichen Datastrukturen und Algorithmen in JavaScript.</a></li> + <li><a href="https://github.com/monmohan/DataStructures_In_Javascript" title="https://github.com/monmohan/DataStructures_In_Javascript">Search Tre(i)es mit JavaScript JavaScript</a></li> +</ul> |