From 4ab365b110f2f1f2b736326b7059244a32115089 Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 14:45:38 +0100 Subject: unslug de: move --- .../web/javascript/reference/operators/index.html | 575 +++++++++++++++++++++ .../reference/operators/spread_syntax/index.html | 220 ++++++++ 2 files changed, 795 insertions(+) create mode 100644 files/de/conflicting/web/javascript/reference/operators/index.html create mode 100644 files/de/conflicting/web/javascript/reference/operators/spread_syntax/index.html (limited to 'files/de/conflicting/web/javascript/reference/operators') diff --git a/files/de/conflicting/web/javascript/reference/operators/index.html b/files/de/conflicting/web/javascript/reference/operators/index.html new file mode 100644 index 0000000000..598d43df68 --- /dev/null +++ b/files/de/conflicting/web/javascript/reference/operators/index.html @@ -0,0 +1,575 @@ +--- +title: Bitweise Operatoren +slug: Web/JavaScript/Reference/Operators/Bitwise_Operatoren +tags: + - JavaScript + - Operator + - Reference +translation_of: Web/JavaScript/Reference/Operators +translation_of_original: Web/JavaScript/Reference/Operators/Bitwise_Operators +--- +
{{jsSidebar("Operators")}}
+ +

Bitweise Operatoren werden auf Sequenzen aus 32 bit (Nullen und Einsen) angewandt im Gegensatz zu Operatoren, die mit Dezimal-, Hexadezimal- oder Oktalzahlen (numbers) arbeiten. Beispielsweise hat die Dezimalzahl neun die binäre Darstellung 1001. Auch wenn Bitweise Operatoren mit Binärdarstellungen arbeiten, sind deren Ausgabewerte Javascript Standardzahlenwerte.

+ +
{{EmbedInteractiveExample("pages/js/expressions-bitwiseoperators.html")}}
+ + + +

Die folgende Tabelle fasst Javascripts Bitweise Operatoren zusammen:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
OperatorEinsatzBeschreibung
Bitweises UNDa & bGibt 1 in jeder Bit Position zurück, an welcher beide Operanden 1 sind.
Bitweises ODERa | bGibt 1 in jeder Bit Position zurück, an welcher einer oder beide Operanden 1 sind.
Bitweises XORa ^ bGibt 1 in jeder Bit Position zurück, an welcher einer aber nicht beide Operanden 1 sind.
Bitweise Negation~ aInvertiert die Bits des Operanden
Linksverschiebunga << bVerschiebt a in binärer Repräsentation b (< 32) Bits nach links, von Rechts werden Nullen hereingeschoben.
Vorzeichen propagierende Rechtsverschiebunga >> bVerschiebt a in binärer Repräsentation b (< 32) Bits nach rechts, herausgeschobene Bits werden verworfen.
Null füllende Rechtsverschiebunga >>> bVerschiebt a in binärer Repräsentation b (< 32) Bits nach rechts, herausgeschobene Bits werden verworfen und Nullen werden von links hereingeschoben.
+ +

Vorzeichenbehaftete 32-Bit Integer

+ +

Die Operanden aller Bitweisen Operationen werden in vorzeichenbehaftete 32-Bit Integer im Zweierkomplementformat konvertiert. Zweierkomplementformat bedeutet, dass das Gegenstück einer negative Zahl alle Bits invertiert (Bitweise Negation einer Zahl oder auch Einerkomplement einer Zahl) plus eins ist. Zum Beispiel die codierte Integer 314:

+ +
00000000000000000000000100111010
+
+ +

Im Folgenden ist ~314 codiert, d. h. das Einerkomplement von 314:

+ +
11111111111111111111111011000101
+
+ +

Anschließend wird -314 codiert, d. h. das Zweierkomplement 314:

+ +
11111111111111111111111011000110
+
+ +

Das Zweierkomplement garantiert, dass das Bit ganz links 0 ist, wenn die Zahl Positiv ist und 1 ist, wenn die Zahl negativ ist. Dieses wird das Vorzeichenbit genannt.

+ +

Die Zahl 0 ist ein Integer, der komplett aus 0 Bits besteht.

+ +
0 (base 10) = 00000000000000000000000000000000 (base 2)
+
+ +

Die Zahl -1 ist ein Integer der komplett aus 1 Bits besteht.

+ +
-1 (base 10) = 11111111111111111111111111111111 (base 2)
+
+ +

Die Zahl -2147483648 (hexadezimale Repräsentation: -0x80000000) ist der Integer, welcher komplett aus 0 Bits besteht, außer dem ersten Bit (linkes Bit).

+ +
-2147483648 (base 10) = 10000000000000000000000000000000 (base 2)
+
+ +

Die Zahl 2147483647 (hexadezimale Repräsentation: -0x7fffffff) ist der Integer, welcher komplett aus 1 Bits besteht, außer dem ersten Bit (linkes Bit).

+ +
2147483647 (base 10) = 01111111111111111111111111111111 (base 2)
+
+ +

Die Zahlen -2147483648 und 2147483647 sind die minimalen und Maximalen Integers, die mit 32-Bit vorzeichenbehafteten Zahlen repräsentiert werden können.

+ +

Bitweise logische Operatoren

+ +

Konzeptionell arbeiten die bitweisen logischen Operatoren wie folgt:

+ + + +

& (Bitweises UND)

+ +

Führt die UND Operation auf jedem Bitpaar durch. a UND b ergibt 1, wenn beide a und b 1 sind. Die Wahrheitstabelle für den UND Operator ist:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
aba UND b
000
010
100
111
+ +
.    9 (Basis 10) = 00000000000000000000000000001001 (Basis 2)
+    14 (Basis 10) = 00000000000000000000000000001110 (Basis 2)
+                    --------------------------------
+14 & 9 (Basis 10) = 00000000000000000000000000001000 (Basis 2) = 8 (Basis 10)
+
+ +

Bitweises verUNDen jeder Zahl x mit 0 ergibt 0. Bitweises verUNDen jeder Zahl x mit -1 ergibt x.

+ +

| (Bitweises ODER)

+ +

Führt die ODER Operation auf jedem Bitpaar durch. a ODER b ergibt 1, wenn einer, a oder b, 1 sind. Die Wahrheitstabelle für den ODER Operator ist:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
aba ODER b
000
011
101
111
+ +
.    9 (Basis 10) = 00000000000000000000000000001001 (Basis 2)
+    14 (Basis 10) = 00000000000000000000000000001110 (Basis 2)
+                    --------------------------------
+14 | 9 (Basis 10) = 00000000000000000000000000001111 (Basis 2) = 15 (Basis 10)
+
+ +

Bitweises verODERn jeder Zahl x mit 0 ergibt x. Bitweises verODERn jeder Zahl x mit -1 ergibt -1.

+ +

^ (Bitweises XOR)

+ +

Führt die XOR Operation auf jedem Bitpaar durch. a XOR b ergibt 1, wenn sich a und b, unterscheiden. Die Wahrheitstabelle für den XOR Operator ist:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
aba XOR b
000
011
101
110
+ +
.    9 (Basis 10) = 00000000000000000000000000001001 (Basis 2)
+    14 (Basis 10) = 00000000000000000000000000001110 (Basis 2)
+                    --------------------------------
+14 ^ 9 (Basis 10) = 00000000000000000000000000000111 (Basis 2) = 7 (Basis 10)
+
+ +

Bitweises verXORn jeder Zahl x mit 0 ergibt x. Bitweises verXORn jeder Zahl x mit -1 ergibt ~x.

+ +

~ (Bitweise Negation)

+ +

Führt die Negationsoperation auf jedem Bit durch. NICHT a ergibt ergibt den invertierten Wert (d. h. das Einerkomplement) von a. Die Wahrheitstabelle für den Negationsoperator ist:

+ + + + + + + + + + + + + + + + +
aNICHT a
01
10
+ +
 9 (Basis 10) = 00000000000000000000000000001001 (Basis 2)
+                --------------------------------
+~9 (Basis 10) = 11111111111111111111111111110110 (Basis 2) = -10 (Basis 10)
+
+ +

Bitweises Negieren jeder Zahl x ergibt -(x + 1). Zum Beispiel ergibt ~-5 4.

+ +

Beispiel mit indexOf:

+ +
var str = 'rawr';
+var searchFor = 'a';
+
+// Das ist eine alternativer Weg um if (-1*str.indexOf('a') <= 0) zu tippen
+if (~str.indexOf(searchFor)) {
+  // searchFor is in the string
+} else {
+  // searchFor is not in the string
+}
+
+// Hier die Werte, die von (~str.indexOf(searchFor)) zurück gegeben werden
+// r == -1
+// a == -2
+// w == -3
+
+ +

Bitweise Verschiebeoperatoren

+ +

Die bitweisen Verschiebeoperatoren (shift Operatoren) haben zwei Operanden: Der erste ist der Anteil, der verschoben werden soll und der zweite ist die Anzahl der Positionen, um die der erste Operand verschoben werden soll. Die Richtung der Verschiebung wird durch den eingesetzten Operator festgelegt.

+ +

Verschiebeoperatoren konvertieren ihre Operanden in 32-Bit Integers in Bit-Endian Reihenfolge und geben als Resultat den gleichen Typ des linken Operanden zurück. Der rechte Operand sollte kleiner als 32 sein, aber wenn das nicht so ist, werden nur die kleinsten fünf Bits verwendet.

+ +

<< (Linksverschiebung)

+ +

Dieser Operator verschiebt den ersten Operand um die spezifizierte Anzahl von Bits nach links. Überflüssige Bits, die nach links verschoben wurden, werden verworfen. Von rechts wird mit 0-Bits aufgefüllt.

+ +

Zum Beispiel ergibt 9 << 2 36:

+ +
.    9 (Basis 10): 00000000000000000000000000001001 (Basis 2)
+                   --------------------------------
+9 << 2 (Basis 10): 00000000000000000000000000100100 (Basis 2) = 36 (Basis 10)
+
+ +

Bitweises Verschieben jeder Zahl x nach links mit y Bits ergibt x * 2 ** y.

+ +

>> (Vorzeichen propagierende Rechtsverschiebung)

+ +

Dieser Operator verschiebt den ersten Operand um die spezifizierte Anzahl von Bits nach rechts. Überflüssige Bits, die nach rechts verschoben wurden, werden verworfen. Kopien des linken Bits (Vorzeichenbits) werden von links hereingeschoben. Weil das neue Vorzeichenbit immer das selbe wie das alte Vorzeichenbit ist, ändert sich das linke Bit nicht. Daher kommt der Name "Vorzeichen propagierend" her.

+ +

Zum Beispiel ergibt 9 >> 2 2:

+ +
.    9 (base 10): 00000000000000000000000000001001 (base 2)
+                  --------------------------------
+9 >> 2 (base 10): 00000000000000000000000000000010 (base 2) = 2 (base 10)
+
+ +

Likewise, -9 >> 2 yields -3, because the sign is preserved:

+ +
.    -9 (Basis 10): 11111111111111111111111111110111 (Basis 2)
+                    --------------------------------
+-9 >> 2 (Basis 10): 11111111111111111111111111111101 (Basis 2) = -3 (Basis 10)
+
+ +

>>> (Null füllende Rechtsverschiebung)

+ +

Dieser Operator verschiebt den ersten Operand um die spezifizierte Anzahl von Bits nach rechts. Überflüssige Bits, die nach rechts verschoben wurden, werden verworfen. Von link wird mit 0-Bits aufgefüllt. Das Vorzeichenbit wird 0, so dass das Ergebnis nie negativ ist.

+ +

Für nicht negative Zahlen ist das Ergebnis bei der Null füllenden Rechtsverschiebung und bei der Vorzeichen propagierenden Rechtsverschiebung das selbe. Zum Beispiel ergibt 9 >>> 2 2, das selbe wie 9 >> 2:

+ +
.     9 (Basis 10): 00000000000000000000000000001001 (Basis 2)
+                    --------------------------------
+9 >>> 2 (Basis 10): 00000000000000000000000000000010 (Basis 2) = 2 (Basis 10)
+
+ +

Jedoch ist das nicht der Fall für negative Zahlen. Zum Beispiel ergibt -9 >>> 2 1073741821, was sich unterschiedet von -9 >> 2 (was -3 ergibt):

+ +
.     -9 (Basis 10): 11111111111111111111111111110111 (Basis 2)
+                     --------------------------------
+-9 >>> 2 (Basis 10): 00111111111111111111111111111101 (Basis 2) = 1073741821 (Basis 10)
+
+ +

Beispiele

+ +

Flags und Bitmasken

+ +

Die bitweisen logischen Operatoren werden häufig eingesetzt, um Sequenzen von Flags zu erstellen, zu manipulieren und zu lesen, welche wie binäre Variablen sind. Variablen können statt dieser Sequenzen genutzt werden, aber binäre Flags verbrauchen weniger Speicher (um den Faktor 32).

+ +

Angenommen es gibt 4 Flags:

+ + + +

Diese Flags sind durch eine Sequenz von Bits repräsentiert: DCBA. Wenn ein Flag gesetzt wird, hat es den Wert 1. Wenn ein Flag geleert wird, hat es den Wert 0. Angenommen eine Variable flags hat den binären Wert 0101:

+ +
var flags = 5;   // binär 0101
+
+ +

Dieser Wert zeigt an:

+ + + +

Weil Bitweise Operatoren mit 32-Bit arbeiten, ist 0101 eigentlich 00000000000000000000000000000101, aber die führenden nullen können vernachlässigt werden, weil sie keine Informationen enthalten.

+ +

Eine Bitmaske ist eine Sequenz von Bits, die Flags manipulieren und/oder lesen kann. Typisch ist es, dass eine "primitive" Bitmaske für jedes Flag definiert ist:

+ +
var FLAG_A = 1; // 0001
+var FLAG_B = 2; // 0010
+var FLAG_C = 4; // 0100
+var FLAG_D = 8; // 1000
+
+ +

Neue Bitmasken können erstellt werden, indem bitweise logische Operatoren auf den primitiven Bitmasken angewendet werden. Zum Beispiel kann die Bitmaske 1011 mit VerODERn von FLAG_A, FLAG_B und FLAG_D erstellt werden:

+ +
var mask = FLAG_A | FLAG_B | FLAG_D; // 0001 | 0010 | 1000 => 1011
+
+ +

Individuelle Flagwerte können durch das VerUNDen mit einer Bitmaske extrahiert werden, wobei jedes Bit mit dem Wert eins das korrespondierende Flag extrahiert. Die Bitmaske wirft nicht relevante Flags heraus, indem Nullen verUNDet werden (daher der Begriff "Bitmaske"). Zum Beispiel kann die Bitmaske 0100 genutzt werden, um zu sehen, ob Flag C gesetzt ist:

+ +
// Wenn man eine Katze besitzt
+if (flags & FLAG_C) { // 0101 & 0100 => 0100 => true
+   // tu irgendetwas
+}
+
+ +

Eine Bitmaske mit mehreren gesetzten Flags funktioniert wie ein "entweder/oder". Zum Beispiel sind die beiden folgenden Ansätze äquivalent:

+ +
// wenn man eine Fledermaus besitzt oder eine Katze besitzt
+// (0101 & 0010) || (0101 & 0100) => 0000 || 0100 => true
+if ((flags & FLAG_B) || (flags & FLAG_C)) {
+   // do stuff
+}
+
+ +
// wenn man eine Fledermaus oder eine Katze besitzt
+var mask = FLAG_B | FLAG_C; // 0010 | 0100 => 0110
+if (flags & mask) { // 0101 & 0110 => 0100 => true
+   // do stuff
+}
+
+ +

Flags können mit VerODERung mit einer Bitmaske gesetzt werden, wobei jedes Bit in der Bitmaske mit dem Wert 1 wird das korrespondierende Flag setzen, wenn es noch nicht gesetzt ist. Zum Beispiel kann die Bitmaske 1100 benutzt werden, um die Flags C und D zu setze:

+ +
// ja, man besitzt eine Katze und eine Ente
+var mask = FLAG_C | FLAG_D; // 0100 | 1000 => 1100
+flags |= mask;   // 0101 | 1100 => 1101
+
+ +

Flags können mit VerUNDung mit einer Bitmaske geleert werden, wobei jedes Bit in der Bitmaske mit dem Wert 0 wird das korrespondierende Flag geleert, wenn es noch nicht geleert ist. Die Bitmaske dafür kann mit Negation primitiver Bitmasken erstellt werden Zum Beispiel kann die Bitmaske 1010 benutzt werden, um die Flags A und C zu leeren:

+ +
// no, we don't have an ant problem or own a cat
+var mask = ~(FLAG_A | FLAG_C); // ~0101 => 1010
+flags &= mask;   // 1101 & 1010 => 1000
+
+ +

The mask could also have been created with ~FLAG_A & ~FLAG_C (De Morgan's law):

+ +
// nein, mat hat kein Problem mit Ameisen und man besitzt keine Katze
+var mask = ~FLAG_A & ~FLAG_C;
+flags &= mask;   // 1101 & 1010 => 1000
+
+ +

Flags können mit VerXORung mit einer Bitmaske umgeschaltet werden, wobei jedes Bit in der Bitmaske mit dem Wert 1 wird das korrespondierende Flag umschaltet. Zum Beispiel kann die Bitmaske 0110 benutzt werden, um die Flags B und C umzuschalten:

+ +
// wenn man keine Fledermaus besitzt und und jetzt eine bekommt
+// and wenn man eine hat und die Fledermaus verabschiedet
+// das gleiche für eine Katze
+var mask = FLAG_B | FLAG_C;
+flags = flags ^ mask;   // 1100 ^ 0110 => 1010
+
+ +

Alle Flags können mit dem Negationsoperator umgedreht werden:

+ +
// entering parallel universe...
+flags = ~flags;    // ~1010 => 0101
+
+ +

Konvertierungsbeispiele

+ +

Konvertierung eines binär String zu einer dezimal Number:

+ +
var sBinString = '1011';
+var nMyNumber = parseInt(sBinString, 2);
+alert(nMyNumber); // prints 11, i.e. 1011
+
+ +

Konvertierung einer dezimal Number zu einem binär String:

+ +
var nMyNumber = 11;
+var sBinString = nMyNumber.toString(2);
+alert(sBinString); // prints 1011, i.e. 11
+
+ +

Bitmaskenerstellung automatisieren

+ +

Man kann, wie folgt, mehrere Masken von einer Menge von Boolean Werten erstellen:

+ +
function createMask() {
+  var nMask = 0, nFlag = 0, nLen = arguments.length > 32 ? 32 : arguments.length;
+  for (nFlag; nFlag < nLen; nMask |= arguments[nFlag] << nFlag++);
+  return nMask;
+}
+var mask1 = createMask(true, true, false, true); // 11, i.e.: 1011
+var mask2 = createMask(false, false, true); // 4, i.e.: 0100
+var mask3 = createMask(true); // 1, i.e.: 0001
+// etc.
+
+alert(mask1); // prints 11, i.e.: 1011
+
+ +

Umgedrehter Algorithmus: Ein Array von Booleanen von einer Bitmaske

+ +

Wenn man ein Array mit Boolean Werten von einer Bitmaske haben möchte, kann man folgenden Code benutzen:

+ +
function arrayFromMask(nMask) {
+  // nMask must be between -2147483648 and 2147483647
+  if (nMask > 0x7fffffff || nMask < -0x80000000) {
+    throw new TypeError('arrayFromMask - out of range');
+  }
+  for (var nShifted = nMask, aFromMask = []; nShifted;
+       aFromMask.push(Boolean(nShifted & 1)), nShifted >>>= 1);
+  return aFromMask;
+}
+
+var array1 = arrayFromMask(11);
+var array2 = arrayFromMask(4);
+var array3 = arrayFromMask(1);
+
+alert('[' + array1.join(', ') + ']');
+// prints "[true, true, false, true]", i.e.: 11, i.e.: 1011
+
+ +

Man kann beide Algorithmen gleichzeitig testen:

+ +
var nTest = 19; // our custom mask
+var nResult = createMask.apply(this, arrayFromMask(nTest));
+
+alert(nResult); // 19
+
+ +

Nur aus didaktischen Gründen (weil dort die Number.toString(2) Methode ist), zeigen wir, wie es möglich ist den arrayFromMask Algorithmus zu verändern, um einen String mit der Binärrepräsentation der Number statt eines Arrays von Booleanen:

+ +
function createBinaryString(nMask) {
+  // nMask must be between -2147483648 and 2147483647
+  for (var nFlag = 0, nShifted = nMask, sMask = ''; nFlag < 32;
+       nFlag++, sMask += String(nShifted >>> 31), nShifted <<= 1);
+  return sMask;
+}
+
+var string1 = createBinaryString(11);
+var string2 = createBinaryString(4);
+var string3 = createBinaryString(1);
+
+alert(string1);
+// prints 00000000000000000000000000001011, i.e. 11
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-11.7')}}{{Spec2('ES5.1')}}Definiert in verschiedenen Abschnitten der Spezifikation: Bitwise NOT operator, Bitwise shift operators, Binary bitwise operators
{{SpecName('ES6', '#sec-bitwise-shift-operators')}}{{Spec2('ES6')}}Definiert in verschiedenen Abschnitten der Spezifikation: Bitwise NOT operator, Bitwise shift operators, Binary bitwise operators
{{SpecName('ESDraft', '#sec-bitwise-shift-operators')}}{{Spec2('ESDraft')}}Definiert in verschiedenen Abschnitten der Spezifikation: Bitwise NOT operator, Bitwise shift operators, Binary bitwise operators
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.operators.bitwise")}}

+ +

Siehe auch

+ + diff --git a/files/de/conflicting/web/javascript/reference/operators/spread_syntax/index.html b/files/de/conflicting/web/javascript/reference/operators/spread_syntax/index.html new file mode 100644 index 0000000000..ee125663f4 --- /dev/null +++ b/files/de/conflicting/web/javascript/reference/operators/spread_syntax/index.html @@ -0,0 +1,220 @@ +--- +title: Spread-Operator +slug: Web/JavaScript/Reference/Operators/Spread_operator +tags: + - ECMAScript 2015 + - Iterator + - JavaScript + - Operator +translation_of: Web/JavaScript/Reference/Operators/Spread_syntax +translation_of_original: Web/JavaScript/Reference/Operators/Spread_operator +--- +
{{jsSidebar("Operators")}}
+ +

Mit der Spread-Syntax kann ein einzelner Ausdruck dort expandiert werden, wo mehrere Argumente (bei Funktionsaufrufen), mehrere Elemente (für Array-Literale) oder mehrere Variablen (für destrukturierende Anweisungen) erwartet werden.

+ +

Syntax

+ +

Für Funktionsaufrufe:

+ +
myFunction(...iterableObj);
+
+ +

Für Array-Literale:

+ +
[...iterableObj, 4, 5, 6]
+ +

Beispiele

+ +

Ein besseres "apply"

+ +

Beispiel: Für gewöhnlich wird {{jsxref( "Function.prototype.apply")}} verwendet, wenn man die Elemente eines Arrays als Argumente eines Funktionsaufrufs nutzen möchte:

+ +
function myFunction(x, y, z) { }
+var args = [0, 1, 2];
+myFunction.apply(null, args);
+ +

Mit dem ES2015 Spread-Operator kann das nun wie folgt geschrieben werden:

+ +
function myFunction(x, y, z) { }
+var args = [0, 1, 2];
+myFunction(...args);
+ +

Die Spread-Syntax kann für jedes beliebige Argument der Argumentliste verwendet werden, und sie kann auch mehrmals verwendet werden:

+ +
function myFunction(v, w, x, y, z) { }
+var args = [0, 1];
+myFunction(-1, ...args, 2, ...[3]);
+ +

Ein mächtigeres Array-Literal

+ +

Beispiel: Wenn man ohne den Spread-Operator ein neues Array erstellen will, bei dem ein Teil davon ein bereits bestehendes Array sein soll, dann ist die Array-Literal-Syntax nicht mehr ausreichend und man muss auf imperative Programmierung mit einer Kombination aus push, splice, concat, etc. zurückgreifen. Mit der Spread-Syntax jedoch kann das viel prägnanter ausgedrückt werden:

+ +
var parts = ['shoulders', 'knees'];
+var lyrics = ['head', ...parts, 'and', 'toes']; // ["head", "shoulders", "knees", "and", "toes"]
+
+ +

Genau wie der Spread-Operator für Argumentlisten kann ... überall im Array-Literal verwendet werden, auch mehrmals.

+ +

"Apply" für "new"

+ +

Beispiel: In ES5 kann new nicht mit apply kombiniert werden (nach den ES5-Regeln führt apply einen [[Call]] aus, keinen [[Construct]]). Die Spread-Syntax von ES2015 unterstützt dies auf ganz natürliche Weise:

+ +
var dateFields = readDateFields(database);
+var d = new Date(...dateFields);
+ +

Ein Array kopieren

+ +
var arr = [1,2,3];
+var arr2 = [...arr]; // wie arr.slice()
+arr2.push(4);        // arr2 wird [1,2,3,4], arr bleibt unverändert.
+ +

Ein besseres "push"

+ +

Beispiel: {{jsxref("Global_Objects/Array/push", "push")}} wird oft verwendet um alle Elemente eines Arrays an das Ende eines bestehenden Arrays anzuhängen. Das wird in ES5 oft wie folgt umgesetzt:

+ +
var arr1 = [0, 1, 2];
+var arr2 = [3, 4, 5];
+// Append all items from arr2 onto arr1
+Array.prototype.push.apply(arr1, arr2);
+ +

Mit dem Spread-Operator von ES2015 wird daraus:

+ +
var arr1 = [0, 1, 2];
+var arr2 = [3, 4, 5];
+arr1.push(...arr2);
+ +

Nur "apply" für iterables

+ +
var obj = {"key1":"value1"};
+function myFunction(x) {
+    console.log(x) // undefined
+}
+myFunction(...obj);
+var args = [...obj];
+console.log(args, args.length); // [] 0
+ +

Rest-Syntax (Parameter)

+ +

Rest-Syntax sieht genauso aus wie die Spread-Syntax und wird für das Destrukturieren von Arrays und Objekten eingesetzt. Rest-Syntax ist sozusagen das Gegenteil von Spread-Syntax:  Spread klappt die einzelnen Bestandteile eines Arrays aus, während Rest verschiedene einzelne Elemente zu einem Array zusammenfasst.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-array-initializer')}}{{Spec2('ES2015')}}Definiert in verschiedenen Abschnitten der Spezifikation: Array Initializer, Argument Lists
{{SpecName('ESDraft', '#sec-array-initializer')}}{{Spec2('ESDraft')}} 
+ +

Browser-Kompatibilität

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Spread-Operation innerhalb von Array-Literalen{{CompatChrome("46")}}{{CompatGeckoDesktop("16")}}{{CompatIE("Edge")}}{{CompatNo}}7.1
Spread-Operation innerhalb von Funktionsaufrufen{{CompatChrome("46")}}{{CompatGeckoDesktop("27")}}{{CompatIE("Edge")}}{{CompatNo}}7.1
Spread-Operation beim Destrukturieren ("destructuring"){{CompatChrome("49")}}{{CompatGeckoDesktop("34")}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidAndroid WebviewFirefox Mobile (Gecko)IE MobileOpera MobileSafari MobileChrome for Android
Spread-Operation innerhalb von Array-Literalen{{CompatNo}}{{CompatChrome("46")}}{{CompatGeckoMobile("16")}}{{CompatNo}}{{CompatNo}}8{{CompatChrome("46")}}
Spread-Operation innerhalb von Funktionsaufrufen{{CompatNo}}{{CompatChrome("46")}}{{CompatGeckoMobile("27")}}{{CompatNo}}{{CompatNo}}8{{CompatChrome("46")}}
Spread-Operation beim Destrukturieren ("destructuring"){{CompatNo}}{{CompatNo}}{{CompatGeckoDesktop("34")}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatNo}}
+
+ +

Siehe auch

+ + -- cgit v1.2.3-54-g00ecf