From 4b1a9203c547c019fc5398082ae19a3f3d4c3efe Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:15 -0500 Subject: initial commit --- .../global_objects/array/@@iterator/index.html | 89 ++++ .../global_objects/array/@@species/index.html | 76 +++ .../global_objects/array/@@unscopables/index.html | 76 +++ .../global_objects/array/concat/index.html | 156 ++++++ .../global_objects/array/copywithin/index.html | 187 +++++++ .../global_objects/array/entries/index.html | 84 +++ .../global_objects/array/every/index.html | 195 +++++++ .../reference/global_objects/array/fill/index.html | 155 ++++++ .../global_objects/array/filter/index.html | 235 +++++++++ .../reference/global_objects/array/find/index.html | 243 +++++++++ .../global_objects/array/findindex/index.html | 189 +++++++ .../reference/global_objects/array/flat/index.html | 116 +++++ .../global_objects/array/flatmap/index.html | 117 +++++ .../global_objects/array/foreach/index.html | 303 +++++++++++ .../reference/global_objects/array/from/index.html | 227 +++++++++ .../global_objects/array/includes/index.html | 181 +++++++ .../reference/global_objects/array/index.html | 460 +++++++++++++++++ .../global_objects/array/indexof/index.html | 226 +++++++++ .../global_objects/array/isarray/index.html | 121 +++++ .../reference/global_objects/array/join/index.html | 114 +++++ .../reference/global_objects/array/keys/index.html | 76 +++ .../global_objects/array/lastindexof/index.html | 168 ++++++ .../global_objects/array/length/index.html | 149 ++++++ .../reference/global_objects/array/map/index.html | 337 ++++++++++++ .../global_objects/array/observe/index.html | 91 ++++ .../reference/global_objects/array/of/index.html | 102 ++++ .../reference/global_objects/array/pop/index.html | 98 ++++ .../global_objects/array/prototypen/index.html | 183 +++++++ .../reference/global_objects/array/push/index.html | 141 ++++++ .../global_objects/array/reduce/index.html | 564 +++++++++++++++++++++ .../global_objects/array/reduceright/index.html | 334 ++++++++++++ .../global_objects/array/reverse/index.html | 92 ++++ .../global_objects/array/shift/index.html | 111 ++++ .../global_objects/array/slice/index.html | 244 +++++++++ .../reference/global_objects/array/some/index.html | 209 ++++++++ .../reference/global_objects/array/sort/index.html | 264 ++++++++++ .../global_objects/array/splice/index.html | 162 ++++++ .../global_objects/array/tolocalestring/index.html | 183 +++++++ .../global_objects/array/tosource/index.html | 69 +++ .../global_objects/array/tostring/index.html | 80 +++ .../global_objects/array/unobserve/index.html | 88 ++++ .../global_objects/array/unshift/index.html | 99 ++++ .../global_objects/array/values/index.html | 86 ++++ 43 files changed, 7480 insertions(+) create mode 100644 files/de/web/javascript/reference/global_objects/array/@@iterator/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/@@species/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/@@unscopables/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/concat/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/copywithin/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/entries/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/every/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/fill/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/filter/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/find/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/findindex/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/flat/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/flatmap/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/foreach/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/from/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/includes/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/indexof/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/isarray/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/join/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/keys/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/lastindexof/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/length/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/map/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/observe/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/of/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/pop/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/prototypen/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/push/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/reduce/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/reduceright/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/reverse/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/shift/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/slice/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/some/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/sort/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/splice/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/tolocalestring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/tosource/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/tostring/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/unobserve/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/unshift/index.html create mode 100644 files/de/web/javascript/reference/global_objects/array/values/index.html (limited to 'files/de/web/javascript/reference/global_objects/array') diff --git a/files/de/web/javascript/reference/global_objects/array/@@iterator/index.html b/files/de/web/javascript/reference/global_objects/array/@@iterator/index.html new file mode 100644 index 0000000000..790a7abcff --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/@@iterator/index.html @@ -0,0 +1,89 @@ +--- +title: 'Array.prototype[@@iterator]()' +slug: Web/JavaScript/Reference/Global_Objects/Array/@@iterator +tags: + - Array + - ECMAScript 2015 + - Iterator + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/@@iterator +--- +
{{JSRef}}
+ +
Der Initialwert der @@iterator Eigenschaft ist das selbe Funktionsobjekt wie der Initialwert der {{jsxref("Array.prototype.values()", "values()")}} Eigenschaft.
+ +

Syntax

+ +
arr[Symbol.iterator]()
+ +

Rückgabewert

+ +

Der Initialwert für den {{jsxref("Array.prototype.values()", "values()")}} Iterator. Im Standardfall gibt arr[Symbol.iterator] die Funktion von {{jsxref("Array.prototype.values()", "values()")}}  zurück.

+ +

Beispiele

+ +

Iterieren mit einer for...of Schleife

+ +
var arr = ['w', 'y', 'k', 'o', 'p'];
+var eArr = arr[Symbol.iterator]();
+// your browser must support for..of loop
+// and let-scoped variables in for loops
+for (let letter of eArr) {
+  console.log(letter);
+}
+
+ +

Alternative Iteration

+ +
var arr = ['w', 'y', 'k', 'o', 'p'];
+var eArr = arr[Symbol.iterator]();
+console.log(eArr.next().value); // w
+console.log(eArr.next().value); // y
+console.log(eArr.next().value); // k
+console.log(eArr.next().value); // o
+console.log(eArr.next().value); // p
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-array.prototype-@@iterator', 'Array.prototype[@@iterator]()')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype-@@iterator', 'Array.prototype[@@iterator]()')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.@@iterator")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/@@species/index.html b/files/de/web/javascript/reference/global_objects/array/@@species/index.html new file mode 100644 index 0000000000..c4de8a7978 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/@@species/index.html @@ -0,0 +1,76 @@ +--- +title: 'get Array[@@species]' +slug: Web/JavaScript/Reference/Global_Objects/Array/@@species +tags: + - Array + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/@@species +--- +
{{JSRef}}
+ +

Die Array[@@species] Zugriffseigenschaft gibt den Array Konstruktor zurück.

+ +

Syntax

+ +
Array[Symbol.species]
+
+ +

Rückgabewert

+ +

Der {{jsxref("Array")}} Konstruktor.

+ +

Beschreibung

+ +

Die species Zugriffseigenschaft gibt den Standard-Konstruktor des Array Objekts zurück. Unterklassen können die Zuweisung Überschreiben, um die Konstruktorzuweisung ändern.

+ +

Beispiele

+ +

Die species Eigenschaft gibt die Standard-Konstruktor-Funktion, welches der Array Konstruktor für Array Objekte ist.

+ +
Array[Symbol.species]; // function Array()
+ +

In einem abgeleiteten Collection Objekt (z. B. ein benutzerdefiniertes Array MyArray), ist der MyArray der species des MyArray Konstruktors. Manchmal möchte man in abgeleiteten Klassenden Oberklassenkonstruktor zurückgeben. Dieses kann mit Überschreiben erreicht werden:

+ +
class MyArray extends Array {
+  // Overwrite MyArray species to the parent Array constructor
+  static get [Symbol.species]() { return Array; }
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-get-array-@@species', 'get Array [ @@species ]')}}{{Spec2('ES6')}}Initial Definition.
{{SpecName('ESDraft', '#sec-get-array-@@species', 'get Array [ @@species ]')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.@@species")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/@@unscopables/index.html b/files/de/web/javascript/reference/global_objects/array/@@unscopables/index.html new file mode 100644 index 0000000000..2cb4b51b11 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/@@unscopables/index.html @@ -0,0 +1,76 @@ +--- +title: 'Array.prototype[@@unscopables]' +slug: Web/JavaScript/Reference/Global_Objects/Array/@@unscopables +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Property + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/@@unscopables +--- +
{{JSRef}}
+ +

Die @@unscopable Symbol Eigenschaft enthält Namen von Eigenschaften, welche vor der ES2015 Version nicht im ECMAScript Standard waren. Diese Eigenschaften werden bei with Statement Bindungen ignoriert.

+ +

Syntax

+ +
arr[Symbol.unscopables]
+ +

Beschreibung

+ +

Der Standard Array Eigenschaften, die von den with Bindungen ausgenommen werden, sind: copyWithin, entries, fill, find, findIndex, includes, keys, und values.

+ +

Siehe {{jsxref("Symbol.unscopables")}} für das setzten von unscopables für eigene Objekte

+ +

{{js_property_attributes(0,0,1)}}

+ +

Beispiele

+ +

Der Folgende Quelltext funktioniert in ES5 und niedriger. Jedoch wurde in ECMAScript 2015 und Später die {{jsxref("Array.prototype.keys()")}} eingeführt. Das bedeutet, dass in with Umgebungen "keys" jetzt eine Methode und keine Variable ist. Hier kommt die eingebaute @@unscopables Array.prototype[@@unscopables] Symboleigenschaft ins Spiel und verhindert, dass einige der Array Methoden in einer with Anweisung gescoped werden.

+ +
var keys = [];
+
+with (Array.prototype) {
+  keys.push('something');
+}
+
+Object.keys(Array.prototype[Symbol.unscopables]);
+// ["copyWithin", "entries", "fill", "find", "findIndex",
+//  "includes", "keys", "values"]
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKomment
{{SpecName('ES2015', '#sec-array.prototype-@@unscopables', 'Array.prototype[@@unscopables]')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype-@@unscopables', 'Array.prototype[@@unscopables]')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.@@unscopables")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/concat/index.html b/files/de/web/javascript/reference/global_objects/array/concat/index.html new file mode 100644 index 0000000000..6bd46675da --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/concat/index.html @@ -0,0 +1,156 @@ +--- +title: Array.prototype.concat() +slug: Web/JavaScript/Reference/Global_Objects/Array/concat +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/concat +--- +
{{JSRef}}
+ +

Die Methode concat() führt zwei oder mehr Arrays zu einem zusammen. Die Methode ändert nicht die existierenden Arrays, sondern gibt stattdessen ein neues zurück.

+ +
{{EmbedInteractiveExample("pages/js/array-concat.html")}}
+ + + +

Syntax

+ +
var new_array = old_array.concat(value1[, value2[, ...[, valueN]]])
+ +

Parameter

+ +
+
valueN
+
Arrays und/oder Werte, die mit dem aktuellen zu einem neuen Array zusammenführt werden sollen.
+
+ +

Rückgabewert

+ +

Eine neue {{jsxref("Array")}} Instanz.

+ +

Beschreibung

+ +

concat generiert ein neues Array. Dieses besteht aus den Elementen des Arrays, auf dem diese Methode aufgerufen wurde, gefolgt von dem Element oder den Elementen, die als Argument übergeben wurden.

+ +

Die concat Methode verändert nicht das this Objekt oder eines der übergebenen Argumente, sondern gibt eine flache Kopie (shallow copy) zurück, die Kopien der Elemente in den ursprünglichen Arrays enthält. Elemente der ursprünglichen Arrays werden folgendermaßen in das neue Array kopiert:

+ + + +
+

Anmerkung: Die Zusammenführung von Arrays und Werten verändert die Ausgangswerte und -objekte nicht. Etwaige weitere Operationen auf dem neuen Array (nur wenn Elemente keine Objekt-Referenz sind) haben keine Auswirkungen auf die Ausgangsarrays und umgekehrt.

+
+ +

Beispiele

+ +

Zusammenführen zweier Arrays

+ +

Der folgende Quellcode führt zwei Arrays zusammen:

+ +
var alpha = ['a', 'b', 'c'],;
+var numeric = [1, 2, 3];
+
+alpha.concat(numeric);
+// Result: ['a', 'b', 'c', 1, 2, 3]
+
+ +

Zusammenführen von drei Arrays

+ +

Der folgende Quellcode führt drei Arrays zusammen:

+ +
var num1 = [1, 2, 3],
+    num2 = [4, 5, 6],
+    num3 = [7, 8, 9];
+
+var nums = num1.concat(num2, num3);
+
+console.log(nums);
+// Result: [1, 2, 3, 4, 5, 6, 7, 8, 9]
+
+ +

Zusammenführen von Werten in ein Array

+ +

Der folgende Quellcode führt drei Werte in ein Array zusammen:

+ +
var alpha = ['a', 'b', 'c'];
+
+var alphaNumeric = alpha.concat(1, [2, 3]);
+
+console.log(alphaNumeric);
+// Result: ['a', 'b', 'c', 1, 2, 3]
+
+ +

Zusammenführen von geschachtelten Arrays

+ +

Der folgende Quellcode führt inneinander geschachtelte Array zusammen und demonstriert die Erhaltung der Referenzen:

+ +
var num1 = [[1]];
+var num2 = [2, [3]];
+
+var nums = num1.concat(num2);
+
+console.log(nums);
+// result in [[1], 2, [3]]
+
+// modify the first element of num1
+num1[0].push(4);
+
+console.log(nums);
+// results in [[1, 4], 2, [3]];
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.4.4.4', 'Array.prototype.concat')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.concat', 'Array.prototype.concat')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.concat', 'Array.prototype.concat')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.concat")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/copywithin/index.html b/files/de/web/javascript/reference/global_objects/array/copywithin/index.html new file mode 100644 index 0000000000..6a7e9391d6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/copywithin/index.html @@ -0,0 +1,187 @@ +--- +title: Array.prototype.copyWithin() +slug: Web/JavaScript/Reference/Global_Objects/Array/copyWithin +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Method + - Prototype + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/copyWithin +--- +
{{JSRef}}
+ +

Die copyWithin() Methode kopiert einen Teil eines Arrays in eine andere Stelle des gleichen Arrays und gibt das Array zurück, ohne die Länge des Arrays zu verändern.

+ +
{{EmbedInteractiveExample("pages/js/array-copywithin.html")}}
+ + + +

Syntax

+ +
arr.copyWithin(target)
+arr.copyWithin(target, start)
+arr.copyWithin(target, start, end)
+ +

Parameter

+ +
+
target
+
Null-Basierter Index an dem die kopierte Sequenz kopiert wird. Wenn target negativ ist, wird vom Ende angefangen zu zählen.
+
Wenn target glößer oder gleich arr.length ist, wird nicht kopiert. Wenn target nach start positioniert ist, wird die kopierte Sequenz gekürzt, um in die Länge des Arrays zu passen.
+
start {{optional_inline}}
+
Null-Basierter Index an dem das Kopieren begonnen werden soll. Wenn start negativ ist, wird vom Ende angefangen zu zählen.
+
Wenn start nicht angegeben wird, nutzt copyWithin den Standardwert 0.
+
end {{optional_inline}}
+
Null-Basierter Index an dem das Kopieren beendet werden soll. end ist exklusiv und wird deswegen nicht mitkopiert. Wenn end negativ ist, wird vom Ende angefangen zu zählen.
+
Wenn end nicht angegeben wird, nutzt copyWithin den Standardwert arr.length.
+
+ +

Rückgabewert

+ +

Das geänderte Array

+ +

Beschreibung

+ +

copyWithin arbeitet wie die memcpy Funktion in C und C++ und ist eine hoch perfomante Methode zum Verschieben von Daten in einem {{jsxref("Array")}} oder {{jsxref("TypedArray")}}. Die Sequenz wird in einer Operation kopiert und eingefügt; Die eingefügte Sequenz wird den kopierten Wert haben, auch wenn sich die Regionen im Array überschneiden.

+ +

Die copyWithin Funktion ist absichtlich generisch. Es wird nicht vorausgesetzt, dass this ein {{jsxref("Array")}} Objekt ist.

+ +

Die copyWithin Methode ist eine veränderbare Methode. Sie ändert nichts an der Länge von this, aber sie ändert den Inhalt von this und erstellt neue Eigenschaften, wenn es notwendig ist.

+ +

Beispiele

+ +
[1, 2, 3, 4, 5].copyWithin(-2);
+// [1, 2, 3, 1, 2]
+
+[1, 2, 3, 4, 5].copyWithin(0, 3);
+// [4, 5, 3, 4, 5]
+
+[1, 2, 3, 4, 5].copyWithin(0, 3, 4);
+// [4, 2, 3, 4, 5]
+
+[1, 2, 3, 4, 5].copyWithin(-2, -3, -1);
+// [1, 2, 3, 3, 5]
+
+[].copyWithin.call({length: 5, 3: 1}, 0, 3);
+// {0: 1, 3: 1, length: 5}
+
+// ES2015 Typed-Arrays sind Unterklassen von Array
+var i32a = new Int32Array([1, 2, 3, 4, 5]);
+
+i32a.copyWithin(0, 2);
+// Int32Array [3, 4, 5, 4, 5]
+
+// Für Plattformen die noch nicht ES6 unterstützen:
+[].copyWithin.call(new Int32Array([1, 2, 3, 4, 5]), 0, 3, 4);
+// Int32Array [4, 2, 3, 4, 5]
+
+ +

Polyfill

+ +
if (!Array.prototype.copyWithin) {
+  Array.prototype.copyWithin = function(target, start/*, end*/) {
+    // Steps 1-2.
+    if (this == null) {
+      throw new TypeError('this is null or not defined');
+    }
+
+    var O = Object(this);
+
+    // Steps 3-5.
+    var len = O.length >>> 0;
+
+    // Steps 6-8.
+    var relativeTarget = target >> 0;
+
+    var to = relativeTarget < 0 ?
+      Math.max(len + relativeTarget, 0) :
+      Math.min(relativeTarget, len);
+
+    // Steps 9-11.
+    var relativeStart = start >> 0;
+
+    var from = relativeStart < 0 ?
+      Math.max(len + relativeStart, 0) :
+      Math.min(relativeStart, len);
+
+    // Steps 12-14.
+    var end = arguments[2];
+    var relativeEnd = end === undefined ? len : end >> 0;
+
+    var final = relativeEnd < 0 ?
+      Math.max(len + relativeEnd, 0) :
+      Math.min(relativeEnd, len);
+
+    // Step 15.
+    var count = Math.min(final - from, len - to);
+
+    // Steps 16-17.
+    var direction = 1;
+
+    if (from < to && to < (from + count)) {
+      direction = -1;
+      from += count - 1;
+      to += count - 1;
+    }
+
+    // Step 18.
+    while (count > 0) {
+      if (from in O) {
+        O[to] = O[from];
+      } else {
+        delete O[to];
+      }
+
+      from += direction;
+      to += direction;
+      count--;
+    }
+
+    // Step 19.
+    return O;
+  };
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-array.prototype.copywithin', 'Array.prototype.copyWithin')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ES2016', '#sec-array.prototype.copywithin', 'Array.prototype.copyWithin')}}{{Spec2('ES2016')}} 
{{SpecName('ESDraft', '#sec-array.prototype.copywithin', 'Array.prototype.copyWithin')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.copyWithin")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/entries/index.html b/files/de/web/javascript/reference/global_objects/array/entries/index.html new file mode 100644 index 0000000000..2bd4fb9942 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/entries/index.html @@ -0,0 +1,84 @@ +--- +title: Array.prototype.entries() +slug: Web/JavaScript/Reference/Global_Objects/Array/entries +tags: + - Array + - ECMAScript 2015 + - Iterator + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/entries +--- +
{{JSRef}}
+ +

Die entries() Methode gibt ein neues Array Iterator Objekt zurück, das Schlüssel-Wert-Paare für jeden Index im Array enthält.

+ +
{{EmbedInteractiveExample("pages/js/array-entries.html")}}
+ + + +

Syntax

+ +
arr.entries()
+ +

Rückgabewert

+ +

Ein neues {{jsxref("Array")}}-iterator Objekt.

+ +

Beispiele

+ +

Einsatz einer for…of Schleife

+ +
var a = ['a', 'b', 'c'];
+var iterator = a.entries();
+
+for (let e of iterator) {
+  console.log(e);
+}
+// [0, 'a']
+// [1, 'b']
+// [2, 'c']
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-array.prototype.entries', 'Array.prototype.entries')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype.entries', 'Array.prototype.entries')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.entries")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/every/index.html b/files/de/web/javascript/reference/global_objects/array/every/index.html new file mode 100644 index 0000000000..a29a0e4e0c --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/every/index.html @@ -0,0 +1,195 @@ +--- +title: Array.prototype.every() +slug: Web/JavaScript/Reference/Global_Objects/Array/every +tags: + - Array + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/every +--- +
{{JSRef}}
+ +

Die every() Methode testet ob alle Elemente in einem Array einen Test bestehen, welcher mittels einer implementierten Funktion bereitgestellt wird.

+ +
+

Hinweis: Diese Methode gibt true für jede Bedingung bei einem leeren Array zurück.

+
+ +
{{EmbedInteractiveExample("pages/js/array-every.html")}}
+ + + +

Syntax

+ +
arr.every(callback[, thisArg])
+ +

Parameter

+ +
+
callback
+
Funktion welche jedes Element testet, mit drei Argumenten: +
+
currentValue (required)
+
Der aktuelle Wert des Arrays.
+
index{{Optional_inline}}
+
Der Index des aktuellen Elementes im Array.
+
array{{Optional_inline}}
+
Das Array auf welchem every aufgerufen wurde.
+
+
+
thisArg{{Optional_inline}}
+
Optional. Wert welcher als this in der callback Funktion benutzt wird.
+
+ +

Rückgabewert

+ +

true wenn die callback-Funktion einen {{Glossary("truthy")}} Wert für jedes Array-Element zurückgibt, andernfalls false.

+ +

Beschreibung

+ +

Die every Methode führt die übergebene callback Funktion für jedes Element in dem Array aus, solange die callback Funktion keinen {{Glossary("falsy")}} Wert zurückgibt. Wenn ein solches Element gefunden wird gibt die every Methode false zurück. Anderfalls, wenn callback für jedes Element einen {{Glossary("truthy")}} Wert zurück gibt, gibt die Funktion every true zurück. Die callback Funktion wird nur für Indizes im Array aufgerufen, denen ein Wert zugewiesen wurde; sie wird nicht aufgerufen für Indizes, die gelöscht wurden, oder welche, die nie beschrieben wurden.

+ +

Die callback Funktion wird mit drei Argumenten aufgerufen: Der Wert eines Elements, der Index des Elements und Array auf dem every aufgerufen wurde.

+ +

Wenn der thisArg Parameter von every angegeben wird, wird auf diesem Objekt die callback Funktion aufgerufen und dieses Objekt kann mit this aufgerufen werden. Anderfalls wird der Wert undefined für den Einsatz von this übergeben. Der this Wert ist nur in der callback Funktion verfügbar und wird nach den normalen Regeln für das ermitteln von this für die Funktion ermittelt.

+ +

Die every Funktion verändert nicht die Werte des Arrays, auf dem sie aufgerufen wird.

+ +

Die Anzahl der von every abzuarbeitenden Elemente wird vor dem ersten Aufruf von callback ermittelt. Elemente welche nach dem Aufruf von every angehängt werden, werden nicht von der callback Funktion besucht. Wenn existierende Element eines Arrays geändert werden, wird der callback Funktion der Wert übergeben, der zu dem Zeitpunkt des Aufrufens von callback im Array steht. Werte die gelöscht werden, werden nicht besucht.

+ +

every Arbeitet wie ein Allquantor in der Mathematik. Wenn das Array leer ist, gibt er true zurück. (Es ist wahr, dass alle Elemente einer leeren Menge immer alle Bedingungen erfüllen.)

+ +

Beispiele

+ +

Größe aller Arrayelemente abprüfen

+ +

Das folgende Beispiel testet, ob alle Elemente in einem Array größer oder gleich 10 sind.

+ +
function isBigEnough(element, index, array) {
+  return element >= 10;
+}
+[12, 5, 8, 130, 44].every(isBigEnough);   // false
+[12, 54, 18, 130, 44].every(isBigEnough); // true
+
+ +

Einsatz von arrow Funktionen

+ +

Arrow Funktionen unterstützen eine kürzere Syntax für den gleichen Test.

+ +
[12, 5, 8, 130, 44].every(elem => elem >= 10); // false
+[12, 54, 18, 130, 44].every(elem => elem >= 10); // true
+ +

Polyfill

+ +

every wurde im ECMA-262 Standard in der 5. Auflage hinzugefügt. Es kann sein, dass diese Funktion in anderer Implementierungen des Standards nicht vorkommt. Man dieses beheben, indem man den folgenden Quelltext an den Anfang eines Programms hinzufügt. Dadurch wird die every Funktion dort hinzugefügt, wo sie nicht nativ unterstützt wird. Der Algorithmus ist exakt der aus der 5. Auflage des ECMA-262 Standards, mit der Voraussetzung, dass Object und TypeError ihre originalen Werte haben und dass callbackfn.call die originale Funktion {{jsxref("Function.prototype.call")}} aufrufen kann.

+ +
if (!Array.prototype.every) {
+  Array.prototype.every = function(callbackfn, thisArg) {
+    'use strict';
+    var T, k;
+
+    if (this == null) {
+      throw new TypeError('this is null or not defined');
+    }
+
+    // 1. Let O be the result of calling ToObject passing the this
+    //    value as the argument.
+    var O = Object(this);
+
+    // 2. Let lenValue be the result of calling the Get internal method
+    //    of O with the argument "length".
+    // 3. Let len be ToUint32(lenValue).
+    var len = O.length >>> 0;
+
+    // 4. If IsCallable(callbackfn) is false, throw a TypeError exception.
+    if (typeof callbackfn !== 'function') {
+      throw new TypeError();
+    }
+
+    // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
+    if (arguments.length > 1) {
+      T = thisArg;
+    }
+
+    // 6. Let k be 0.
+    k = 0;
+
+    // 7. Repeat, while k < len
+    while (k < len) {
+
+      var kValue;
+
+      // a. Let Pk be ToString(k).
+      //   This is implicit for LHS operands of the in operator
+      // b. Let kPresent be the result of calling the HasProperty internal
+      //    method of O with argument Pk.
+      //   This step can be combined with c
+      // c. If kPresent is true, then
+      if (k in O) {
+
+        // i. Let kValue be the result of calling the Get internal method
+        //    of O with argument Pk.
+        kValue = O[k];
+
+        // ii. Let testResult be the result of calling the Call internal method
+        //     of callbackfn with T as the this value and argument list
+        //     containing kValue, k, and O.
+        var testResult = callbackfn.call(T, kValue, k, O);
+
+        // iii. If ToBoolean(testResult) is false, return false.
+        if (!testResult) {
+          return false;
+        }
+      }
+      k++;
+    }
+    return true;
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.16', 'Array.prototype.every')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.6.
{{SpecName('ES6', '#sec-array.prototype.every', 'Array.prototype.every')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.every', 'Array.prototype.every')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.every")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/fill/index.html b/files/de/web/javascript/reference/global_objects/array/fill/index.html new file mode 100644 index 0000000000..5f4821e986 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/fill/index.html @@ -0,0 +1,155 @@ +--- +title: Array.prototype.fill() +slug: Web/JavaScript/Reference/Global_Objects/Array/fill +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Method + - Prototype + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/fill +--- +
{{JSRef}}
+ +

Die fill() Methode befüllt ein Array mit einem statischen Wert von einem Startindex bis zu einem Endindex. Der Endindex wird nicht mit eingeschlossen.

+ +
{{EmbedInteractiveExample("pages/js/array-fill.html")}}
+ + + +

Syntax

+ +
arr.fill(value[, start[, end]])
+ +

Parameter

+ +
+
value
+
Wert, mit dem ein Array gefüllt werden soll.
+
start {{optional_inline}}
+
Startindex, Standardwert ist 0.
+
end {{optional_inline}}
+
Endindex, Standardwert ist this.length.
+
+ +

Rückgabewert

+ +

Das geänderte Array.

+ +

Beschreibung

+ +

Die fill Methode nimmt bis zu drei Argumente entgegen: value, start und end. Die Argumente start und end sind optional und haben als Standardwert 0 und length des this Objektes.

+ +

Wenn start negativ ist, wird stattdessen length+start benutzt, wobei length die Länge des Arrays ist. Wenn end negativ ist, wird stattdessen length+end benutzt.

+ +

Die fill Funktion ist absichtlich generisch. Es ist nicht nötig, dass der this Wert ein Array Objekt ist.

+ +

Die fill Methode ist eine verändernde Methode. Sie verändert das this Objekt selbst und gibt dieses zurück. Sie erstellt keine Kopie des Objektes.

+ +

Wenn der fill Methode ein Objekt übergeben wird, wird das Objekt kopiert und die Referenz der Kopie wird im Array eingesetzt.

+ +

Beispiele

+ +
[1, 2, 3].fill(4);               // [4, 4, 4]
+[1, 2, 3].fill(4, 1);            // [1, 4, 4]
+[1, 2, 3].fill(4, 1, 2);         // [1, 4, 3]
+[1, 2, 3].fill(4, 1, 1);         // [1, 2, 3]
+[1, 2, 3].fill(4, 3, 3);         // [1, 2, 3]
+[1, 2, 3].fill(4, -3, -2);       // [4, 2, 3]
+[1, 2, 3].fill(4, NaN, NaN);     // [1, 2, 3]
+[1, 2, 3].fill(4, 3, 5);         // [1, 2, 3]
+Array(3).fill(4);                // [4, 4, 4]
+[].fill.call({ length: 3 }, 4);  // {0: 4, 1: 4, 2: 4, length: 3}
+
+// Objects by reference.
+var arr = Array(3).fill({}) // [{}, {}, {}];
+arr[0].hi = "hi"; // [{ hi: "hi" }, { hi: "hi" }, { hi: "hi" }]
+
+ +

Polyfill

+ +
if (!Array.prototype.fill) {
+  Object.defineProperty(Array.prototype, 'fill', {
+    value: function(value) {
+
+      // Steps 1-2.
+      if (this == null) {
+        throw new TypeError('this is null or not defined');
+      }
+
+      var O = Object(this);
+
+      // Steps 3-5.
+      var len = O.length >>> 0;
+
+      // Steps 6-7.
+      var start = arguments[1];
+      var relativeStart = start >> 0;
+
+      // Step 8.
+      var k = relativeStart < 0 ?
+        Math.max(len + relativeStart, 0) :
+        Math.min(relativeStart, len);
+
+      // Steps 9-10.
+      var end = arguments[2];
+      var relativeEnd = end === undefined ?
+        len : end >> 0;
+
+      // Step 11.
+      var final = relativeEnd < 0 ?
+        Math.max(len + relativeEnd, 0) :
+        Math.min(relativeEnd, len);
+
+      // Step 12.
+      while (k < final) {
+        O[k] = value;
+        k++;
+      }
+
+      // Step 13.
+      return O;
+    }
+  });
+}
+
+ +

Wenn es wirklich notwendig ist veraltete JavaScript-Umgebungen zu unterstützen, die Object.defineProperty nicht unterstützen, ist es meistens besser Methoden von Array.prototype nicht mit einem Polyfill zu unterstützen, weil sie nicht als nicht-aufzählbar eingestellt werden können.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-array.prototype.fill', 'Array.prototype.fill')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype.fill', 'Array.prototype.fill')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.fill")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/filter/index.html b/files/de/web/javascript/reference/global_objects/array/filter/index.html new file mode 100644 index 0000000000..6f1ee08498 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/filter/index.html @@ -0,0 +1,235 @@ +--- +title: Array.prototype.filter() +slug: Web/JavaScript/Reference/Global_Objects/Array/filter +tags: + - Array + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - Reference + - filter + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/filter +--- +
{{JSRef}}
+ +

filter() erstellt ein neues Array mit allen Elementen, die den von der bereitgestellten Funktion implementierten Test bestehen.

+ +
{{EmbedInteractiveExample("pages/js/array-filter.html")}}
+ + + +

Syntax

+ +
let newArray = arr.filter(callback(element[, index[, array]])[, thisArg])
+ +

Parameter

+ +
+
callback
+
Eine Funktion, um jedes Element des Arrays zu testen. Die Funktion gibt true zurück, um das Element zu behalten, ansonsten false.
+
+
+
element
+
Das aktuell zu testende Element aus dem Array.
+
index {{optional_inline}}
+
Der Index des aktuell zu testenden Elements aus dem Array.
+
array {{optional_inline}}
+
Das Array auf welchem filter aufgerufen wurde.
+
+
+
thisArg {{optional_inline}}
+
Wert, der als this innerhalb der Funktion genutzt wird.
+
+ +

Rückgabewert

+ +

Ein neues Array mit den Elementen, die den Test bestanden haben. Wenn kein Element den Test besteht, wird ein leeres Array zurückgegeben.

+ +

Beschreibung

+ +

filter() ruft eine bereitgestellte callback-Funktion einmal für jedes Element in einem Array auf und erstellt ein neues Array aller Werte, für die callback einen Wert zurückgibt der umgewandelt true ergibt. callback wird nur für Indizes des Arrays aufgerufen, denen Werte zugewiesen wurden. Es wird nicht für Indizes aufgerufen, die gelöscht oder denen nie Werte zugewiesen wurden. Array-Elemente, die den Test in callback nicht bestehen, werden einfach übersprungen und sind im neuen Array nicht enthalten.

+ +

callback wird mit drei Argumenten aufgerufen:

+ +
    +
  1. Der Wert des Elements
    2. +
  2. Der Index des Elements
    3. +
  3. Das Array-Objekt, das durchlaufen wird
    4. +
+ +

Falls der Parameter thisArg an filter übergeben wird, wird er als Wert für this innerhalb von callback verwendet. Andernfalls hat this den Wert {{jsxref("undefined")}}. Welchen Wert callback letztendlich in this sieht wird gemäß der üblichen Regeln bestimmt, nach denen this für eine Funktion ermittelt wird.

+ +

filter() selbst verändert das Array nicht, auf dem es aufgerufen wird.

+ +

Der Bereich der von filter() verarbeiteten Elemente wird vor dem ersten Aufruf von callback festgelegt. Elemente, die nach Beginn des Aufrufs von filter() an das Array angehängt werden, werden von callback nicht berücksichtigt. Wenn vorhandene Elemente des Arrays geändert werden, ist der Wert maßgeblich, den filter() beim Erreichen eines Elements antrifft und dann an callback übergibt. Nachfolgende Elemente, die nach Beginn eines Durchlaufs von filter() gelöscht werden, bevor sie eingelesen werden konnten, werden nicht mehr berücksichtigt.

+ +

Beispiele

+ +

Alle kleinen Werte herausfiltern

+ +

Das folgende Beispiel nutzt filter(), um ein gefiltertes Array zu erstellen, aus dem alle Element mit Werten kleiner als 10 entfernt werden.

+ +
function isBigEnough(value) {
+  return value >= 10;
+}
+
+let filtered = [12, 5, 8, 130, 44].filter(isBigEnough);
+// filtered is [12, 130, 44]
+
+ +

Filtern von ungültigen Werten aus JSON

+ +

Das folgende Beispiel nutzt filter(), um ein gefiltertes JSON zu erstellen, in welchem alle Elemente mit numerischer id ungleich null sind.

+ +
let arr = [
+  { id: 15 },
+  { id: -1 },
+  { id: 0 },
+  { id: 3 },
+  { id: 12.2 },
+  { },
+  { id: null },
+  { id: NaN },
+  { id: 'undefined' }
+];
+
+let invalidEntries = 0;
+
+function isNumber(obj) {
+  return obj !== undefined && typeof(obj) === 'number' && !isNaN(obj);
+}
+
+function filterByID(obj) {
+  if (isNumber(obj.id) && obj.id !== 0) {
+    return true;
+  }
+  invalidEntries++;
+  return false;
+}
+
+let arrByID = arr.filter(filterByID);
+
+console.log('Filtered Array\n', arrByID);
+// Filtered Array
+// [{ id: 15 }, { id: -1 }, { id: 3 }, { id: 12.2 }]
+
+console.log('Number of Invalid Entries = ', invalidEntries);
+// Number of Invalid Entries = 5
+
+ +

Suchen in Arrays

+ +

Das folgende Beispiel nutzt filter(), um ein Array gemäß eines Suchkriterius zu filtern.

+ +
let fruits = ['apple', 'banana', 'grapes', 'mango', 'orange'];
+
+/**
+ * Filter array items based on search criteria (query)
+ */
+function filterItems(arr, query) {
+  return arr.filter(function(el) {
+      return el.toLowerCase().indexOf(query.toLowerCase()) > -1;
+  })
+}
+
+console.log(filterItems(fruits, 'ap')); // ['apple', 'grapes']
+console.log(filterItems(fruits, 'an')); // ['banana', 'mango', 'orange']
+ +

ES2015 Implementierung

+ +
const fruits = ['apple', 'banana', 'grapes', 'mango', 'orange'];
+
+/**
+ * Filter array items based on search criteria (query)
+ */
+const filterItems = (arr, query) => {
+  return arr.filter(el => el.toLowerCase().indexOf(query.toLowerCase()) > -1);
+};
+
+console.log(filterItems(fruits, 'ap')); // ['apple', 'grapes']
+console.log(filterItems(fruits, 'an')); // ['banana', 'mango', 'orange']
+ +

Polyfill

+ +

filter() wurde dem ECMA-262-Standard in der 5. Auflage hinzugefügt. Als solches ist es möglicherweise nicht in allen Implementierungen des Standards enthalten. Sie können dies umgehen, indem Sie den folgenden Code am Anfang Ihrer Skripte einfügen, um die Verwendung von filter() in Implementierungen zu ermöglichen, die es nicht nativ unterstützen. Dieser Algorithmus entspricht dem in der 5. Auflage von ECMA-262 angegebenen Algorithmus, vorausgesetzt dass callback.call() mit dem ursprünglichen Wert von {{jsxref("Function.prototype.call()")}} auswertet wird und {{jsxref("Array.prototype.push()")}} seinen ursprünglichen Wert hat.

+ +
if (!Array.prototype.filter) {
+  Array.prototype.filter = function(func, thisArg) {
+    'use strict';
+    if ( ! ((typeof func === 'Function' || typeof func === 'function') && this) )
+        throw new TypeError();
+
+    let len = this.length >>> 0,
+        res = new Array(len), // preallocate array
+        t = this, c = 0, i = -1;
+    if (thisArg === undefined) {
+      while (++i !== len){
+        // checks to see if the key was set
+        if (i in this){
+          if (func(t[i], i, t)){
+            res[c++] = t[i];
+          }
+        }
+      }
+    }
+    else{
+      while (++i !== len){
+        // checks to see if the key was set
+        if (i in this){
+          if (func.call(thisArg, t[i], i, t)){
+            res[c++] = t[i];
+          }
+        }
+      }
+    }
+
+    res.length = c; // shrink down array to proper size
+    return res;
+  };
+}
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.20', 'Array.prototype.filter')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.6.
{{SpecName('ES2015', '#sec-array.prototype.filter', 'Array.prototype.filter')}}{{Spec2('ES2015')}}
{{SpecName('ESDraft', '#sec-array.prototype.filter', 'Array.prototype.filter')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.filter")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/find/index.html b/files/de/web/javascript/reference/global_objects/array/find/index.html new file mode 100644 index 0000000000..2741360a67 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/find/index.html @@ -0,0 +1,243 @@ +--- +title: Array.prototype.find() +slug: Web/JavaScript/Reference/Global_Objects/Array/find +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Method + - Prototype + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/find +--- +
{{JSRef}}
+ +

Die Methode find() gibt den Wert des Elements eines Arrays zurück, welches als erstes die Bedingung einer bereitgestellten Testfunktion erfüllt. Andernfalls wird {{jsxref("undefined")}} zurückgegeben.

+ +
{{EmbedInteractiveExample("pages/js/array-find.html")}}
+ + + +

Siehe auch die Methode {{jsxref("Array.prototype.findIndex()", "findIndex()")}}, die den Index eines gefundenen Elements im Array anstelle seines Werts zurückgibt.

+ +

Wenn Sie die Position eines Elements ermitteln oder feststellen müssen, ob ein Element in einem Array vorhanden ist, verwenden Sie {{jsxref("Array.prototype.indexOf()", "indexOf()")}} oder {{jsxref("Array.prototype.includes()", "includes()")}}.

+ +

Syntax

+ +
arr.find(callback[, thisArg])
+ +

Parameter

+ +
+
callback
+
Funktion, die auf jedes Element angewendet wird mit drei Argumenten: +
+
element
+
Das aktuelle Element, das im Array verarbeitet wird.
+
index {{optional_inline}}
+
Der Index des aktuellen Elements im Array.
+
array {{optional_inline}}
+
Das Array, welches mit find() durlaufen wird.
+
+
+
thisArg {{optional_inline}}
+
Wert der als this verwendet wird, wenn callback ausgeführt wird.
+
+ +

Rückgabewert

+ +

Der Wert des Elements, welches als erstes die Bedingung der bereitgestellten Testfunktion erfüllt. Andernfalls wird {{jsxref("undefined")}} zurückgegeben.

+ +

Beschreibung

+ +

find() führt die callback-Funktion einmal für jeden Index des Arrays aus, bis ein Index gefunden wird, in dem callback einen {{Glossary("truthy")}}-Wert zurückgibt. Wenn ein solches Element gefunden wird, gibt find() sofort den Wert dieses Elements zurück, {{jsxref("undefined")}}. callback wird für jeden Index des Arrays von 0 bis length - 1 aufgerufen und nicht nur für Indizes, denen Werte zugewiesen wurden. Dies kann bedeuten, dass es für Arrays mit Leerstellen weniger effizient ist als andere Methoden, die nur Indizes durchlaufen, denen ein Wert zugewiesen wurde.

+ +

callback wird mit drei Argumenten aufgerufen:

+ +
    +
  1. Der Wert des Elements
    2. +
  2. Der Index des Elements
    3. +
  3. Das Array-Objekt, das durchlaufen wird
    4. +
+ +

 

+ +

Falls der Parameter thisArg an find() übergeben wird, wird er als Wert für this innerhalb von callback verwendet. Andernfalls hat this den Wert {{jsxref("undefined")}}. Welchen Wert callback letztendlich in this sieht wird gemäß der üblichen Regeln bestimmt, nach denen this für eine Funktion ermittelt wird.

+ +

find() selbst verändert das Array nicht, auf dem es aufgerufen wird.

+ +

Der Bereich der von find() verarbeiteten Elemente wird vor dem ersten Aufruf von callback festgelegt. Elemente, die nach Beginn des Aufrufs von find() an das Array angehängt werden, werden von callback nicht berücksichtigt. Wenn vorhandene Elemente des Arrays geändert werden, ist der Wert maßgeblich, den find() beim Erreichen eines Elements antrifft und dann an callback übergibt. Gelöschte Elemente werden weiterhin verarbeitet.

+ +

Beispiele

+ +

Ermitteln eines Objekts innerhalb eines Arrays anhand eines seiner Eigenschaften

+ +
var inventory = [
+    {name: 'apples', quantity: 2},
+    {name: 'bananas', quantity: 0},
+    {name: 'cherries', quantity: 5}
+];
+
+function isCherries(fruit) {
+    return fruit.name === 'cherries';
+}
+
+console.log(inventory.find(isCherries));
+// { name: 'cherries', quantity: 5 }
+ +

Benutzung einer ES2015 Pfeilfunktion

+ +
const inventory = [
+    {name: 'apples', quantity: 2},
+    {name: 'bananas', quantity: 0},
+    {name: 'cherries', quantity: 5}
+];
+
+const result = inventory.find( fruit => fruit.name === 'cherries' );
+
+console.log(result) // { name: 'cherries', quantity: 5 }
+ +

Ermitteln einer Primzahl innerhalb eines Arrays

+ +

Im folgenden Beispiel wird ein Element im Array ermittelt, das eine Primzahl ist (oder {{jsxref("undefined")}} zurückgibt, wenn keine Primzahl vorhanden ist).

+ +
function isPrime(element, index, array) {
+  var start = 2;
+  while (start <= Math.sqrt(element)) {
+    if (element % start++ < 1) {
+      return false;
+    }
+  }
+  return element > 1;
+}
+
+console.log([4, 6, 8, 12].find(isPrime)); // undefined, not found
+console.log([4, 5, 8, 12].find(isPrime)); // 5
+
+ +

Das folgende Beispiel zeigt, dass nicht vorhandene und gelöschte Elemente durchlaufen werden und der Wert maßgeblich ist, der beim Erreichen des Elements angetroffen und an callback übergeben wird.

+ +
// Array deklarieren, das an Index 2, 3 und 4 keine Elemente hat
+var array = [0,1,,,,5,6];
+
+// Zeige alle Indizes, nicht nur die denen Werte zugewiesen wurden
+array.find(function(value, index) {
+  console.log('Visited index ' + index + ' with value ' + value);
+});
+
+// Zeige alle Indizes, inklusive gelöschter
+array.find(function(value, index) {
+
+  // Lösche Element 5 in erstem Durchlauf
+  if (index == 0) {
+    console.log('Deleting array[5] with value ' + array[5]);
+    delete array[5];
+  }
+  // Element 5 wird weiterhin durchlaufen, obwohl es gelöscht wurde
+  console.log('Visited index ' + index + ' with value ' + value);
+});
+// Erwartete Ausgaben:
+// Deleting array[5] with value 5
+// Visited index 0 with value 0
+// Visited index 1 with value 1
+// Visited index 2 with value undefined
+// Visited index 3 with value undefined
+// Visited index 4 with value undefined
+// Visited index 5 with value undefined
+// Visited index 6 with value 6
+
+ +

Polyfill

+ +

Diese Methode wurde der ECMAScript 2015-Spezifikation hinzugefügt und ist möglicherweise noch nicht in allen JavaScript-Implementierungen verfügbar. Sie können Array.prototype.find() jedoch mit dem folgenden Snippet nachrüsten:

+ +
// https://tc39.github.io/ecma262/#sec-array.prototype.find
+if (!Array.prototype.find) {
+  Object.defineProperty(Array.prototype, 'find', {
+    value: function(predicate) {
+     // 1. Let O be ? ToObject(this value).
+      if (this == null) {
+        throw new TypeError('"this" is null or not defined');
+      }
+
+      var o = Object(this);
+
+      // 2. Let len be ? ToLength(? Get(O, "length")).
+      var len = o.length >>> 0;
+
+      // 3. If IsCallable(predicate) is false, throw a TypeError exception.
+      if (typeof predicate !== 'function') {
+        throw new TypeError('predicate must be a function');
+      }
+
+      // 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
+      var thisArg = arguments[1];
+
+      // 5. Let k be 0.
+      var k = 0;
+
+      // 6. Repeat, while k < len
+      while (k < len) {
+        // a. Let Pk be ! ToString(k).
+        // b. Let kValue be ? Get(O, Pk).
+        // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
+        // d. If testResult is true, return kValue.
+        var kValue = o[k];
+        if (predicate.call(thisArg, kValue, k, o)) {
+          return kValue;
+        }
+        // e. Increase k by 1.
+        k++;
+      }
+
+      // 7. Return undefined.
+      return undefined;
+    },
+    configurable: true,
+    writable: true
+  });
+}
+
+ +

Wenn Sie stark veraltete JavaScript-Engines unterstützen müssen, die {{jsxref("Object.defineProperty()")}} nicht unterstützen, empfiehlt es sich Methoden aus Array.prototype gar nicht mit Polyfills nachzubauen, da es nicht möglich ist sie als nicht-enumerierbar zu kennzeichnen.

+ +

Specifikationen

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES2015', '#sec-array.prototype.find', 'Array.prototype.find')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype.find', 'Array.prototype.find')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.find")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/findindex/index.html b/files/de/web/javascript/reference/global_objects/array/findindex/index.html new file mode 100644 index 0000000000..904ff025fc --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/findindex/index.html @@ -0,0 +1,189 @@ +--- +title: Array.prototype.findIndex() +slug: Web/JavaScript/Reference/Global_Objects/Array/findIndex +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Method + - Prototype + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/findIndex +--- +
{{JSRef}}
+ +

Die Methode findIndex() gibt den Index des ersten Elements im Array zurück, das die bereitgestellte Testfunktion erfüllt. Andernfalls wird -1 zurückgegeben, um anzuzeigen, dass kein Element den Test bestanden hat.

+ +
{{EmbedInteractiveExample("pages/js/array-findindex.html")}}
+ + + +

Siehe auch die Methode {{jsxref("Array.find", "find()")}}, die den Wert eines Arrayelements anstelle dessen Index zurückgibt.

+ +

Syntax

+ +
arr.findIndex(callback(element[, index[, array]])[, thisArg])
+ +

Parameter

+ +
+
callback
+
Eine Funktion, die für jeden Wert im Array ausgeführt wird, bis sie true zurückgibt, um anzuzeigen, dass das gewünschte Element gefunden wurde. Sie akzeptiert 3 Argumente: +
+
element
+
Das aktuelle Element, das im Array verarbeitet wird.
+
index {{optional_inline}}
+
Der Index des aktuellen Elements, das im Array verarbeitet wird.
+
array {{optional_inline}}
+
Das Array, welches mit findIndex() durchlaufen wird.
+
+
+
thisArg {{optional_inline}}
+
Wert der als this verwendet wird, wenn callback ausgeführt wird
+
+ +

Rückgabewert

+ +

Ein Index im Array, wenn ein Element den Test besteht, ansonsten -1.

+ +

Beschreibung

+ +

findIndex() ruft eine bereitgestellte callback-Funktion einmal für jeden Array-Index 0..length-1 (inklusive) im Array auf bis callback einen {{Glossary("truthy")}}-Wert findet.

+ +

Wird ein solches Element gefunden gibt findIndex() sofort den Index des gefundenen Elements zurück. Gibt callback nie einen {{Glossary("truthy")}}-Wert zurück oder ist length gleich 0 gibt findIndex() -1 zurück. Im Gegensatz zu einigen anderen Array-Methoden wie {{jsxref("Array.prototype.some()", "some()")}} wird in Arrays mit Leerstellen callback auch für Indizes aufgerufen, die keinen Inhalt haben.

+ +

callback wird mit drei Argumenten aufgerufen:

+ +
    +
  1. Der Wert des Elements
    2. +
  2. Der Index des Elements
    3. +
  3. Das Array-Objekt, das durchlaufen wird
    4. +
+ +

Falls der Parameter thisArg an findIndex() übergeben wird, wird er als Wert für this innerhalb von callback verwendet. Andernfalls hat this den Wert {{jsxref("undefined")}}. Welchen Wert callback letztendlich in this sieht wird gemäß der üblichen Regeln bestimmt, nach denen this für eine Funktion ermittelt wird.

+ +

Der Bereich der von findIndex() verarbeiteten Elemente wird vor dem ersten Aufruf von callback festgelegt. Elemente, die nach Beginn des Aufrufs von findIndex() an das Array angehängt werden, werden von callback nicht berücksichtigt. Wenn vorhandene Elemente des Arrays geändert werden, ist der Wert maßgeblich, den findIndex() beim Erreichen eines Elements antrifft und dann an callback übergibt. Gelöschte Elemente werden weiterhin verarbeitet.

+ +

Beispiele

+ +

Index einer Primzahl in einem Array finden

+ +

Das folgende Beispiel gibt den Index eines Elements im Array zurück, das eine Primzahl ist, oder -1, wenn keine Primzahl vorhanden ist.

+ +
function isPrime(element, index, array) {
+  var start = 2;
+  while (start <= Math.sqrt(element)) {
+    if (element % start < 1) {
+      return false;
+    } else {
+      start++;
+    }
+  }
+  return element > 1;
+}
+
+console.log([4, 6, 8, 12].findIndex(isPrime)); // -1, not found
+console.log([4, 6, 7, 12].findIndex(isPrime)); // 2 (array[2] is 7)
+
+ +

Index mithilfe einer Pfeilfunktion ermitteln

+ +

Im folgenden Beispiel wird der Index einer Frucht mithilfe einer Pfeilfunktion ermittelt:

+ +
const fruits = ["apple", "banana", "cantaloupe", "blueberries", "grapefruit"];
+
+const index = fruits.findIndex(fruit => fruit === "blueberries");
+
+console.log(index); // 3
+console.log(fruits[index]); // blueberries
+
+ +

Polyfill

+ +
// https://tc39.github.io/ecma262/#sec-array.prototype.findindex
+if (!Array.prototype.findIndex) {
+  Object.defineProperty(Array.prototype, 'findIndex', {
+    value: function(predicate) {
+     // 1. Let O be ? ToObject(this value).
+      if (this == null) {
+        throw new TypeError('"this" is null or not defined');
+      }
+
+      var o = Object(this);
+
+      // 2. Let len be ? ToLength(? Get(O, "length")).
+      var len = o.length >>> 0;
+
+      // 3. If IsCallable(predicate) is false, throw a TypeError exception.
+      if (typeof predicate !== 'function') {
+        throw new TypeError('predicate must be a function');
+      }
+
+      // 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
+      var thisArg = arguments[1];
+
+      // 5. Let k be 0.
+      var k = 0;
+
+      // 6. Repeat, while k < len
+      while (k < len) {
+        // a. Let Pk be ! ToString(k).
+        // b. Let kValue be ? Get(O, Pk).
+        // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
+        // d. If testResult is true, return k.
+        var kValue = o[k];
+        if (predicate.call(thisArg, kValue, k, o)) {
+          return k;
+        }
+        // e. Increase k by 1.
+        k++;
+      }
+
+      // 7. Return -1.
+      return -1;
+    },
+    configurable: true,
+    writable: true
+  });
+}
+
+ +

Wenn Sie stark veraltete JavaScript-Engines unterstützen müssen, die {{jsxref("Object.defineProperty()")}} nicht unterstützen, empfiehlt es sich Methoden aus Array.prototype gar nicht mit Polyfills nachzubauen, da es nicht möglich ist sie als nicht-enumerierbar zu kennzeichnen.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES2015', '#sec-array.prototype.findindex', 'Array.prototype.findIndex')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype.findIndex', 'Array.prototype.findIndex')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.findIndex")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/flat/index.html b/files/de/web/javascript/reference/global_objects/array/flat/index.html new file mode 100644 index 0000000000..4e18ff7649 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/flat/index.html @@ -0,0 +1,116 @@ +--- +title: Array.prototype.flat() +slug: Web/JavaScript/Reference/Global_Objects/Array/flat +tags: + - Array + - Experimental + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/flat +--- +
{{JSRef}} {{SeeCompatTable}}
+ +

Die flat() Methode erstellt rekursiv ein neues Array mit allen Elementen von Unterarrays bis zu einer spezifizierten Tiefe.

+ + + + + +

Syntax

+ +
var newArray = arr.flat(depth);
+ +

Parameter

+ +
+
depth {{optional_inline}}
+
Das Tiefenlevel, welches angibt, bis zu welcher Tiefe die Arraystruktur abgeflacht werden soll. Der Standardwert ist 1.
+
+ +

Rückgabewert

+ +

Ein neues Array, welches die Elemente der Unterarrays enthält.

+ +

Beispiele

+ +

Abflachen von geschachtelten Arrays

+ +
var arr1 = [1, 2, [3, 4]];
+arr1.flat();
+// [1, 2, 3, 4]
+
+var arr2 = [1, 2, [3, 4, [5, 6]]];
+arr2.flat();
+// [1, 2, 3, 4, [5, 6]]
+
+var arr3 = [1, 2, [3, 4, [5, 6]]];
+arr3.flat(2);
+// [1, 2, 3, 4, 5, 6]
+
+ +

Abflachen und Löcher in Arrays

+ +

Die flat Methode entfernt leere Plätze in Arrays:

+ +
var arr4 = [1, 2, , 4, 5];
+arr4.flat();
+// [1, 2, 4, 5]
+ +

Alternative

+ +

reduce und concat

+ +
var arr1 = [1, 2, [3, 4]];
+arr1.flat();
+
+// Um ein Array um eine Ebene zu glätten.
+arr1.reduce((acc, val) => acc.concat(val), []);
+// [1, 2, 3, 4]
+
+// Um mehrere Ebenen zu glätten muss reduce und concat rekursiv eingesetzt werden.
+
+var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]];
+
+function flattenDeep(arr1) {
+   return arr1.reduce((acc, val) => Array.isArray(val) ? acc.concat(flattenDeep(val)) : acc.concat(val), []);
+}
+flattenDeep(arr1);
+
+// [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
Array.prototype.flat proposalCandidate (3) 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.flat")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/flatmap/index.html b/files/de/web/javascript/reference/global_objects/array/flatmap/index.html new file mode 100644 index 0000000000..2840429333 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/flatmap/index.html @@ -0,0 +1,117 @@ +--- +title: Array.prototype.flatMap() +slug: Web/JavaScript/Reference/Global_Objects/Array/flatMap +tags: + - Array + - Experimental + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/flatMap +--- +
{{JSRef}} {{SeeCompatTable}}
+ +

Die flatMap() Methode bildet jedes Element über eine Funktion ab und flacht das Ergebnis in ein Array ab. Sie ist identisch zu einem map gefolgt von einem flat der Tiefe 1, aber flatMap ist oft nützlich und beide in einer Methode zusammenführen ist etwas effizienter.

+ + + + + +

Syntax

+ +
var new_array = arr.flatMap(function callback(currentValue[, index[, array]]) {
+    // return element for new_array
+}[, thisArg])
+ +

Parameter

+ +
+
callback
+
Funktion, die ein Element für das neue Array erzeugt, welche drei Argumente hat: +
+
 
+
currentValue
+
Das aktuelle Element, das im Array verarbeitet wird.
+
index{{optional_inline}}
+
Der Index des aktuell zu verarbeitende Elements in dem Array.
+
array{{optional_inline}}
+
Das Array, auf dem flatMap aufgerufen wurde.
+
+
+
thisArg{{optional_inline}}
+
Wert, der bei der Ausführung von callback für this genutzt wird.
+
+ +

Rückgabewert

+ +

Ein neues Array mit jedem Element, dass aus dem Resultat der callback Funktion hervorgeht und auf die Tiefe 1 abgeflacht wurde.

+ +

Beschreibung

+ +

Siehe auf der Seite {{jsxref("Array.prototype.map()")}} für eine detaillierte Beschreibung der callback Funktion. Die flatMap Methode ist identisch zu map gefolgt von flat mit der Tiefe 1.

+ +

Beispiele

+ +

map und flatMap

+ +
var arr1 = [1, 2, 3, 4];
+
+arr1.map(x => [x * 2]);
+// [[2], [4], [6], [8]]
+
+arr1.flatMap(x => [x * 2]);
+// [2, 4, 6, 8]
+
+// only one level is flattened
+arr1.flatMap(x => [[x * 2]]);
+// [[2], [4], [6], [8]]
+
+ +

Alternative

+ +

reduce und concat

+ +
var arr1 = [1, 2, 3, 4];
+
+arr1.flatMap(x => [x * 2]);
+// ist equivalent zu
+arr1.reduce((acc, x) => acc.concat([x * 2]), []);
+// [2, 4, 6, 8]
+
+ +
//=> [1, 2, 3, 4, 5, 6, 7, 8, 9]
+ +

Spezifikationen

+ + + + + + + + + + + + + + +
SpezifikationStatusKommentar
Array.prototype.flatMap proposalCandidate (3) 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.flatMap")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/foreach/index.html b/files/de/web/javascript/reference/global_objects/array/foreach/index.html new file mode 100644 index 0000000000..faba9795cb --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/foreach/index.html @@ -0,0 +1,303 @@ +--- +title: Array.prototype.forEach() +slug: Web/JavaScript/Reference/Global_Objects/Array/forEach +tags: + - Array + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/forEach +--- +
{{JSRef}}
+ +

Die forEach() Methode führt eine übergebene Funktion für jedes Element eines Arrays aus.

+ +
{{EmbedInteractiveExample("pages/js/array-foreach.html")}}
+ + + +

// a // b // c

+ +

Syntax

+ +
arr.forEach(function callback(currentValue [, index [, array]]) {
+    // Ihr Iterator
+}[, thisArg]);
+ +

Parameter

+ +
+
callback
+
Funktion, die auf jedes Element angewendet wird mit drei Argumenten:
+
+
+
currentValue
+
Der Wert des aktuellen Elements im Array.
+
index {{optional_inline}}
+
Der Index des aktuellen Elements im Array.
+
array {{optional_inline}}
+
Das Array, welches mit forEach() durlaufen wird.
+
+
+
thisArg {{optional_inline}}
+
Wert der als this verwendet wird, wenn callback ausgeführt wird.
+
 
+
+ +

Rückgabewert

+ +

{{jsxref("undefined")}}.

+ +

Beschreibung

+ +

forEach() ruft eine bereitgestellte callback-Funktion einmal für jedes Element in einem Array in aufsteigender Reihenfolge auf. Sie wird nicht für Elemente aufgerufen, die gelöscht oder nicht initialisiert wurden (d. h. Arrays mit leeren Elementen).

+ +

callback wird mit drei Argumenten aufgerufen:

+ +
    +
  1. Der Wert des Elements
    2. +
  2. Der Index des Elements
    3. +
  3. Das Array-Objekt, das durchlaufen wird
    4. +
+ +

Falls der Parameter thisArg an forEach() übergeben wird, wird er als Wert für this innerhalb von callback verwendet. Andernfalls hat this den Wert {{jsxref("undefined")}}. Welchen Wert callback letztendlich in this sieht wird gemäß der üblichen Regeln bestimmt, nach denen this für eine Funktion ermittelt wird.

+ +

forEach() selbst verändert das Array nicht, auf dem es aufgerufen wird (das aufgerufene callback kann jedoch Änderungen vornehmen).

+ +

Der Bereich der von forEach() verarbeiteten Elemente wird vor dem ersten Aufruf von callback festgelegt. Elemente, die nach Beginn des Aufrufs von forEach() an das Array angehängt werden, werden von callback nicht berücksichtigt. Wenn vorhandene Elemente des Arrays geändert werden, ist der Wert maßgeblich, den forEach() beim Erreichen eines Elements antrifft und dann an callback übergibt. Nachfolgende Elemente, die nach Beginn eines Durchlaufs von forEach() gelöscht werden (z. B. durch {{jsxref("Array.prototype.shift()", "shift()")}}), bevor sie eingelesen werden konnten, werden nicht mehr berücksichtigt (siehe Beispiel unten).

+ +

forEach() führt callback einmal für jedes Element im Array aus; im Gegensatz zu {{jsxref("Array.prototype.map()", "map()")}} oder {{jsxref("Array.prototype.reduce()", "reduce()")}} gibt es immer den Wert {{jsxref("undefined")}} zurück und ist nicht verknüpfbar. Der typische Anwendungsfall ist das Ausführen von Nebenwirkungen am Ende einer einer solchen Kette.

+ +
+

Es gibt keine Möglichkeit eine forEach()-Schleife zu unterbrechen oder zu verlassen, außer durch das erzeugen einer Exception. Wird eine solche Möglichkeit jedoch benötigt, stellt forEach() das falsche Mittel dar.

+ +

Vorzeitiges Verlassen ist verfügbar in:

+ + + +

Die anderen Array Methoden {{jsxref("Array.prototype.every()", "every()")}}, {{jsxref("Array.prototype.some()", "some()")}}, {{jsxref("Array.prototype.find()", "find()")}} und {{jsxref("Array.prototype.findIndex()", "findIndex()")}} prüfen die Elemente im Array auf eine Bedingung, die einen {{Glossary("Truthy")}}-Wert zurückgibt mit dem bestimmt wird, ob weitere Durchläufe nötig sind.

+
+ +

Beispiele

+ +

forEach() statt einer for-Schleife

+ +
const items = ['item1', 'item2', 'item3'];
+const copy = [];
+
+// Vorher
+for (let i=0; i<items.length; i++) {
+  copy.push(items[i]);
+}
+
+// Nachher
+items.forEach(function(item){
+  copy.push(item);
+});
+ +

Inhalte eines Arrays ausgeben

+ +
+

Hinweis: Um den Inhalt eines Arrays vorformatiert auf der Konsole auszugeben können Sie auch {{jsxref("console.table()")}} verwenden. Dieses Beispiel zeigt eine weitere Möglichkeit mittels forEach().

+
+ +

Der folgende Code gibt eine Zeile pro Element des Arrays aus:

+ +
function logArrayElements(element, index, array) {
+  console.log('a[' + index + '] = ' + element);
+}
+
+// Hinweis zur Auslassung: Es gibt keinen Eintrag mit dem Index 2
+// somit wird dieser übersprungen
+[2, 5, , 9].forEach(logArrayElements);
+// Ausgabe:
+// a[0] = 2
+// a[1] = 5
+// a[3] = 9
+
+ +

Verwendung von thisArg

+ +

Das folgende (fingierte) Beispiel aktualisiert die Eigenschaften eines Objekts eines jeden Eintrags im Array:

+ +
function Counter() {
+  this.sum = 0;
+  this.count = 0;
+}
+Counter.prototype.add = function(array) {
+  array.forEach(function(entry) {
+    this.sum += entry;
+    ++this.count;
+  }, this);
+  // ^---- Beachten
+};
+
+var obj = new Counter();
+obj.add([2, 5, 9]);
+obj.count;
+// 3 
+obj.sum;
+// 16
+ +

Da forEach() der Parameter thisArg (this) zur Verfügung steht, wird er bei jedem Aufruf an callback weitergegeben, um es als seinen this-Wert zu benutzen.

+ +
+

Wenn das Funktionsargument durch die Pfeilnotation angegeben wird, kann der Parameter thisArg weggelassen werden, da Pfeilfunktionen den {{jsxref("Operators/this", "this")}}-Wert lexikalisch vermerken.

+
+ +

Funktion zum Kopieren eines Objekts

+ +

Der folgende Code erzeugt eine Kopie des übergebenen Objekts. Es gibt verschiedene Möglichkeiten, ein Objekt zu kopieren. Die Folgende ist nur eine davon und dient zur Veranschaulichung, wie Array.prototype.forEach() funktioniert, indem ECMAScript 5 Object.* Meta-Funktionen genutzt werden.

+ +
function copy(o) {
+  var copy = Object.create(Object.getPrototypeOf(o));
+  var propNames = Object.getOwnPropertyNames(o);
+
+  propNames.forEach(function(name) {
+    var desc = Object.getOwnPropertyDescriptor(o, name);
+    Object.defineProperty(copy, name, desc);
+  });
+
+  return copy;
+}
+
+var o1 = { a: 1, b: 2 };
+var o2 = copy(o1); // o2 sieht jetzt aus wie o1
+ +

Wird das Array während des Durchlaufes modifiziert, könnten andere Elemente übersprungen werden.

+ +

Das folgende Beispiel protokolliert "eins", "zwei", "vier". Wenn der Eintrag mit dem Wert "zwei" erreicht ist, wird der erste Eintrag des Arrays mit {{jsxref("Array.prototype.shift()", "shift()")}} entfernt, was dazu führt, dass alle übrigen Einträge um eine Position aufrücken. Weil Element "vier" jetzt an einer früheren Position im Array ist, wird "drei" übersprungen. forEach() erzeugt keine Kopie des Arrays vor dem Durchlauf.

+ +
var words = ['eins', 'zwei', 'drei', 'vier'];
+words.forEach(function(word) {
+  console.log(word);
+  if (word === 'zwei') {
+    words.shift();
+  }
+});
+// eins
+// zwei
+// vier
+ +

Polyfill

+ +

forEach() wurde dem ECMA-262-Standard in der 5. Auflage hinzugefügt. Als solches ist es möglicherweise nicht in allen Implementierungen des Standards enthalten. Sie können dies umgehen, indem Sie den folgenden Code am Anfang Ihrer Skripte einfügen, um die Verwendung von forEach() in Implementierungen zu ermöglichen, die es nicht nativ unterstützen. Dieser Algorithmus entspricht dem in der 5. Auflage von ECMA-262 angegebenen Algorithmus, vorausgesetzt {{jsxref("Object")}} und {{jsxref("TypeError")}} haben ihre ursprünglichen Werte und callback.call() wird mit dem ursprünglichen Wert von {{jsxref("Function.prototype.call")}} ausgewertet.

+ +
// Production steps of ECMA-262, Edition 5, 15.4.4.18
+// Reference: http://es5.github.io/#x15.4.4.18
+if (!Array.prototype.forEach) {
+
+  Array.prototype.forEach = function(callback, thisArg) {
+
+    var T, k;
+
+    if (this === null) {
+      throw new TypeError(' this is null or not defined');
+    }
+
+    // 1. Let O be the result of calling ToObject passing the |this| value as the argument.
+    var O = Object(this);
+
+    // 2. Let lenValue be the result of calling the Get internal method of O with the argument "length".
+    // 3. Let len be ToUint32(lenValue).
+    var len = O.length >>> 0;
+
+    // 4. If IsCallable(callback) is false, throw a TypeError exception.
+    // See: http://es5.github.com/#x9.11
+    if (typeof callback !== "function") {
+      throw new TypeError(callback + ' is not a function');
+    }
+
+    // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
+    if (arguments.length > 1) {
+      T = thisArg;
+    }
+
+    // 6. Let k be 0
+    k = 0;
+
+    // 7. Repeat, while k < len
+    while (k < len) {
+
+      var kValue;
+
+      // a. Let Pk be ToString(k).
+      //   This is implicit for LHS operands of the in operator
+      // b. Let kPresent be the result of calling the HasProperty internal method of O with argument Pk.
+      //   This step can be combined with c
+      // c. If kPresent is true, then
+      if (k in O) {
+
+        // i. Let kValue be the result of calling the Get internal method of O with argument Pk.
+        kValue = O[k];
+
+        // ii. Call the Call internal method of callback with T as the this value and
+        // argument list containing kValue, k, and O.
+        callback.call(T, kValue, k, O);
+      }
+      // d. Increase k by 1.
+      k++;
+    }
+    // 8. return undefined
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.18', 'Array.prototype.forEach')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.6.
{{SpecName('ES6', '#sec-array.prototype.foreach', 'Array.prototype.forEach')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.foreach', 'Array.prototype.forEach')}}{{Spec2('ESDraft')}} 
+ +

Browser-Kompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.forEach")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/from/index.html b/files/de/web/javascript/reference/global_objects/array/from/index.html new file mode 100644 index 0000000000..dd254fec88 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/from/index.html @@ -0,0 +1,227 @@ +--- +title: Array.from() +slug: Web/JavaScript/Reference/Global_Objects/Array/from +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Method + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/from +--- +
{{JSRef}}
+ +

Die Array.from() Methode erstellt eine neue, oberflächlich kopierte Array Instanz von einem Array-ähnlichen oder iterierbaren Objekt.

+ +
{{EmbedInteractiveExample("pages/js/array-from.html")}}
+ + + +

Syntax

+ +
Array.from(arrayLike[, mapFn[, thisArg]])
+ +

Parameter

+ +
+
arrayLike
+
Ein Array-ähnliches oder iterierbares Objekt, welches zu einem Array konvertiert wird.
+
mapFn{{Optional_inline}}
+
Map Funktion, welche auf jedes Element des Arrays angewendet wird.
+
thisArg{{Optional_inline}}
+
Wert, welcher als this beim Ausführen von mapFn genutzt wird.
+
+ +

Rückgabewert

+ +

Eine neue {{jsxref("Array")}} Instanz.

+ +

Beschreibung

+ +

Array.from() erstellt ein Array aus:

+ + + +

Array.from() hat einen optionalen Parameter mapFn, welcher es erlaubt eine {{jsxref("Array.prototype.map", "map")}} Funktion auf jedem Element des Arrays (oder Subklassen) das erstellt wird, auszuführen. Genauer gesagt, ist Array.from(obj, mapFn, thisArg) dasselbe wie Array.from(obj).map(mapFn, thisArg), mit dem Unterschied, dass kein Array als Zwischenergebnis produziert wird. Das ist besonders wichtig für Array Subklassen, wie typed Arrays. Das Array des Zwischenergebnisses
+ würde sonst Werte kürzen, um dem zutreffenden Typ zu entsprechen.

+ +

Die length Eigenschaft der from() Methode ist 1.

+ +

In ES2015 erlaubt die class Syntax, Subklassen für eingebaute und benutzerdefinierte Klassen. Klassenseitige statische Methoden wie Array.from() sind von der Subklasse Array vererbt und erzeugen eine neue Instanz der Subklasse und nicht von Array.

+ +

Beispiele

+ +

Array von einem String

+ +
Array.from('foo');
+// ["f", "o", "o"];
+ +

Array von einem Set

+ +
var s = new Set(["foo", window]);
+Array.from(s);
+// ["foo", window]
+ +

Array von einem Map

+ +
var m = new Map([[1, 2], [2, 4], [4, 8]]);
+Array.from(m);
+// [[1, 2], [2, 4], [4, 8]]
+
+var mapper = new Map([['1', 'a'], ['2', 'b']]);
+Array.from(mapper.values());
+// ['a', 'b'];
+
+Array.from(mapper.keys());
+// ['1', '2'];
+ +

Array von einem Array ähnlichen Objekt (arguments)

+ +
function f() {
+  return Array.from(arguments);
+}
+
+f(1, 2, 3);
+
+// [1, 2, 3]
+ +

Einsatz von Arrow-Funktionen und Array.from

+ +
// Using an arrow function as the map function to
+// manipulate the elements
+Array.from([1, 2, 3], x => x + x);
+// [2, 4, 6]
+
+
+// Generate a sequence of numbers
+// Since the array is initialized with `undefined` on each position,
+// the value of `v` below will be `undefined`
+Array.from({length: 5}, (v, i) => i);
+// [0, 1, 2, 3, 4]
+
+ +

Polyfill

+ +

Array.from() wurde zum ECMA-262 Standard in der 6ten Version hinzugefügt. Es kann sein, dass diese in anderen Implementationen des Standards nicht verfügbar ist. Man kann das mit folgendem Code am Anfang eines Skriptes umgehen. Das Skript erlaubt das Benutzen von Array.from() in Implementationen, welche Array.from() nicht nativ unterstützen. Dieser Algorithmus ist genau derselbe, welcher in EMCA-262, 6te Version implementiert ist, angenommen Object und TypeError haben ihre originalen Werte und callback.call evaluiert den Original Wert von {{jsxref("Function.prototype.call")}}. Außerdem können echte iterierbare Elemente nicht mit einem Polyfill implementiert werden. Diese Implementation unterstützt keine generischen iterierbaren Elemente so wie sie definiert sind in der 6ten Version von ECMA-262.

+ +
// Production steps of ECMA-262, Edition 6, 22.1.2.1
+if (!Array.from) {
+  Array.from = (function () {
+    var toStr = Object.prototype.toString;
+    var isCallable = function (fn) {
+      return typeof fn === 'function' || toStr.call(fn) === '[object Function]';
+    };
+    var toInteger = function (value) {
+      var number = Number(value);
+      if (isNaN(number)) { return 0; }
+      if (number === 0 || !isFinite(number)) { return number; }
+      return (number > 0 ? 1 : -1) * Math.floor(Math.abs(number));
+    };
+    var maxSafeInteger = Math.pow(2, 53) - 1;
+    var toLength = function (value) {
+      var len = toInteger(value);
+      return Math.min(Math.max(len, 0), maxSafeInteger);
+    };
+
+    // The length property of the from method is 1.
+    return function from(arrayLike/*, mapFn, thisArg */) {
+      // 1. Let C be the this value.
+      var C = this;
+
+      // 2. Let items be ToObject(arrayLike).
+      var items = Object(arrayLike);
+
+      // 3. ReturnIfAbrupt(items).
+      if (arrayLike == null) {
+        throw new TypeError('Array.from requires an array-like object - not null or undefined');
+      }
+
+      // 4. If mapfn is undefined, then let mapping be false.
+      var mapFn = arguments.length > 1 ? arguments[1] : void undefined;
+      var T;
+      if (typeof mapFn !== 'undefined') {
+        // 5. else
+        // 5. a If IsCallable(mapfn) is false, throw a TypeError exception.
+        if (!isCallable(mapFn)) {
+          throw new TypeError('Array.from: when provided, the second argument must be a function');
+        }
+
+        // 5. b. If thisArg was supplied, let T be thisArg; else let T be undefined.
+        if (arguments.length > 2) {
+          T = arguments[2];
+        }
+      }
+
+      // 10. Let lenValue be Get(items, "length").
+      // 11. Let len be ToLength(lenValue).
+      var len = toLength(items.length);
+
+      // 13. If IsConstructor(C) is true, then
+      // 13. a. Let A be the result of calling the [[Construct]] internal method
+      // of C with an argument list containing the single item len.
+      // 14. a. Else, Let A be ArrayCreate(len).
+      var A = isCallable(C) ? Object(new C(len)) : new Array(len);
+
+      // 16. Let k be 0.
+      var k = 0;
+      // 17. Repeat, while k < len… (also steps a - h)
+      var kValue;
+      while (k < len) {
+        kValue = items[k];
+        if (mapFn) {
+          A[k] = typeof T === 'undefined' ? mapFn(kValue, k) : mapFn.call(T, kValue, k);
+        } else {
+          A[k] = kValue;
+        }
+        k += 1;
+      }
+      // 18. Let putStatus be Put(A, "length", len, true).
+      A.length = len;
+      // 20. Return A.
+      return A;
+    };
+  }());
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-array.from', 'Array.from')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.from', 'Array.from')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.from")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/includes/index.html b/files/de/web/javascript/reference/global_objects/array/includes/index.html new file mode 100644 index 0000000000..64a51dfb73 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/includes/index.html @@ -0,0 +1,181 @@ +--- +title: Array.prototype.includes() +slug: Web/JavaScript/Reference/Global_Objects/Array/includes +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/includes +--- +
{{JSRef}}
+ +

Die includes() Methode prüft, ob ein Array ein bestimmtes Element enthält, und gibt entsprechend true oder false aus. Es wird der selbe sameValueZero-Algorithmus benutzt, um ein gegebenes Element zu finden.

+ +
{{EmbedInteractiveExample("pages/js/array-includes.html")}}
+ + + +

Syntax

+ +
arr.includes(searchElement[, fromIndex])
+ +

Parameter

+ +
+
searchElement
+
Das zu suchende Element.
+
fromIndex {{optional_inline}}
+
Die Position im Array, ab welcher die Suche nach searchElement beginnt. Bei einem negativen Wert fängt die Suche beim Index array.length - fromIndex an. Default ist 0.
+
+ +

Rückgabewert

+ +
+
+

Ein {{jsxref("Boolean")}}.

+
+
+ +

Beispiele

+ +
[1, 2, 3].includes(2);     // true
+[1, 2, 3].includes(4);     // false
+[1, 2, 3].includes(3, 3);  // false
+[1, 2, 3].includes(3, -1); // true
+[1, 2, NaN].includes(NaN); // true
+
+ +

fromIndex ist größer oder gleich der Arraylänge

+ +

Wenn fromIndex größer oder gleich der Arraylänge ist, wird false zurückgegeben. Das Array wird nicht durchsucht.

+ +
var arr = ['a', 'b', 'c'];
+
+arr.includes('c', 3);   // false
+arr.includes('c', 100); // false
+
+ +

Berechneter Index ist kleiner als 0

+ +

Wenn fromIndex negativ ist, wird der Index berechnet, an dem die Suche im Array nach searchElement beginnen soll. Wenn diese Berechnung einen Index kleiner als 0 ergibt, wird das ganze Array durchsucht.

+ +
// Arraylänge ist 3
+// fromIndex ist -100
+// Der berechnete Index ist 3 + (-100) = -97
+
+var arr = ['a', 'b', 'c'];
+
+arr.includes('a', -100); // true
+arr.includes('b', -100); // true
+arr.includes('c', -100); // true
+
+ +

Einsatz von includes() als generische Methode

+ +

Die includes()-Methode is absichtlich generisch. Die this-Referenz muss nicht auf ein Array-Objekt zeigen, so dass auch andere Objekte (z. B. Array-ähnliche Objekte) genutzt werden können. Das Beispiel zeigt, wie includes() auf den Parametern (arguments) einer Funktion aufgerufen wird.

+ +
(function() {
+  console.log([].includes.call(arguments, 'a')); // true
+  console.log([].includes.call(arguments, 'd')); // false
+})('a', 'b', 'c')
+
+ +

Polyfill

+ +
// https://tc39.github.io/ecma262/#sec-array.prototype.includes
+if (!Array.prototype.includes) {
+  Object.defineProperty(Array.prototype, 'includes', {
+    value: function(searchElement, fromIndex) {
+
+      if (this == null) {
+        throw new TypeError('"this" is null or not defined');
+      }
+
+      // 1. Let O be ? ToObject(this value).
+      var o = Object(this);
+
+      // 2. Let len be ? ToLength(? Get(O, "length")).
+      var len = o.length >>> 0;
+
+      // 3. If len is 0, return false.
+      if (len === 0) {
+        return false;
+      }
+
+      // 4. Let n be ? ToInteger(fromIndex).
+      //    (If fromIndex is undefined, this step produces the value 0.)
+      var n = fromIndex | 0;
+
+      // 5. If n ≥ 0, then
+      //  a. Let k be n.
+      // 6. Else n < 0,
+      //  a. Let k be len + n.
+      //  b. If k < 0, let k be 0.
+      var k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);
+
+      function sameValueZero(x, y) {
+        return x === y || (typeof x === 'number' && typeof y === 'number' && isNaN(x) && isNaN(y));
+      }
+
+      // 7. Repeat, while k < len
+      while (k < len) {
+        // a. Let elementK be the result of ? Get(O, ! ToString(k)).
+        // b. If SameValueZero(searchElement, elementK) is true, return true.
+        if (sameValueZero(o[k], searchElement)) {
+          return true;
+        }
+        // c. Increase k by 1.
+        k++;
+      }
+
+      // 8. Return false
+      return false;
+    }
+  });
+}
+
+ +

Sollten Sie wirklich veraltete JavaScript-Engines unterstützen müssen, die ihrerseits {{jsxref("Object.defineProperty", "Object.defineProperty")}} nicht unterstützen, ist es ratsam, die Array.prototype-Methode nicht mit dem Polyfill zu erweitern, da man diese nicht unabzählbar (non-enumerable) machen kann.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES7', '#sec-array.prototype.includes', 'Array.prototype.includes')}}{{Spec2('ES7')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype.includes', 'Array.prototype.includes')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.includes")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/index.html b/files/de/web/javascript/reference/global_objects/array/index.html new file mode 100644 index 0000000000..d60c037b82 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/index.html @@ -0,0 +1,460 @@ +--- +title: Array +slug: Web/JavaScript/Reference/Global_Objects/Array +tags: + - Array + - Example + - Global Objects + - JavaScript + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array +--- +
{{JSRef}}
+ +

Das JavaScript-Array ist ein globales Objekt und Konstruktor für das Erstellen von Arrays, welche listenähnliche Objekte sind.

+ +

Ein Array erstellen

+ +
var fruits = ['Apple', 'Banana'];
+
+console.log(fruits.length);
+// 2
+
+ +

Zugriff auf ein Arrayelement (mit Index)

+ +
var first = fruits[0];
+// Apple
+
+var last = fruits[fruits.length - 1];
+// Banana
+
+ +

Über ein Array Iterieren

+ +
fruits.forEach(function(item, index, array) {
+  console.log(item, index);
+});
+// Apple 0
+// Banana 1
+
+ +

Ein Element am Ende des Arrays einfügen

+ +
var newLength = fruits.push('Orange');
+// ["Apple", "Banana", "Orange"]
+
+ +

Ein Element am Ende des Arrays löschen

+ +
var last = fruits.pop(); // remove Orange (from the end)
+// ["Apple", "Banana"];
+
+ +

Ein Element am Anfang des Arrays löschen

+ +
var first = fruits.shift(); // remove Apple from the front
+// ["Banana"];
+
+ +

Ein Element am Anfang des Arrays einfügen

+ +
var newLength = fruits.unshift('Strawberry') // add to the front
+// ["Strawberry", "Banana"];
+
+ +

Den Index eines Elements im Array ermitteln

+ +
fruits.push('Mango');
+// ["Strawberry", "Banana", "Mango"]
+
+var pos = fruits.indexOf('Banana');
+// 1
+
+ +

Ein Element mithilfe eines Index aus dem Array löschen

+ +
var removedItem = fruits.splice(pos, 1); // this is how to remove an item
+
+// ["Strawberry", "Mango"]
+ +

Elemente von einer Indexposition aus löschen

+ +
var vegetables = ['Cabbage', 'Turnip', 'Radish', 'Carrot'];
+console.log(vegetables);
+// ["Cabbage", "Turnip", "Radish", "Carrot"]
+
+var pos = 1, n = 2;
+
+var removedItems = vegetables.splice(pos, n);
+// this is how to remove items, n defines the number of items to be removed,
+// from that position(pos) onward to the end of array.
+
+console.log(vegetables);
+// ["Cabbage", "Carrot"] (the original array is changed)
+
+console.log(removedItems);
+// ["Turnip", "Radish"]
+ +

Ein Array kopieren

+ +
var shallowCopy = fruits.slice(); // this is how to make a copy
+// ["Strawberry", "Mango"]
+
+ +

Syntax

+ +
[element0, element1, ..., elementN]
+new Array(element0, element1[, ...[, elementN]])
+new Array(arrayLength)
+ +

Parameter

+ +
+
elementN
+
Ein JavaScript-Array wird mit den angegebenen Elementen initialisiert, es sei denn, an den Array-Konstruktor wird eine einzelne Zahl übergeben (siehe arrayLength-Parameter unten). Beachte, dass dieser Sonderfall nur für JavaScript-Arrays gilt, die mit dem Array-Konstruktor erstellt wurden, nicht für Array-Literale, die mit der Klammer-Syntax erstellt wurden.
+
arrayLength
+
Wenn lediglich eine Ganzzahl zwischen 0 und 232-1 (inklusive) als Argument an den Array-Konstruktor übergeben wird, ist der Rückgabewert ein JavaScript Array, dessen length-Eigenschaft dieser Zahl entspricht. (Hinweis: Dies impliziert ein Array mit leeren Elementen einer Anzahl von arrayLength, nicht Elementen mit Wert undefined). Handelt es sich bei dem Argument um irgendeine andere Zah,l wird eine {{jsxref("Global_Objects/RangeError", "RangeError")}} Exception ausgelöst.
+
+ +

Beschreibung

+ +

Arrays sind listenähnliche Objekte, dessen Prototyp Methoden für Durchlauf- und Mutationsoperationen besitzt. Weder die Länge eines JavaScript-Arrays noch die Typen seiner Elemente sind fix. Da sich die Länge eines Arrays jederzeit ändern kann und Daten an nicht zusammenhängenden Positionen im Array gespeichert werden können, ist nicht garantiert, dass JavaScript-Arrays verdichtet sind; dies hängt davon ab, wie der Programmierer sie benutzt. Im Allgemeinen sind dies praktische Merkmale; falls jedoch diese Funktionalität für Ihren Anwendungsfall nicht wünschenswert ist, sollten Sie in Betracht ziehen, typisierte Arrays zu verwenden.

+ +

Arrays können keine Strings als Index benutzen (wie bei assoziativen Arrays), sondern müssen Ganzzahlen verwenden. Der Zugriff mit nicht-ganzzahligen Werten über die Klammernotation (oder Punktnotation) bezieht sich nicht auf ein Element im Array, sondern legt eine Eigenschaft des Array-Objekts fest oder greift darauf zu. Die Eigenschaften des Array-Objekts und die Liste der Array-Elemente sind voneinander getrennt. Die Durchlauf- und Mutationsoperationen des Arrays können nicht auf diese benannten Eigenschaften angewendet werden.

+ +

Auf Elemente des Arrays zugreifen

+ +

JavaScript-Arrays sind nullindiziert: Das erste Element eines Arrays befindet sich am Index 0, das letzte Element befindet sich an demjenigen Index, der dem Wert der Eigenschaft {{jsxref ("Array.length", "length")}} des Arrays minus 1 entspricht. Die Verwendung einer ungültigen Indexnummer gibt undefined zurück.

+ +
var arr = ['Das erste Element', 'Das zweite Element', 'Das letzte Element'];
+console.log(arr[0]);              // Ausgabe: 'Das erste Element'
+console.log(arr[1]);              // Ausgabe: 'Das zweite Element'
+console.log(arr[arr.length - 1]); // Ausgabe: 'Das letzte Element'
+
+ +

Array-Elemente sind Objekteigenschaften genau so wie toString. Wenn man jedoch wie folgt auf ein Element eines Arrays versucht zuzugreifen, wird ein Syntaxfehler ausgegeben, da der Name der Eigenschaft ungültig ist:

+ +
console.log(arr.0); // Syntaxfehler
+
+ +

Es gibt nichts Besonderes an JavaScript-Arrays und den Eigenschaften, die dies verursachen. JavaScript-Eigenschaften, die mit einer Ziffer beginnen, können nicht mit Punktnotation referenziert werden und müssen über Klammernotation aufgerufen werden. Wenn man beispielsweise ein Objekt mit einer Eigenschaft namens '3d' hat, kann es nur in Klammern angegeben werden, z. B.:

+ +
var years = [1950, 1960, 1970, 1980, 1990, 2000, 2010];
+console.log(years.0);   // ein Syntaxfehler
+console.log(years[0]);  // funktioniert
+
+ +
renderer.3d.setTexture(model, 'character.png');     // ein Syntaxfehler
+renderer['3d'].setTexture(model, 'character.png');  // works funktioniert
+
+ +

Beachten Sie, dass im obigen Beispiel '3d' in Anführungszeichen gesetzt werden musste. Es ist auch möglich, die JavaScript-Array-Indizes in Anführungszeichen zu setzen (z. B. years['2'] statt years[2]), obwohl dies nicht erforderlich ist. Die 2 in years[2] wird von der JavaScript-Engine durch eine implizite Konvertierung mittels toString zwingend in eine Zeichenfolge umgewandelt. Aus diesem Grund beziehen sich '2' und '02' auf zwei unterschiedliche Elemente des years-Objekts und das folgende Beispiel würde true ergeben:

+ +
console.log(years['2'] != years['02']);
+
+ +

Ebenso kann auf Objekteigenschaften, die zufällig reservierte Wörter(!) sind, nur als Stringliterale in Klammern zugegriffen werden:

+ +
var promise = {
+  'var'  : 'text',
+  'array': [1, 2, 3, 4]
+};
+
+console.log(promise['var']);
+
+ +

Beziehung zwischen length und numerischen Eigenschaften

+ +

Die Eigenschaft {{jsxref("Array.length", "length")}} eines JavaScript-Arrays und numerische Eigenschaften sind miteinander verbunden. Etliche der eingebauten Array-Methoden (z. B. {{jsxref("Array.join", "join()")}}, {{jsxref("Array.slice", "slice()")}}, {{jsxref("Array.indexOf", "indexOf()")}}, etc.) berücksichtigen den Wert der {{jsxref("Array.length", "length")}} Eigenschaft eines Arrays, wenn diese aufgerufen werden. Andere Methoden (z. B. {{jsxref("Array.push", "push()")}}, {{jsxref("Array.splice", "splice()")}}, etc.) bewirken ebenfalls eine Veränderung der Eigenschaft {{jsxref("Array.length", "length")}} eines Arrays.

+ +
var fruits = [];
+fruits.push('banana', 'apple', 'peach');
+
+console.log(fruits.length); // 3
+
+ +

Wird einem JavaScript-Array eine Eigenschaft zugewiesen, bei der es sich um einen gültigen Array-Index handelt und dieser Index außerhalb der aktuellen Grenzen des Arrays liegt, aktualisiert die Engine die Eigenschaft {{jsxref("Array.length", "length")}} des Arrays entsprechend:

+ +
fruits[5] = 'mango';
+console.log(fruits[5]); // 'mango'
+console.log(Object.keys(fruits));  // ['0', '1', '2', '5']
+console.log(fruits.length); // 6
+
+ +

Beim Erhöhen von {{jsxref("Array.length", "length")}}.

+ +
fruits.length = 10;
+console.log(Object.keys(fruits)); // ['0', '1', '2', '5']
+console.log(fruits.length); // 10
+
+ +
+

Beim Verringern von {{jsxref("Array.length", "length")}} werden jedoch Elemente gelöscht.

+ +
fruits.length = 2;
+console.log(Object.keys(fruits)); // ['0', '1']
+console.log(fruits.length); // 2
+
+ +

Der Artikel zu {{jsxref("Array.length")}} geht genauer darauf ein.

+
+ +

Erstellen eines Arrays als Ergebnis einer Übereinstimmung

+ +

Das Ergebnis einer Übereinstimmung eines regulären Ausdrucks und einem String kann ein JavaScript-Array erstellen. Dieses Array verfügt über Eigenschaften und Elemente, die Informationen zur Übereinstimmung beinhalten. Solch ein Array wird von {{jsxref("RegExp.exec")}}, {{jsxref("String.match")}} und {{jsxref("String.replace")}} zurückgegeben. Am folgenden Beispiel sollen diese Eigenschaften und Elemente erläutert werden, die Tabelle darunter enthält; weitere Informationen hierzu:

+ +
// Übereinstimmung eines d, gefolgt von einem oder mehreren b, gefolgt von einem d
+// Übereinstimmende b's und die darauf folgenden d's merken
+// Groß-/Kleinschreibung ignorieren
+
+var myRegEx = /d(b+)(d)/i;
+var myArray = myRegEx.exec('cdbBdbsbz');
+ +

Die Eigenschaften und Elemente werden wie folgt zurückgegeben:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Eigenschaft/ElementBeschreibungBeispiel
input +

Eine schreibgeschützte Eigenschaft, die die ursprüngliche Zeichenfolge widerspiegelt, mit der der reguläre Ausdruck abgeglichen wurde.

+ 		cdbBdbsbz
indexEine schreibgeschützte Eigenschaft, bei der es sich um den nullbasierten Index der Übereinstimmung in der Zeichenfolge handelt.1
[0]Ein schreibgeschütztes Element, das die zuletzt übereinstimmenden Zeichen angibt.dbBd
[1], ...[n]Schreibgeschützte Elemente, die die in Klammern gesetzten Unterzeichenfolgen angeben, sofern sie im regulären Ausdruck enthalten sind. Die Anzahl der möglichen geklammerten Teilzeichenfolgen ist unbegrenzt.[1]: bB
+ [2]: d
+ +

Eigenschaften

+ +
+
Array.length
+
Die Eigenschaft length des Array-Konstruktors, deren Wert 1 ist.
+
{{jsxref("Array.@@species", "get Array[@@species]")}}
+
Die Konstruktorfunktion zum Erstellen abgeleiteter Objekte.
+
{{jsxref("Array.prototype")}}
+
Ermöglicht das Hinzufügen von Eigenschaften zu allen Array-Objekten.
+
+ +

Methoden

+ +
+
{{jsxref("Array.from()")}}
+
Erstellt eine neue Array-Instanz aus einem Array-ähnlichen oder iterierbaren Objekt.
+
{{jsxref("Array.isArray()")}}
+
Gibt true zurück, wenn eine Variable ein Array ist, andernfalls false.
+
{{jsxref("Array.of()")}}
+
Erstellt eine neue Array-Instanz mit einer variablen Anzahl von Argumenten, unabhängig von Anzahl oder Typ der Argumente.
+
+ +

Array Instanzen

+ +

Alle Array-Instanzen erben von {{jsxref("Array.prototype")}}. Das Prototypobjekt des Array-Konstruktors kann geändert werden, um alle Array-Instanzen zu beeinflussen.

+ +

Eigenschaften

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Eigenschaften')}}
+ +

Methoden

+ +

Mutationsmethoden

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Mutationsmethoden')}}
+ +

Zugriffsmethoden

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Zugriffsmethoden')}}
+ +

Zählmethoden

+ +
{{page('/de/docs/Web/JavaScript/Reference/Global_Objects/Array/prototype', 'Zählmethoden')}}
+ +

Generische Array-Methoden

+ +
+

Generische Array Methoden sind nicht standardisiert, veraltet und werden in naher Zukunft entfernt.

+
+ +

Manchmal möchte man Array-Methoden auf Strings oder andere Array-ähnliche Objekte anwenden (z. B. auf {{jsxref("Functions/arguments", "Argumente", "", 1)}} von Funktionen). Auf diese Weise behandelt man eine Zeichenfolge wie ein Array von Zeichen (oder ein nicht-Array wie ein Array). Um beispielsweise zu prüfen, ob jedes Zeichen in der Variablen str ein Buchstabe ist, würde man Folgendes schreiben:

+ +
function isLetter(character) {
+  return character >= 'a' && character <= 'z';
+}
+
+if (Array.prototype.every.call(str, isLetter)) {
+  console.log("The string '" + str + "' contains only letters!");
+}
+ +

Diese Schreibweise wurde in JavaScript 1.6 von einer kürzeren abgelöst:

+ +
if (Array.every(str, isLetter)) {
+  console.log("The string '" + str + "' contains only letters!");
+}
+
+ +

{{jsxref("Global_Objects/String", "Generische Methoden", "#Generische_String-Methoden", 1)}} gibt es ebenfalls für {{jsxref("Global_Objects/String", "Strings")}}.

+ +

Diese sind nicht Teil der ECMAScript-Standards und werden von nicht-Gecko-Browsern nicht unterstützt. Als Standardvariante können Sie Ihr Objekt mit {{jsxref("Array.from()")}} in ein richtiges Array konvertieren. Diese Methode wird in alten Browsern möglicherweise nicht unterstützt:

+ +
if (Array.from(str).every(isLetter)) {
+  console.log("The string '" + str + "' contains only letters!");
+}
+
+ +

Beispiele

+ +

Erstellen eines Arrays

+ +

Das folgende Beispiel erzeugt ein Array msgArray mit der Länge 0, weist dann msgArray[0] und msgArray[99] Werte zu und ändert somit die Länge des Arrays auf 100.

+ +
var msgArray = [];
+msgArray[0] = 'Hello';
+msgArray[99] = 'world';
+
+if (msgArray.length === 100) {
+  console.log('Die Länge ist 100.');
+}
+
+ +

Erstellen eines zweidimensionalen Arrays

+ +

Im Folgenden wird ein Schachbrett als zweidimensionales Array von Strings erzeugt. Der erste Zug erfolgt durch Kopieren des 'p' in (6,4) nach (4,4). Die alte Position (6,4) wird als leer markiert.

+ +
var board = [
+  ['R','N','B','Q','K','B','N','R'],
+  ['P','P','P','P','P','P','P','P'],
+  [' ',' ',' ',' ',' ',' ',' ',' '],
+  [' ',' ',' ',' ',' ',' ',' ',' '],
+  [' ',' ',' ',' ',' ',' ',' ',' '],
+  [' ',' ',' ',' ',' ',' ',' ',' '],
+  ['p','p','p','p','p','p','p','p'],
+  ['r','n','b','q','k','b','n','r'] ];
+
+console.log(board.join('\n') + '\n\n');
+
+// Ziehe Bauern 2 Felder vorwärts
+board[4][4] = board[6][4];
+board[6][4] = ' ';
+console.log(board.join('\n'));
+
+ +

Das ist die Ausgabe:

+ +
R,N,B,Q,K,B,N,R
+P,P,P,P,P,P,P,P
+ , , , , , , ,
+ , , , , , , ,
+ , , , , , , ,
+ , , , , , , ,
+p,p,p,p,p,p,p,p
+r,n,b,q,k,b,n,r
+
+R,N,B,Q,K,B,N,R
+P,P,P,P,P,P,P,P
+ , , , , , , ,
+ , , , , , , ,
+ , , , ,p, , ,
+ , , , , , , ,
+p,p,p,p, ,p,p,p
+r,n,b,q,k,b,n,r
+
+ +

Einsatz eines Arrays, um Werte tabellarisch auszugeben

+ +
values = [];
+for (var x = 0; x < 10; x++){
+ values.push([
+  2 ** x,
+  2 * x ** 2
+ ])
+};
+console.table(values)
+ +

Das Resultat ist:

+ +
0   1   0
+1   2   2
+2   4   8
+3   8   18
+4   16  32
+5   32  50
+6   64  72
+7   128 98
+8   256 128
+9   512 162
+ +

(Die erste Spalte ist der Index)

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.4', 'Array')}}{{Spec2('ES5.1')}}Neue Methoden hinzugefügt: {{jsxref("Array.isArray")}}, {{jsxref("Array.prototype.indexOf", "indexOf")}}, {{jsxref("Array.prototype.lastIndexOf", "lastIndexOf")}}, {{jsxref("Array.prototype.every", "every")}}, {{jsxref("Array.prototype.some", "some")}}, {{jsxref("Array.prototype.forEach", "forEach")}}, {{jsxref("Array.prototype.map", "map")}}, {{jsxref("Array.prototype.filter", "filter")}}, {{jsxref("Array.prototype.reduce", "reduce")}}, {{jsxref("Array.prototype.reduceRight", "reduceRight")}}
{{SpecName('ES6', '#sec-array-objects', 'Array')}}{{Spec2('ES6')}}Neue Methoden hinzugefügt: {{jsxref("Array.from")}}, {{jsxref("Array.of")}}, {{jsxref("Array.prototype.find", "find")}}, {{jsxref("Array.prototype.findIndex", "findIndex")}}, {{jsxref("Array.prototype.fill", "fill")}}, {{jsxref("Array.prototype.copyWithin", "copyWithin")}}
{{SpecName('ES7', '#sec-array-objects', 'Array')}}{{Spec2('ES7')}}Neue Methode hinzugefügt: {{jsxref("Array.prototype.includes()")}}
{{SpecName('ESDraft', '#sec-array-objects', 'Array')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ + + +

{{Compat("javascript.builtins.Array")}}

+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/indexof/index.html b/files/de/web/javascript/reference/global_objects/array/indexof/index.html new file mode 100644 index 0000000000..1768427494 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/indexof/index.html @@ -0,0 +1,226 @@ +--- +title: Array.prototype.indexOf() +slug: Web/JavaScript/Reference/Global_Objects/Array/indexOf +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/indexOf +--- +
{{JSRef}}
+ +

Die Methode indexOf() gibt den Index zurück, an dem ein bestimmtes Element im Array zum ersten Mal auftritt oder -1 wenn es nicht vorhanden ist.

+ +
+

Hinweis: Für die String Methode, siehe {{jsxref("String.prototype.indexOf()")}}.

+
+ +
{{EmbedInteractiveExample("pages/js/array-indexof.html")}}
+ + + +

Syntax

+ +
arr.indexOf(searchElement[, fromIndex])
+ +

Parameter

+ +
+
searchElement
+
Element, das im Array gefunden werden soll.
+
fromIndex {{optional_inline}}
+
Der Index, an dem die Suche beginnen soll. Wenn dieser Index größer oder gleich der Länge des Arrays ist, wird -1 zurückgegeben, d. h. das Array wird nicht durchsucht. Ist der Startindex negativ, wird er als Versatz vom Ende des Arrays verstanden. Das Array wird dann immer noch von vorne nach hinten durchsucht.
+
+ +

Rückgabewert

+ +

Der Index, an dem das gefundene Element das erste Mal angetroffen wurde, andernfalls -1 wenn nichts gefunden wurde.

+ +

Beschreibung

+ +

indexOf() vergleicht searchElement mit Elementen des Arrays mittels strikter Gleichheit (dieselbe Methode, die bei === angewendet wird).

+ +

Beispiele

+ +

Verwendung von indexOf()

+ +

Das folgende Beispiel nutzt indexOf() um Werte in einem Array zu ermitteln.

+ +
var array = [2, 9, 9];
+array.indexOf(2);     // 0
+array.indexOf(7);     // -1
+array.indexOf(9, 2);  // 2
+array.indexOf(2, -1); // -1
+array.indexOf(2, -3); // 0
+
+ +

Alle Vorkommnisse eines Elements ermitteln

+ +
var indices = [];
+var array = ['a', 'b', 'a', 'c', 'a', 'd'];
+var element = 'a';
+var idx = array.indexOf(element);
+while (idx != -1) {
+  indices.push(idx);
+  idx = array.indexOf(element, idx + 1);
+}
+console.log(indices);
+// [0, 2, 4]
+
+ +

Ermitteln, ob ein Element in einem Array existiert und das Array aktualisieren

+ +
function updateVegetablesCollection (veggies, veggie) {
+    if (veggies.indexOf(veggie) === -1) {
+        veggies.push(veggie);
+        console.log('New veggies collection is : ' + veggies);
+    } else if (veggies.indexOf(veggie) > -1) {
+        console.log(veggie + ' already exists in the veggies collection.');
+    }
+}
+
+var veggies = ['potato', 'tomato', 'chillies', 'green-pepper'];
+
+updateVegetablesCollection(veggies, 'spinach');
+// New veggies collection is : potato,tomato,chillies,green-pepper,spinach
+updateVegetablesCollection(veggies, 'spinach');
+// spinach already exists in the veggies collection.
+
+ +

Polyfill

+ +

indexOf() wurde dem ECMA-262-Standard in der 5. Auflage hinzugefügt. Als solches ist es möglicherweise nicht in allen Implementierungen des Standards enthalten. Sie können dies umgehen, indem Sie den folgenden Code am Anfang Ihrer Skripte einfügen, um die Verwendung von indexOf() in Implementierungen zu ermöglichen, die es nicht nativ unterstützen. Dieser Algorithmus entspricht dem in der 5. Auflage von ECMA-262 angegebenen Algorithmus, vorausgesetzt {{jsxref("TypeError")}} und {{jsxref("Math.abs()")}} haben ihre ursprünglichen Werte.

+ +
if (!Array.prototype.indexOf)  Array.prototype.indexOf = (function(Object, max, min){
+  "use strict";
+  return function indexOf(member, fromIndex) {
+    if(this===null||this===undefined)throw TypeError("Array.prototype.indexOf called on null or undefined");
+
+    var that = Object(this), Len = that.length >>> 0, i = min(fromIndex | 0, Len);
+    if (i < 0) i = max(0, Len+i); else if (i >= Len) return -1;
+
+    if(member===void 0){ for(; i !== Len; ++i) if(that[i]===void 0 && i in that) return i; // undefined
+    }else if(member !== member){   for(; i !== Len; ++i) if(that[i] !== that[i]) return i; // NaN
+    }else                           for(; i !== Len; ++i) if(that[i] === member) return i; // all else
+
+    return -1; // if the value was not found, then return -1
+  };
+})(Object, Math.max, Math.min);
+
+ +

Wenn Sie sich jedoch mehr für all die kleinen technischen Elemente interessieren, die durch den ECMA-Standard definiert werden, und Leistung oder Prägnanz weniger von Belang sind, dann könnte diese erklärende Polyfill-Lösung nützlicher für Sie sein.

+ +
// Production steps of ECMA-262, Edition 5, 15.4.4.14
+// Reference: http://es5.github.io/#x15.4.4.14
+if (!Array.prototype.indexOf) {
+  Array.prototype.indexOf = function(searchElement, fromIndex) {
+
+    var k;
+
+    // 1. Let o be the result of calling ToObject passing
+    //    the this value as the argument.
+    if (this == null) {
+      throw new TypeError('"this" is null or not defined');
+    }
+
+    var o = Object(this);
+
+    // 2. Let lenValue be the result of calling the Get
+    //    internal method of o with the argument "length".
+    // 3. Let len be ToUint32(lenValue).
+    var len = o.length >>> 0;
+
+    // 4. If len is 0, return -1.
+    if (len === 0) {
+      return -1;
+    }
+
+    // 5. If argument fromIndex was passed let n be
+    //    ToInteger(fromIndex); else let n be 0.
+    var n = fromIndex | 0;
+
+    // 6. If n >= len, return -1.
+    if (n >= len) {
+      return -1;
+    }
+
+    // 7. If n >= 0, then Let k be n.
+    // 8. Else, n<0, Let k be len - abs(n).
+    //    If k is less than 0, then let k be 0.
+    k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);
+
+    // 9. Repeat, while k < len
+    while (k < len) {
+      // a. Let Pk be ToString(k).
+      //   This is implicit for LHS operands of the in operator
+      // b. Let kPresent be the result of calling the
+      //    HasProperty internal method of o with argument Pk.
+      //   This step can be combined with c
+      // c. If kPresent is true, then
+      //    i.  Let elementK be the result of calling the Get
+      //        internal method of o with the argument ToString(k).
+      //   ii.  Let same be the result of applying the
+      //        Strict Equality Comparison Algorithm to
+      //        searchElement and elementK.
+      //  iii.  If same is true, return k.
+      if (k in o && o[k] === searchElement) {
+        return k;
+      }
+      k++;
+    }
+    return -1;
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('ES5.1', '#sec-15.4.4.14', 'Array.prototype.indexOf')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.6.
{{SpecName('ES6', '#sec-array.prototype.indexof', 'Array.prototype.indexOf')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.indexof', 'Array.prototype.indexOf')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.indexOf")}}

+
+ +

Kompatibilitätshinweise

+ + + +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/isarray/index.html b/files/de/web/javascript/reference/global_objects/array/isarray/index.html new file mode 100644 index 0000000000..2bdca7596a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/isarray/index.html @@ -0,0 +1,121 @@ +--- +title: Array.isArray() +slug: Web/JavaScript/Reference/Global_Objects/Array/isArray +tags: + - Array + - ECMAScript5 + - JavaScript + - Method + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/isArray +--- +
{{JSRef}}
+ +

Die Array.isArray() Funktion prüft, ob das übergebene Objekt ein {{jsxref("Array")}} ist.

+ +
Array.isArray([1, 2, 3]);  // true
+Array.isArray({foo: 123}); // false
+Array.isArray('foobar');   // false
+Array.isArray(undefined);  // false
+
+ +

Syntax

+ +
Array.isArray(obj)
+ +

Parameter

+ +
+
value
+
Der zu überprüfende Wert.
+
+ +

Rückgabewert

+ +

Wenn der Wert ein {{jsxref("Array")}} ist wird true zurückgegeben, andernfalls false.

+ +

Beschreibung

+ +

Wenn der Wert ein {{jsxref("Array")}} ist, wir true zurückzugeben, andernfalls false.

+ +

Eine detailliertere Beschreibung ist im Artikel Determining with absolute accuracy whether or not a JavaScript object is an array enthalten (auf Englisch). Wird eine {{jsxref("TypedArray")}}-Instanz geprüft, wird immer false zurückgegeben.

+ +

Beispiele

+ +

Einsatz von Array.isArray

+ +
// die folgenden Ausdrücke geben true zurück
+Array.isArray([]);
+Array.isArray([1]);
+Array.isArray(new Array());
+Array.isArray(new Array('a', 'b', 'c', 'd'));
+Array.isArray(new Array(3));
+// wenig bekannt: Array.prototype ist selbst ein Array.
+Array.isArray(Array.prototype);
+
+// die folgenden Ausdrücke geben alle false zurück
+Array.isArray();
+Array.isArray({});
+Array.isArray(null);
+Array.isArray(undefined);
+Array.isArray(17);
+Array.isArray("Array");
+Array.isArray(true);
+Array.isArray(false);
+Array.isArray(new Uint8Array(32));
+Array.isArray({ __proto__ : Array.prototype });
+
+ +

instanceof vs isArray

+ +

Wenn auf eine Array Instanz geprüft wird, ist Array.isArray besser geeignet als instanceof, weil es auch mit iframes funktioniert.

+ +
var iframe = document.createElement('iframe');
+document.body.appendChild(iframe);
+xArray = window.frames[window.frames.length-1].Array;
+var arr = new xArray(1,2,3); // [1,2,3]
+
+// Richtiges Prüfen für Arrays
+Array.isArray(arr);   // true
+// Als nicht richtig angesehen, weil es nicht mit iframes funktioniert
+arr instanceof Array; // false
+
+ +

Polyfill

+ +

Der folgende Code implementiert die Methode, wenn Array.isArray() nicht nativ unterstützt wird.

+ +
if(!Array.isArray) {
+  Array.isArray = function (vArg) {
+    return Object.prototype.toString.call(vArg) === "[object Array]";
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + +
Spezifikation
{{SpecName('ESDraft', '#sec-array.isarray', 'Array.isArray')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.isArray")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/join/index.html b/files/de/web/javascript/reference/global_objects/array/join/index.html new file mode 100644 index 0000000000..4e986bebda --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/join/index.html @@ -0,0 +1,114 @@ +--- +title: Array.prototype.join() +slug: Web/JavaScript/Reference/Global_Objects/Array/join +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/join +--- +
{{JSRef}}
+ +

Die join() Methode verkettet alle Elemente eines Arrays (oder Array-ähnlicher Objekte) durch Kommata getrennt oder einem angegebenen Trennzeichen in einem String und gibt diesen zurück. Enthält das Array nur ein Element wird nur dieses ohne Trennzeichen zurückgegeben.

+ +
{{EmbedInteractiveExample("pages/js/array-join.html")}}
+ + + +

Syntax

+ +
arr.join([separator])
+ +

Parameter

+ +
+
separator {{optional_inline}}
+
Gibt einen String an, um jedes Paar benachbarter Elemente des Arrays voneinander zu trennen. Das Trennzeichen wird bei Bedarf in einen String umgewandelt. Wenn nicht angegeben, werden die Array-Elemente durch ein Komma (",") getrennt. Wenn separator ein leerer String ist, werden alle Elemente ohne Trennzeichen miteinander verbunden.
+
+ +

Rückgabewert

+ +

Ein String in dem alle Arrayelemente verkettet sind. Wenn arr.length gleich 0 ist, wird der leere String zurückgegeben.

+ +

Beschreibung

+ +

Alle Elemente des Arrays werden in Strings umgewandelt und in einem String miteinander verkettet

+ +
+

Falls ein Element undefined oder null ist, wird es in einen leeren String umgewandelt.

+
+ +

Beispiele

+ +

Einen Array auf vier verschiedene Arten zusammenführen

+ +

Im folgenden Beispiel wird ein Array a mit drei Elementen erstellt, das dann viermal mit miteinander verbunden wird: mit dem Standardtrennzeichen, einem Komma mit Leerzeichen, einem Pluszeichen und einem leeren String.

+ +
var a = ['Wind', 'Rain', 'Fire'];
+a.join();       // 'Wind,Rain,Fire'
+a.join(', ');   // 'Wind, Rain, Fire'
+a.join(' + ');  // 'Wind + Rain + Fire'
+a.join('');     // 'WindRainFire'
+
+ +

Zusammenführen eines Array-ähnlichen Objekts

+ +

Das Folgende Beispiel fügt ein Array-ähnliches Objekt ({{jsxref("Functions/arguments", "arguments")}}) zusammen, indem {{jsxref("Function.prototype.call", "call()")}} auf Array.prototype.join aufgerufen wird.

+ +
function f(a, b, c) {
+  var s = Array.prototype.join.call(arguments);
+  console.log(s); // '1,a,true'
+}
+f(1, 'a', true);
+// Erwartete Ausgabe: "1,a,true"
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.4.4.5', 'Array.prototype.join')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.join', 'Array.prototype.join')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.join', 'Array.prototype.join')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.join")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/keys/index.html b/files/de/web/javascript/reference/global_objects/array/keys/index.html new file mode 100644 index 0000000000..e809654bcc --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/keys/index.html @@ -0,0 +1,76 @@ +--- +title: Array.prototype.keys() +slug: Web/JavaScript/Reference/Global_Objects/Array/keys +tags: + - Array + - ECMAScript 2015 + - Iterator + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/keys +--- +
{{JSRef}}
+ +

Die keys() Methode gibt ein neues Array Iterator Objekt zurück, welches den Schlüssel für jeden Index des Arrays enthält.

+ +
{{EmbedInteractiveExample("pages/js/array-keys.html")}}
+ + + +

Syntax

+ +
arr.keys()
+ +

Rückgabewert

+ +

Ein neues {{jsxref("Array")}} iterator-Objekt.

+ +

Beispiele

+ +

Der Key Iterator ignoriert keine Lücken

+ +
var arr = ['a', , 'c'];
+var sparseKeys = Object.keys(arr);
+var denseKeys = [...arr.keys()];
+console.log(sparseKeys); // ['0', '2']
+console.log(denseKeys);  // [0, 1, 2]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-array.prototype.keys', 'Array.prototype.keys')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype.keys', 'Array.prototype.keys')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.keys")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/lastindexof/index.html b/files/de/web/javascript/reference/global_objects/array/lastindexof/index.html new file mode 100644 index 0000000000..7ad2b99661 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/lastindexof/index.html @@ -0,0 +1,168 @@ +--- +title: Array.prototype.lastIndexOf() +slug: Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf +tags: + - Array + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/lastIndexOf +--- +
{{JSRef}}
+ +

Die lastIndexOf() Methode gibt den letzten Index zurück, an dem ein übergebenes Element im Array gefunden wurde, oder -1, wenn es nicht vorhanden ist. Das Array wird rückwärts durchsucht beginnend beim fromIndex.

+ +
{{EmbedInteractiveExample("pages/js/array-lastindexof.html")}}
+ + + +

Syntax

+ +
arr.lastIndexOf(searchElement)
+arr.lastIndexOf(searchElement, fromIndex)
+
+ +

Parameter

+ +
+
searchElement
+
Element, nach dem im Feld gesucht wird.
+
fromIndex {{optional_inline}}
+
Der Index an dem die Suche rückwärts begonnen wird. Der Standardwert ist die Arraylänge minus eins (arr.length - 1), d. h. das gesamte Feld wird durchsucht. Wenn der Index größer oder gleich der Länge des Arrays ist, wird das gesamte Array durchsucht. Ist der Index eine negative Zahl, wird er als Offset vom Ende des Arrays behandelt. Bei Verwendung eines negativen Index wird das Array trotzdem von hinten nach vorne durchsucht. Wenn der errechnete Index kleiner als 0 ist, wird -1 zurückgegeben, d.h. das Feld wird nicht durchsucht.
+
+ +

Rückgabewert

+ +

Der letzte Index des gesuchten Elementes aus dem Feld. -1 wenn keins gefunden wurde.

+ +

Beschreibung

+ +

lastIndexOf vergleicht das searchElement mit den Elementen des Feldes und verwendet hierzu die strikte Gleichheit (Die gleiche Methode, die beim === Operator  (triple-equals) angewendet wird.

+ +

Beispiele

+ +

lastIndexOf verwenden

+ +

Das folgende Beispiel verwendet lastIndexOf, um Werte in einem Array zu finden.

+ +
var numbers = [2, 5, 9, 2];
+numbers.lastIndexOf(2);     // 3
+numbers.lastIndexOf(7);     // -1
+numbers.lastIndexOf(2, 3);  // 3
+numbers.lastIndexOf(2, 2);  // 0
+numbers.lastIndexOf(2, -2); // 0
+numbers.lastIndexOf(2, -1); // 3
+
+ +

Finde jedes Vorkommen eines Elementes

+ +

Das folgende Beispiel benutzt lastIndexOf, um alle Indizes eines Elementes in einem Array zu finden, wobei sie mit Hilfe von {{jsxref("Array.prototype.push", "push")}} zu einem anderen Array hinzugefügt werden, sobald sie gefunden werden.

+ +
var indices = [];
+var array = ['a', 'b', 'a', 'c', 'a', 'd'];
+var element = 'a';
+var idx = array.lastIndexOf(element);
+while (idx != -1) {
+  indices.push(idx);
+  idx = (idx > 0 ? array.lastIndexOf(element, idx - 1) : -1);
+}
+
+console.log(indices);
+// [4, 2, 0]
+
+ +

Der Fall idx == 0 muss hier separat behandelt werden, weil das Element immer gefunden wird, unabhängig vom fromIndex Parameter, falls es das erste Element im Feld ist. Das ist der Unterschieder zur {{jsxref("Array.prototype.indexOf", "indexOf")}} Methode.

+ +

Polyfill

+ +

lastIndexOf wurde dem ECMA-262-Standard in der fünften Edition hinzugefügt;  sie könnte daher nicht in allen Browsern verfügbar sein. Der Fehler kann umgangen werden, indem der folgende Code zu Beginn eines Skriptes eingesetzt wird. Dies ermöglicht die Verwendung von lastIndexOf, auch wenn die Methode nativ nicht unterstützt wird. Dieser Algorithmus stimmt mit dem überein, was in ECMA-262 der 5. Edition, spezifiziert wurde, unter der Annahme, dass {{jsxref("Object")}}, {{jsxref("TypeError")}}, {{jsxref("Number")}}, {{jsxref("Math.floor")}}, {{jsxref("Math.abs")}}, und {{jsxref("Math.min")}} ihre originalen Werte haben.

+ +
// Production steps of ECMA-262, Edition 5, 15.4.4.15
+// Reference: http://es5.github.io/#x15.4.4.15
+if (!Array.prototype.lastIndexOf) {
+  Array.prototype.lastIndexOf = function(searchElement /*, fromIndex*/) {
+    'use strict';
+
+    if (this === void 0 || this === null) {
+      throw new TypeError();
+    }
+
+    var n, k,
+      t = Object(this),
+      len = t.length >>> 0;
+    if (len === 0) {
+      return -1;
+    }
+
+    n = len - 1;
+    if (arguments.length > 1) {
+      n = Number(arguments[1]);
+      if (n != n) {
+        n = 0;
+      }
+      else if (n != 0 && n != (1 / 0) && n != -(1 / 0)) {
+        n = (n > 0 || -1) * Math.floor(Math.abs(n));
+      }
+    }
+
+    for (k = n >= 0 ? Math.min(n, len - 1) : len - Math.abs(n); k >= 0; k--) {
+      if (k in t && t[k] === searchElement) {
+        return k;
+      }
+    }
+    return -1;
+  };
+}
+
+ +

Erneute Anmerkung: Diese Implementation zielt auf eine absolute Kompatibilität von lastIndexOf mit Firefox und der SpiderMonkey JavaScript Umgebung aus, inklusive einigen Fällen, welche wohl Grenzfälle sind. Beim Vorhaben diese Funktion in eigenen Applikationen zu verwenden, ist eine Berechnung von from mit weniger komplizierten Code möglich, wenn diese Fälle ignoriert werden.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.15', 'Array.prototype.lastIndexOf')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.6.
{{SpecName('ES6', '#sec-array.prototype.lastindexof', 'Array.prototype.lastIndexOf')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.lastindexof', 'Array.prototype.lastIndexOf')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.lastIndexOf")}}

+
+ +

Kompatibilitätshinweise

+ + + +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/length/index.html b/files/de/web/javascript/reference/global_objects/array/length/index.html new file mode 100644 index 0000000000..5357719669 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/length/index.html @@ -0,0 +1,149 @@ +--- +title: Array.prototype.length +slug: Web/JavaScript/Reference/Global_Objects/Array/length +tags: + - Array + - JavaScript + - Property + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/length +--- +
{{JSRef}}
+ +

Die length Eigenschaft eines Objektes vom Typ Array setzt die Anzahl der Elemente in einem Array oder gibt diese Anzahl zurück. Der Wert ist eine vorzeichenlose, 32-Bit Ganzzahl, welche größer als der größte Index im Array ist.

+ +
{{EmbedInteractiveExample("pages/js/array-length.html")}}
+ + + +

Beschreibung

+ +

Der Wert der length Eigenschaft ist ein positive, ganze Zahl und hat einen Wert kleiner als 232.

+ +
var namelistA = new Array(4294967296); //4294967296 = 232
+var namelistC = new Array(-100) //negative sign
+
+console.log(namelistA.length); //RangeError: Invalid array length
+console.log(namelistC.length); //RangeError: Invalid array length
+
+
+
+var namelistB = [];
+namelistB.length = Math.pow(2,32)-1; //set array length less than 2 to the 32nd power
+console.log(namelistB.length);
+
+//4294967295
+
+ +

Man kann die length Eigenschaft eines Array zu jeder Zeit ändern, um das Array zu kürzen. Wenn ein Array mit dem Ändern der length Eigenschaft vergrößert wird, erhöht sich die Anzahl der der tatsächlichen Elemente. Wenn z. B. length auf 3 gesetzt wird und die aktuelle länge 2 ist, dann enthält das Array 3 Elemente, wobei das dritte Element undefined ist.

+ +
var arr = [1, 2, 3];
+printEntries(arr);
+
+arr.length = 5; // set array length to 5 while currently 3.
+printEntries(arr);
+
+function printEntries(arr) {
+  var length = arr.length;
+  for (var i = 0; i < length; i++) {
+    console.log(arr[i]);
+  }
+  console.log('=== printed ===');
+}
+
+// 1
+// 2
+// 3
+// === printed ===
+// 1
+// 2
+// 3
+// undefined
+// undefined
+// === printed ===
+ +

Jedoch sagt die length Eigenschaft nicht zwangsläufig etwas über die Anzahl der definierten Werte in einem Array aus. Mehr dazu im Artikel Beziehung zwischen Längen und nummerischen Eigenschaften.

+ +

{{js_property_attributes(1, 0, 0)}}

+ +
+ +
+ +

Beispiele

+ +

Iterieren über ein Array

+ +

Im folgenden Beispiel wird über das numbers Array iteriert. Dabei wird die length Eigenschaft verwendet, um festzustellen, wie viele Elemente das Array enthält. Der Wert jedes Elements wird dabei verdoppelt.

+ +
var numbers = [1, 2, 3, 4, 5];
+
+for (var i = 0; i < numbers.length; i++) {
+  numbers[i] *= 2;
+}
+// numbers enthält jetzt die Werte: [2, 4, 6, 8, 10]
+
+ +

Verkürzung eines Arrays

+ +

Das folgende Beispiel verkürzt das Array numbers auf eine Länge von 3, wenn die Länge größer als 3 ist.

+ +
var numbers = [1, 2, 3, 4, 5];
+
+if (numbers.length > 3) {
+  numbers.length = 3;
+}
+
+console.log(numbers);        // [1, 2, 3]
+console.log(numbers.length); // 3
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKomment
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.4.5.2', 'Array.length')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-properties-of-array-instances-length', 'Array.length')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-properties-of-array-instances-length', 'Array.length')}}{{Spec2('ESDraft')}}
+ +

Browserkompabilität

+ +
+ + +

{{Compat("javascript.builtins.Array.length")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/map/index.html b/files/de/web/javascript/reference/global_objects/array/map/index.html new file mode 100644 index 0000000000..8227658ca6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/map/index.html @@ -0,0 +1,337 @@ +--- +title: Array.prototype.map() +slug: Web/JavaScript/Reference/Global_Objects/Array/map +tags: + - Array + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - Reference + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/map +--- +
{{JSRef}}
+ +

Die map() (engl. abbilden) Methode wendet auf jedes Element des Arrays die bereitgestellte Funktion an und gibt das Ergebnis in einem neuen Array zurück.

+ +
{{EmbedInteractiveExample("pages/js/array-map.html")}}
+ + + +

Syntax

+ +
var new_array = arr.map(function callback(currentValue[, index[, array]]) {
+    // Zurückgegebenes Element für new_array
+}[, thisArg])
+ +

Parameter

+ +
+
callback
+
Funktion, die ein Element für das neue Array erstellt und drei Argumente entgegennimmt:
+
+
+
currentValue
+
Das aktuelle Element, das im Array verarbeitet wird.
+
index{{optional_inline}}
+
Der Index des aktuellen Elements, das im Array verarbeitet wird.
+
array{{optional_inline}}
+
Das Array, welches mit map() durchlaufen wird.
+
+
+
thisArg{{optional_inline}}
+
Wert, der als this verwendet wird, wenn callback ausgeführt wird.
+
+ +

Rückgabewert

+ +

Ein neues Array, von dem jedes Element das Ergebnis der Callback-Funktion ist.

+ +

Beschreibung

+ +

map() ruft eine bereitgestellte callback Funktion für jedes Element in einem Array der Reihe nach auf und erstellt aus den Ergebnissen ein neues Array. callback wird nur für Indizes des Arrays aufgerufen, denen Werte zugewiesen wurden, einschließlich {{jsxref("undefined")}}. Es wird nicht für fehlende Elemente des Arrays aufgerufen (d. h. Indizes, die noch nie festgelegt, gelöscht oder denen noch kein Wert zugewiesen wurde).

+ +

map() zu benutzen, wenn das davon neu erstellte Array nicht benutzt wird, gilt als Anti-Pattern. Verwenden Sie stattdessen {{jsxref("Array/forEach", "forEach()")}} oder {{jsxref("statements/for...of", "for...of")}}.

+ +

Sie sollten map() nicht verwenden, wenn:

+ + + +

callback wird mit drei Argumenten aufgerufen:

+ +
    +
  1. Der Wert des Elements
    2. +
  2. Der Index des Elements
    3. +
  3. Das Array-Objekt, das durchlaufen wird
    4. +
+ +

Falls der Parameter thisArg an map() übergeben wird, wird er als Wert für this innerhalb von callback verwendet. Andernfalls hat this den Wert {{jsxref("undefined")}}. Welchen Wert callback letztendlich in this steht, wird gemäß der üblichen Regeln bestimmt, nach denen this für eine Funktion ermittelt wird.

+ +

map() selbst verändert das Array nicht, auf dem es aufgerufen wird (das aufgerufene callback kann jedoch Änderungen vornehmen).

+ +

Der Bereich der von map() verarbeiteten Elemente wird vor dem ersten Aufruf von callback festgelegt. Elemente, die nach Beginn des Aufrufs von map() an das Array angehängt werden, werden von callback nicht berücksichtigt. Wenn vorhandene Elemente des Arrays geändert werden, ist der Wert maßgeblich, den map() beim Erreichen eines Elements antrifft und dann an callback übergibt. Nachfolgende Elemente, die nach Beginn eines Durchlaufs von map() gelöscht werden, bevor sie eingelesen werden konnten, werden nicht mehr berücksichtigt.

+ +

Aufgrund des in der Spezifikation definierten Algorithmus haben Arrays mit vielen leeren Elementen auch nach einem Aufruf von map() immer noch leere Elemente, wobei die leeren Elemente an ihren Indizes verbleiben.

+ +

Beispiele

+ +

Erstellen eines Arrays mit Quadratwurzeln aus einem Array mit Zahlen

+ +

Der folgende Code verwendet ein Array mit Zahlen und erstellt ein neues Array, das die Quadratwurzeln der Zahlen im ersten Array enthält.

+ +
var numbers = [1, 4, 9];
+var roots = numbers.map(Math.sqrt);
+// roots ist jetzt [1, 2, 3]
+// numbers ist immer noch [1, 4, 9]
+
+ +

Objekte innerhalb eines Arrays mit map() neu formatieren

+ +

Der folgende Code nimmt ein Array mit Objekten und erstellt daraus ein neues Array, in dem die Objekte neu formatiert wurden.

+ +
var kvArray = [{key: 1, value: 10},
+               {key: 2, value: 20},
+               {key: 3, value: 30}];
+
+var reformattedArray = kvArray.map(obj => {
+   var rObj = {};
+   rObj[obj.key] = obj.value;
+   return rObj;
+});
+// reformattedArray ist jetzt [{1: 10}, {2: 20}, {3: 30}],
+
+// kvArray ist immer noch:
+// [{key: 1, value: 10},
+//  {key: 2, value: 20},
+//  {key: 3, value: 30}]
+ +

Erstellen eines Arrays mit Zahlen mithilfe einer Funktion, die ein Argument entgegennimmt

+ +

Der folgende Code zeigt, wie map() im Zusammenhang mit einer Funktion arbeitet, welche ein Argument entgegennimmt. Dem Argument wird automatisch der Wert des aktuellen Elements des Arrays zugewiesen, das von map() durchlaufen wird.

+ +
var numbers = [1, 4, 9];
+var doubles = numbers.map(function(num) {
+  return num * 2;
+});
+
+// doubles ist jetzt [2, 8, 18]
+// numbers ist immer noch [1, 4, 9]
+ +

Generischer Einsatz von map()

+ +

In diesem Beispiel wird veranschaulicht, wie map() auf einen {{jsxref("Global_Objects/String", "String")}} angewendet wird, um ein Array mit Bytes zu erhalten, welche den jewiligen Zeichenwerten im ASCII-Zeichensatz entsprechen:

+ +
var map = Array.prototype.map;
+var a = map.call('Hello World', function(x) {
+  return x.charCodeAt(0);
+});
+// a now equals [72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100]
+
+ +

Generischer Einsatz von map() zusammen mit querySelectorAll()

+ +

In diesem Beispiel wird gezeigt, wie Sie eine Sammlung von Objekten durchlaufen, die von {{domxref("document.querySelectorAll()", "querySelectorAll()")}} erfasst wurde. Dies liegt daran, dass {{domxref("document.querySelectorAll()", "querySelectorAll()")}} eine {{domxref("NodeList")}} zurückgibt, bei der es sich um eine Auflistung von Objekten handelt. In diesem Fall geben wir alle Werte der ausgewählten Optionen auf dem Bildschirm zurück:

+ +
var elems = document.querySelectorAll('select option:checked');
+var values = Array.prototype.map.call(elems, function(obj) {
+  return obj.value;
+});
+
+ +

Einfacher wäre die Methode {{jsxref("Array.from()")}}.

+ +

Verzwickter Anwendungsfall

+ +

(Inspiriert von diesem Blogpost)

+ +

Üblicherweise wird die callback Funktion mit nur einem Argument benutzt. Das trifft auch für bestimmte andere Funktionen zu obwohl diese weitere optionale Argumente akzeptieren. Dies kann jedoch zu verwirrendem Verhalten führen.

+ +

Betrachten wir folgendes Beispiel:

+ +
['1', '2', '3'].map(parseInt);
+
+// Man würde erwarten [1, 2, 3]
+// Tatsächlich ist das Ergebnis aber [1, NaN, NaN]
+
+// parseInt wird oft nur mit einem Argument aufgerufen, akzeptiert aber zwei.
+// Der erste ist ein Ausdruck und der zweite ist die Basis.
+
+// Array.prototype.map übergibt 3 Argumente an die Callback-Funktion:
+// das Element, den Index, das Array
+
+// Das dritte Argument wird von parseInt ignoriert, das zweite jedoch nicht,
+// was verwirrend sein kann. Siehe den Blogpost für weitere Details
+
+// Falls der Link nicht funktioniert:
+// ein kurzes Beispiel der Durchläufe:
+// parseInt(string, radix) -> map(parseInt(value, index))
+// erster Durchlauf  (Index ist 0): parseInt('1', 0) // führt zu parseInt('1', 0) -> 1
+// zweiter Durchlauf (Index ist 1): parseInt('2', 1) // führt zu parseInt('2', 1) -> NaN
+// dritter Durchlauf (Index ist 2): parseInt('3', 2) // führt zu parseInt('3', 2) -> NaN
+
+function returnInt(element) {
+  return parseInt(element, 10);
+}
+
+['1', '2', '3'].map(returnInt); // [1, 2, 3]
+// Tatsächliches Ergebnis ist ein Array mit Nummern (wie erwartet)
+
+// Wie oben, jedoch unter Verwendung der kurzen Funktionssyntax mit Pfeil
+['1', '2', '3'].map( str => parseInt(str) );
+
+// Eine einfachere Methode, um selbiges zu erreichen, während Fallstricke vermieden werden:
+['1', '2', '3'].map(Number); // [1, 2, 3]
+
+// Im Gegensatz zu `parseInt` werden jedoch auch Fließkommazahlen oder (aufgelöste) Exponentialnotationen zurückgegeben:
+['1.1', '2.2e2', '3e300'].map(Number); // [1.1, 220, 3e+300]
+ +

Eine alternative Ausgabe der map() Methode, welche mit {{jsxref("Global_Objects/parseInt", "parseInt()")}} als Parameter aufgerufen wird, funktioniert wie folgt:

+ +
var xs = ['10', '10', '10'];
+
+xs = xs.map(parseInt);
+
+console.log(xs);
+// Das tatsächliche Ergebnis von [ 10, NaN, 2 ] kann aufgrund der obigen Beschreibung unerwartet sein
+ +

Polyfill

+ +

map() wurde dem ECMA-262-Standard in der 5. Auflage hinzugefügt. Als solches ist es möglicherweise nicht in allen Implementierungen des Standards enthalten. Sie können dies umgehen, indem Sie den folgenden Code am Anfang Ihrer Skripte einfügen, um die Verwendung von map() in Implementierungen zu ermöglichen, die es nicht nativ unterstützen. Dieser Dieser Algorithmus entspricht dem in der 5. Auflage von ECMA-262 angegebenen Algorithmus, vorausgesetzt {{jsxref("Object")}}, {{jsxref("TypeError")}} und {{jsxref("Array")}} haben ihre ursprünglichen Werte und callback.call() wird mit dem ursprünglichen Wert von {{jsxref("Function.prototype.call()")}} ausgewertet.

+ +
// Production steps of ECMA-262, Edition 5, 15.4.4.19
+// Reference: http://es5.github.io/#x15.4.4.19
+if (!Array.prototype.map) {
+
+  Array.prototype.map = function(callback, thisArg) {
+
+    var T, A, k;
+
+    if (this == null) {
+      throw new TypeError(' this is null or not defined');
+    }
+
+    // 1. Let O be the result of calling ToObject passing the |this|
+    //    value as the argument.
+    var O = Object(this);
+
+    // 2. Let lenValue be the result of calling the Get internal
+    //    method of O with the argument "length".
+    // 3. Let len be ToUint32(lenValue).
+    var len = O.length >>> 0;
+
+    // 4. If IsCallable(callback) is false, throw a TypeError exception.
+    // See: http://es5.github.com/#x9.11
+    if (typeof callback !== 'function') {
+      throw new TypeError(callback + ' is not a function');
+    }
+
+    // 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
+    if (arguments.length > 1) {
+      T = thisArg;
+    }
+
+    // 6. Let A be a new array created as if by the expression new Array(len)
+    //    where Array is the standard built-in constructor with that name and
+    //    len is the value of len.
+    A = new Array(len);
+
+    // 7. Let k be 0
+    k = 0;
+
+    // 8. Repeat, while k < len
+    while (k < len) {
+
+      var kValue, mappedValue;
+
+      // a. Let Pk be ToString(k).
+      //   This is implicit for LHS operands of the in operator
+      // b. Let kPresent be the result of calling the HasProperty internal
+      //    method of O with argument Pk.
+      //   This step can be combined with c
+      // c. If kPresent is true, then
+      if (k in O) {
+
+        // i. Let kValue be the result of calling the Get internal
+        //    method of O with argument Pk.
+        kValue = O[k];
+
+        // ii. Let mappedValue be the result of calling the Call internal
+        //     method of callback with T as the this value and argument
+        //     list containing kValue, k, and O.
+        mappedValue = callback.call(T, kValue, k, O);
+
+        // iii. Call the DefineOwnProperty internal method of A with arguments
+        // Pk, Property Descriptor
+        // { Value: mappedValue,
+        //   Writable: true,
+        //   Enumerable: true,
+        //   Configurable: true },
+        // and false.
+
+        // In browsers that support Object.defineProperty, use the following:
+        // Object.defineProperty(A, k, {
+        //   value: mappedValue,
+        //   writable: true,
+        //   enumerable: true,
+        //   configurable: true
+        // });
+
+        // For best browser support, use the following:
+        A[k] = mappedValue;
+      }
+      // d. Increase k by 1.
+      k++;
+    }
+
+    // 9. return A
+    return A;
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.19', 'Array.prototype.map')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.6.
{{SpecName('ES6', '#sec-array.prototype.map', 'Array.prototype.map')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-array.prototype.map', 'Array.prototype.map')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.map")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/observe/index.html b/files/de/web/javascript/reference/global_objects/array/observe/index.html new file mode 100644 index 0000000000..2926d777fc --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/observe/index.html @@ -0,0 +1,91 @@ +--- +title: Array.observe() +slug: Web/JavaScript/Reference/Global_Objects/Array/observe +tags: + - Array + - JavaScript + - Method + - Obsolete +translation_of: Archive/Web/JavaScript/Array.observe +--- +
{{JSRef}} {{obsolete_header}}
+ +

Die Array.observe() Methode wurde für das asynchrone Beobachten von Veränderungen von Arrays benutzt, ähnlich wie {{jsxref("Object.observe()")}} für Objekte. Sie stellt einen Stream von Änderungen in der Reihenfolge, in denen sie auftreten, zur Verfügung.
+ Equivalent zu  Object.observe() und wird ausgeführt mit der Liste ["add", "update", "delete", "splice"]. Diese Funktion wurde als deprecated markiert und bereits aus einigen Browsern entfernt. Man kann stattdessen das allgemeinere {{jsxref("Proxy")}} Objekt verwenden.

+ +

Syntax

+ +
Array.observe(arr, callback)
+ +

Parameter

+ +
+
arr
+
    Das Array, welches beobachtet wird.
+
callback
+
Die Funktion, welche bei jeder Änderung mit folgenden Argumenten aufgerufen wird: +
+
changes
+
Ein Array aus Objekten. Jedes repräsentiert eine Änderung. Die Eigenschaften dieser change Objekte sind: +
    +
  • name: Der Name der Eigenschaft, welche geändert wurde.
    • +
  • object: Das veränderte Array, nachdem die Änderung stattfand.
    • +
  • type: Ein String, welcher den Typ der Änderung darstellt. Er hat den Wert "add", "update", "delete", oder "splice".
    • +
  • oldValue: Nur für "update" und "delete" Typ. Der Wert vor der Änderung.
    • +
  • index: Nur für "splice" Typ. Der Index, an welchem die Änderung stattfand.
    • +
  • removed: Nur für "splice" Typ. Ein Array aus den gelöschten Elementen.
    • +
  • addedCount: Nur für "splice" Typ. Die Anzahl an Elementen, welche hinzugefügt wurden.
    • +
+
+
+
+
+ +

Beschreibung

+ +

Die callback Funktion wird jedes mal aufgerufen, wenn eine Änderung in arr stattfindet mit einem Array von allen Änderungen in der Reihenfolge in der sie auftreten

+ +
+

Änderungen über die Array Methoden, wie zum Beispiel Array.prototype.pop(), werden als "splice" "changes" dargestellt.
+ Index Änderungen, welche die Länge des Arrays nicht verändern, werden als "update" "changes" dargestellt.

+
+ +

Beispiele

+ +

Aufzeichnung verschiedener change Typen

+ +
var arr = ['a', 'b', 'c'];
+
+Array.observe(arr, function(changes) {
+  console.log(changes);
+});
+
+arr[1] = 'B';
+// [{type: 'update', object: <arr>, name: '1', oldValue: 'b'}]
+
+arr[3] = 'd';
+// [{type: 'splice', object: <arr>, index: 3, removed: [], addedCount: 1}]
+
+arr.splice(1, 2, 'beta', 'gamma', 'delta');
+// [{type: 'splice', object: <arr>, index: 1, removed: ['B', 'c', 'd'], addedCount: 3}]
+
+ +

Spezifikationen

+ +

Strawman proposal specification.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.observe")}}

+
+ +

See also

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/of/index.html b/files/de/web/javascript/reference/global_objects/array/of/index.html new file mode 100644 index 0000000000..e0e69d50f5 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/of/index.html @@ -0,0 +1,102 @@ +--- +title: Array.of() +slug: Web/JavaScript/Reference/Global_Objects/Array/of +tags: + - Array + - ECMAScript 2015 + - JavaScript + - Method + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/of +--- +
{{JSRef}}
+ +
Die Array.of() Methode erstellt eine neue {{jsxref("Array")}} Instanz aus einer variablen Anzahl an Argumenten, ohne Rücksicht auf die Anzahl oder den Typ der Argumente.
+ +
 
+ +
Der Unterschied zwischen Array.of() und dem Array Konstruktor ist die Behandlung von ganzen Zahlen als Argumente: Array.of(7) erstellt ein Array mit einem Element, 7. Array(7) hingegen erstellt ein leeres Array, bei dem die Eigenschaft length den Wert 7 gesetzt ist (Bemerkung: das impliziert ein Array mit 7 leeren Elementen, bei dem alle Elemente undefined sind).
+ +
 
+ +
Array.of(7);       // [7]
+Array.of(1, 2, 3); // [1, 2, 3]
+
+Array(7);          // [ , , , , , , ]
+Array(1, 2, 3);    // [1, 2, 3]
+
+ +

Syntax

+ +
Array.of(element0[, element1[, ...[, elementN]]])
+ +

Parameter

+ +
+
elementN
+
Elemente, welche sich im neu erzeugten Array befinden.
+
+ +

Rückgabewert

+ +

Eine neue {{jsxref("Array")}} Instanz.

+ +

Beschreibung

+ +

Diese Funktion ist Teil des EMCAScript 2015 Standards. Für mehr Information siehe Array.of and Array.from und Array.of polyfill.

+ +

Beispiele

+ +
Array.of(1);         // [1]
+Array.of(1, 2, 3);   // [1, 2, 3]
+Array.of(undefined); // [undefined]
+
+ +

Polyfill

+ +

Wird der nachfolgende Code vor jedem anderen Code eingefügt, so wird Array.of() verfügbar, falls es nicht nativ implementiert ist.

+ +
if (!Array.of) {
+  Array.of = function() {
+    return Array.prototype.slice.call(arguments);
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES6', '#sec-array.of', 'Array.of')}}{{Spec2('ES6')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.of', 'Array.of')}}{{Spec2('ESDraft')}} 
+ +

Browser Kompabilität

+ +
+ + +

{{Compat("javascript.builtins.Array.of")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/pop/index.html b/files/de/web/javascript/reference/global_objects/array/pop/index.html new file mode 100644 index 0000000000..33274647f5 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/pop/index.html @@ -0,0 +1,98 @@ +--- +title: Array.prototype.pop() +slug: Web/JavaScript/Reference/Global_Objects/Array/pop +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/pop +--- +
{{JSRef("Global_Objects", "Array")}}
+ +

Die pop() Methode entfernt das letzte Element eines Arrays und gibt dieses zurück. Diese Methode ändert die Länge des Arrays.

+ +
{{EmbedInteractiveExample("pages/js/array-pop.html")}}
+ + + +

Syntax

+ +
arr.pop()
+ +

Rückgabewert

+ +

Das entfernte Element aus dem Array; {{jsxref("undefined")}} wenn das Array leer ist.

+ +

Beschreibung

+ +

Die pop-Methode entfernt das letzte Element eines Arrays und gibt dieses zurück.

+ +

pop ist bewusst generisch gehalten. DIese Methode kann mit {{jsxref("Function.call", "called", "", 1)}} oder {{jsxref("Function.apply", "applied", "", 1)}} auf einem Objekten aufgerufen werden, welches Arrays ähneln ist. Objekte, die keine length Eigenschaft enthalten, welches das letzt Element in dem Objekt markieren oder keine nullbasierten numerischen Eigenschaften widerspiegelt, verhalten sich möglicherweise nicht in einer Weise.

+ +

Wenn pop() auf einem leeren Array aufgerufen wird, so wird undefined zurückgegeben.

+ +

Beispiele

+ +

Entfernen des letzten Elements eines Arrays

+ +

Der folgende Code erzeugt ein Array myFish, das aus vier Elementen besteht. Im Anschluss daran wird das letzte Element entfernt.

+ +
var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
+
+var popped = myFish.pop();
+
+console.log(myFish); // ['angel', 'clown', 'mandarin' ]
+
+console.log(popped); // 'sturgeon'
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
ECMAScript 3rd Edition{{Spec2('ES3')}}Initiale Definition. Implementiert mit JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.4.4.6', 'Array.prototype.pop')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.pop', 'Array.prototype.pop')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.pop', 'Array.prototype.pop')}}{{Spec2('ESDraft')}} 
+ +

Browser-Kompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.pop")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/prototypen/index.html b/files/de/web/javascript/reference/global_objects/array/prototypen/index.html new file mode 100644 index 0000000000..dcab74024e --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/prototypen/index.html @@ -0,0 +1,183 @@ +--- +title: Array.Prototypen +slug: Web/JavaScript/Reference/Global_Objects/Array/Prototypen +tags: + - Array + - JavaScript + - Property +translation_of: Web/JavaScript/Reference/Global_Objects/Array/prototype +--- +
{{JSRef}}
+ +

Die Array.prototype (Anordnung.Muster) Eigenschaft repräsentiert eine Schablone (Prototypen) des {{jsxref("Array")}} Konstrukteurs und erlaubt dir neue Eigenschaften und Methoden zu allen Array Objekten hinzuzufügen.

+ +
// Wenn JavaScript eine first() Methode vom Grundsatz nicht unterstützt
+// füge eine neue Methode als Rückgabewert des ersten Elements als Array zurück
+
+if (!Array.prototype.first) {
+  Array.prototype.first = function() {
+    return this[0];
+  }
+}
+ +

Beschreibung

+ +

{{jsxref("Array")}} Instanzen erben vom Array.prototype. Wie mit allen Konstrukteuren kannst du das Konstrukteur Protoypen Objekt ändern, um alle {{jsxref("Array")}} Instanzen zu verändern. Ein Beispiel: du kannst neue Methoden und Eigenschaften zu allen Array-Objekten hinzufügen und diese damit erweitern. Dies wird zum Beispiel für {{Glossary("Polyfill", "polyfilling")}} genutzt.

+ +

Ganz nebenbei: ein Array-Protoyp selbst ist ein {{jsxref("Array")}}:

+ +
Array.isArray(Array.prototype); // true
+
+ +

{{js_property_attributes(0, 0, 0)}}

+ +

Eigenschaften

+ +
+
Array.prototype.constructor
+
Beschreibt die Funktion um ein Objekt-Prototypen zu erstellen.
+
{{jsxref("Array.prototype.length")}}
+
Gibt die Nummer an Elementen in einem Array wieder.
+
{{jsxref("Array.@@unscopables", "Array.prototype[@@unscopables]")}}
+
Eine Symbol-beinhaltende Eigenschaft beschreibt das ausschließen von einem mit with eingebundenden Geltungsbereich.
+
+ +

Methoden

+ +

Mutationsmethoden

+ +

Diese Methoden verändern ein Array:

+ +
+
{{jsxref("Array.prototype.copyWithin()")}}
+
Kopiert einen Teil eines Array Elements innerhalb eines Array.
+
{{jsxref("Array.prototype.fill()")}}
+
Füllt alle Elemente eines Arrays von einem Start-Index zu einem Ende-Index mit einem festen Wert.
+
{{jsxref("Array.prototype.pop()")}}
+
Entfernt das letzte Element von einem Array und gibt dieses Element als Rückgabewert aus.
+
{{jsxref("Array.prototype.push()")}}
+
Fügt eins oder mehrere Elemente zu dem Ende des Arrays hinzu und gibt die neue Länge des Arrays zurück
+
{{jsxref("Array.prototype.reverse()")}}
+
Dreht die Reihenfolge der Elemente in einem Array um - das erste Element wird das letzte und das letzte Element wird das erste.
+
{{jsxref("Array.prototype.shift()")}}
+
Entfernt das erste Element innerhalb eines Array und gibt das Element als Rückgabewert aus.
+
{{jsxref("Array.prototype.sort()")}}
+
Sortiert innerhalb eines Arrays die Elemente und gibt das sortierte Array aus.
+
{{jsxref("Array.prototype.splice()")}}
+
Fügt Elemente von einem Array hinzu und/oder entfernt diese.
+
{{jsxref("Array.prototype.unshift()")}}
+
Fügt ein oder mehr Elemente an erster Stelle eines Array hinzu und gibt die Länge des neuen Arrays zurück.
+
+ +

Zugriffsmethoden

+ +

Diese Methoden verändern das Array nicht und geben als Rückgabewert eine Darstellung des Arrays an.

+ +
+
{{jsxref("Array.prototype.concat()")}}
+
Gibt ein neues Array zusammengestellt von diesem Array und verknüpft mit anderen/ mehreren Array(s) und/ oder einem/ mehreren Wert(en).
+
{{jsxref("Array.prototype.includes()")}}
+
Überprüft, ob ein Array ein bestimmtes Element enthält und gibt als Rückgabewert true oder false an.
+
{{jsxref("Array.prototype.indexOf()")}}
+
Gibt die erste Stelle (Index) eines einzelnen, dem beschriebenen, Elements innerhalb eines Array an. Wenn das Element nicht gefunden wurde gibt er -1 zurück.
+
{{jsxref("Array.prototype.join()")}}
+
Verbindet alle Elemente eines Arrays zu einem String.
+
{{jsxref("Array.prototype.lastIndexOf()")}}
+
Gibt den letzten (höchsten) Index des beschriebenen Elements innerhalb eines Arrays aus, oder -1, wenn nichts gefunden wurde.
+
{{jsxref("Array.prototype.slice()")}}
+
Extrahiert einen Teil eines Arrays und gibt diesen als neues Array aus.
+
{{jsxref("Array.prototype.toSource()")}} {{non-standard_inline}}
+
Gibt ein Array-Literal des beschriebenen Arrays zurück; du kannst diesen Wert nutzen um ein neues Array zu erstellen. Überschreibt die {{jsxref("Object.prototype.toSource()")}} Methode.
+
{{jsxref("Array.prototype.toString()")}}
+
Gibt einen String zurück, welcher das Array und seine Elemente beinhaltet. Überschreibt die {{jsxref("Object.prototype.toString()")}} Methode.
+
{{jsxref("Array.prototype.toLocaleString()")}}
+
Gibt einen lokalen String zurück, welcher das Array und seine Elemente beschreibt. Überschreibt die {{jsxref("Object.prototype.toLocaleString()")}} Methode.
+
+ +

Zählmethoden

+ +

Einige Methoden nehmen als Argument eine Funktion an und führen diese während des Aufrufs des Arrays aus. Wenn diese Methoden aufgerufen werden, wird die Länge (length) des Arrays abgetastet und jedes Element außerhalb der dieser Länge innerhalb eines nicht aufgerufenen Callbacks hinzugefügt. Andere Änderungen zu einem Array (setzen eines Wertes oder das Löschen eines Elements) könnten Auswirkungen auf das Ergebnis der Operation haben, wenn die Methode das veränderte Element im Nachhinein besucht. Während das spezielle Verhalten dieser Methoden in einem solchen Fall gut definiert sind, solltest du dich dennoch nicht darauf verlassen, damit du andere, die deinen möglicherweise lesen - nicht verwirrt werden. Wenn du das Array verändern musst, solltest du das veränderte Array in ein neu erstelltes Array packen.

+ +
+
{{jsxref("Array.prototype.entries()")}}
+
Gibt ein neues Array Zähl Objekt (Array Iterator Object) zurück, welches das key/value Paar für jeden Index in dem Array innehält.
+
{{jsxref("Array.prototype.every()")}}
+
Gibt true zurück, wenn alle Elemente in diesem Array die zu testende Funktion bestehen.
+
{{jsxref("Array.prototype.filter()")}}
+
Erstellt ein neues Array mit allen Elementen dieses Arrays für welches die Filter-Funktion innerhalb den Rückgabewert true benutzt.
+
{{jsxref("Array.prototype.find()")}}
+
Gibt den ersten gefundenen Wert innerhalb eines Arrays wieder, wenn ein Element innerhalb des Arrays die definierte Test-Funktion besteht oder undefined wenn nichts gefunden wurde.
+
{{jsxref("Array.prototype.findIndex()")}}
+
Gibt den gefundenen Index im Array an, wenn ein Element in dem Array die angegebene Test-Funktion besteht - oder -1, wenn nichts gefunden wurde.
+
{{jsxref("Array.prototype.forEach()")}}
+
Ruft eine Funktion für jedes Element in einem Array auf.
+
{{jsxref("Array.prototype.keys()")}}
+
+

Gibt einen neuen Array Iterator (Zeiger) aus, welcher die Schlüssel für jeden Index innerhalb des Arrays beinhaltet.

+
+
{{jsxref("Array.prototype.map()")}}
+
Erstellt ein neues Array mit den Ergebnissen der ausgeführten definierten Funktion an jedem Element in diesem Array.
+
{{jsxref("Array.prototype.reduce()")}}
+
Reduziert das Array auf einen einzigen Wert, indem es jeweils zwei Elemente durch die angegebene Funktion ausführt. Optional: als zweiten Paramater einen Startwert angeben.
+
{{jsxref("Array.prototype.reduceRight()")}}
+
Reduziert das Array auf einen einzigen Wert, indem es jeweils zwei Elemente durch die angegebene Funktion ausführt (von rechts nach links). Optional: als zweiten Paramater einen Startwert angeben.
+
{{jsxref("Array.prototype.some()")}}
+
+ 
Gibt true zurück, wenn mindestens ein Element in diesem Array den Test der definierten Funktion besteht.
+
+
{{jsxref("Array.prototype.values()")}}
+
Gibt einen neues Array Iterator Objekt zurück, welches die Werte für jeden Index in dem Array beinhaltet.
+
{{jsxref("Array.prototype.@@iterator()", "Array.prototype[@@iterator]()")}}
+
Gibt einen neues Array Iterator Objekt zurück, welches die Werte für jeden Index in dem Array beinhaltet.
+
+ +

Generische Methoden (kein Standard)

+ +

Vielen Methoden von den JavaScript Array Objekten sind für die allgemeine Anwendung an allem Objekten entwickelt wurden, welche "aussehen wie" Arrays. Der Grund ist, dass sie an allen Objekten angewandt werden könne, welche eine Längen-Eigenschaft besitzen, und welche nützlicherweise eine numerische Eigenschaft benennen (wie mit der array[5] Indizierung). Einige Methoden, solche wie {{jsxref("Array.join", "join")}}, lesen nur die Länge (length) und numerische Eigenschaften von dem Objekt an welches sie angewandt werden. Andere, wie {{jsxref("Array.reverse", "reverse")}}, erfordern eine Veränderung der numerischen Objekt- und Längen-Eigenschaften; diese Methoden können deshalb nicht von Objekten wie {{jsxref("String")}} aufgerufen werden, welche das künstliche Setzen ihrer Längen- (length)  oder numerischen Eigenschaft nicht erlauben.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition.
{{SpecName('ES5.1', '#sec-15.4.3.1', 'Array.prototype')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype', 'Array.prototype')}}{{Spec2('ES6')}}Hinzugefügt der copyWithin(), fill(), entries(), keys(), values(), find(), findIndex() Methoden.
{{SpecName('ES7', '#sec-array.prototype', 'Array.prototype')}}{{Spec2('ES7')}}Hinzugefügt der includes() Methode.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.prototype")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/push/index.html b/files/de/web/javascript/reference/global_objects/array/push/index.html new file mode 100644 index 0000000000..986fcf944b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/push/index.html @@ -0,0 +1,141 @@ +--- +title: Array.prototype.push() +slug: Web/JavaScript/Reference/Global_Objects/Array/push +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/push +--- +
{{JSRef}}
+ +

Die push() Methode fügt ein oder mehr Elemente am Ende eines Arrays hinzu und gibt die neue Länge des Arrays zurück.

+ +
{{EmbedInteractiveExample("pages/js/array-push.html")}}
+ + + +

Syntax

+ +
arr.push(element1 [, ... [, elementN]])
+ +

Parameter

+ +
+
elementN
+
Die Elemente, die am Ende des Arrays eingefügt werden.
+
+ +

Rückgabewert

+ +

Den neuen Wert der {{jsxref("Array.length", "length")}} Eigenschaft (Länge des Arrays), nachdem die Methode ausgeführt wurde.

+ +

Beschreibung

+ +

Die push Methode fügt Werte an das Ende eines Arrays an.

+ +

push ist absichtlich generisch gehalten. Die Methode kann mit Hilfe von {{jsxref("Function.call", "call()")}} und {{jsxref("Function.apply", "apply()")}} auch auf Array ähnliche Objekte angewendet werden. Die Methode wählt anhand der length Eigenschaft den Punkt aus, an dem die Werte eingefügt werden. Falls die length Eigenschaft nicht in eine Zahl umgewandelt werden kann, wird 0 als Index verwendet. Das gilt auch für den Fall, dass die length Eigenschaft nicht vorhanden ist. Die length Eigenschaft wird daraufhin erstellt.

+ +

Obwohl {{jsxref("Global_Objects/String", "Strings", "", 1)}} native, Array-ähnliche Objekte sind, sind sie in Anwendungen dieser Methode nicht geeignet, da Strings unveränderlich sind. Gleiches gilt für das native, Array-ähnliche Objekt {{jsxref("Functions/arguments", "arguments", "", 1)}}.

+ +

Beispiele

+ +

Elemente zu einem Array hinzufügen

+ +

Der folgende Quelltext erstellt ein sports Array mit zwei Elementen und fügt anschließend zwei weitere Elemente hinzu. Die Variable total enthält die neue Länge des Arrays.

+ +
var sports = ['soccer', 'baseball'];
+var total = sports.push('football', 'swimming');
+
+console.log(sports); // ['soccer', 'baseball', 'football', 'swimming']
+console.log(total);  // 4
+
+ +

Zwei Arrays zusammenführen

+ +

Dieses Beispiel benutzt {{jsxref("Function.apply", "apply()")}}, um alle Elemente eines zweiten Arrays hinzuzufügen.

+ +

Diese Methode sollte nicht benutzt werden, wenn das zweite Array (moreVegs in diesem Beispiel) sehr lang ist, weil die maximale Anzahl der Parametern, die eine Funktion haben kann, in der Praxis limitiert ist. Siehe {{jsxref("Function.apply", "apply()")}} für mehr Details.

+ +
var vegetables = ['parsnip', 'potato'];
+var moreVegs = ['celery', 'beetroot'];
+
+// Fügt das zweite Array an das erste Array an
+// Equivalent zu vegetables.push('celery', 'beetroot');
+Array.prototype.push.apply(vegetables, moreVegs);
+
+console.log(vegetables); // ['parsnip', 'potato', 'celery', 'beetroot']
+ +

Objekte wie ein Array behandeln

+ +

Wie oben angedeutet ist, ist push extra generisch gehalten, was man zu seinem Vorteil nutzen kann. Array.prototype.push kann gut auf ein Objekt angewendet werden, wie das Beispiel zeigt. Zu beachten ist, dass kein Array erstellt wird, um eine Menge von Objekten zu speichern. Stattdessen werden die Objekte in dem Objekt selbst gespeichern, indem wir call auf der Array.prototype.push Methode einsetzen, um die Methode glauben zu lassen, wir arbeiten mit einem Array. Es funktioniert einfach, dank der Art und Weise, wie JavaScript es uns erlaubt, den Ausführungskontext nach Belieben festzulegen.

+ +
var obj = {
+    length: 0,
+
+    addElem: function addElem(elem) {
+        // obj.length wird automatisch erhöht,
+        // wenn ein Objekt hinzugefügt wird
+        [].push.call(this, elem);
+    }
+};
+
+// ein paar leere Objekte zu Illustrationszwecken hinzufügen
+obj.addElem({});
+obj.addElem({});
+console.log(obj.length);
+// → 2
+
+ +

Zu beachten ist, dass obj kein Array ist. Die Methode push erhöht erfolgreich die length Eigenschaft von obj, so als würde sie mit einem Array arbeiten.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.4.4.7', 'Array.prototype.push')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.push', 'Array.prototype.push')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.push', 'Array.prototype.push')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.push")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/reduce/index.html b/files/de/web/javascript/reference/global_objects/array/reduce/index.html new file mode 100644 index 0000000000..bbb3e4d57c --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/reduce/index.html @@ -0,0 +1,564 @@ +--- +title: Array.prototype.reduce() +slug: Web/JavaScript/Reference/Global_Objects/Array/Reduce +tags: + - Array + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - Reduce + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/Reduce +--- +
{{JSRef}}
+ +

Die reduce()-Methode reduziert ein Array auf einen einzigen Wert, indem es jeweils zwei Elemente (von links nach rechts) durch eine gegebene Funktion reduziert.

+ +
{{EmbedInteractiveExample("pages/js/array-reduce.html")}}
+ + + +

Syntax

+ +
arr.reduce(callback[, initialValue])
+ +

Parameter

+ +
+
callback
+
Funktion, welche auf jeden Wert im Array angewandet wird und vier Argumente hat: +
+
accumulator
+
Der kumulierte Wert ist der Rückgabewert von callback; der in der zuvor zurückgegebene Wert des letzten Aufrufes von callback oder initialValue werden verwendet.
+
currentValue
+
Das aktuell zu verarbeitende Element des Arrays.
+
currentIndex{{optional_inline}}
+
Der Index des aktuellen Elements des Arrays. Beginnt mit dem Index 0, falls initialValue angegeben wurde, ansonsten mit Index 1.
+
array{{optional_inline}}
+
Das Array, auf dem reduce abgerufen wird.
+
+
+
initialValue{{optional_inline}}
+
Der Wert des ersten Arguments, der bei dem ersten Aufruf in callback zu benutzt wird. Wenn kein Initialwert angegeben wird, wird das erste Element des Arrays benutzt. Das Aufrufen von reduce() auf einem leeren Array ohne Initialwerts führt zu einem Fehler.
+
+ +

Rückgabewert

+ +

Der Ergebniswert der Reduzierung.

+ +

Beschreibung

+ +

reduce() führt die callback-Funktion für jedes existierende Element in dem Array aus, Ausnahme sind nicht gesetzte Werte. callback hat vier Parameter:

+ + + +

Beim ersten Aufruf von callback sind die Werte von accumulator und currentValue in Abhängigkeit vom Parameter initialValue wie folgt:

+ + + +
+

Hinweis: Wenn initialValue nicht angegeben wird, wird reduce() die callback-Funktion startend beim Index 1 aufrufen, der erste Index wird übersprungen. Wenn initialValue angegeben ist, wird bei Index 0 begonnen.

+
+ +

Wenn das Array leer ist und kein initialValue angegeben ist, wird ein {{jsxref("TypeError")}} erzeugt. Wenn das Array nur ein Element hat (die Position ist egal) und kein initialValue angegeben ist oder wenn initialValue angegeben ist und das Array leer ist, wird der einzelne Wert sofort zurückgegeben, ohne callback aufzurufen.

+ +

Es ist immer sicherer initialValue anzugeben, weil es drei mögliche Ergebnisse ohne initialValue gibt, wie es im folgenden Beispiel gezeigt ist.

+ +
var maxCallback = ( acc, cur ) => Math.max( acc.x, cur.x );
+var maxCallback2 = ( max, cur ) => Math.max( max, cur );
+
+// reduce() without initialValue
+[ { x: 22 }, { x: 42 } ].reduce( maxCallback ); // 42
+[ { x: 22 }            ].reduce( maxCallback ); // { x: 22 }
+[                      ].reduce( maxCallback ); // TypeError
+
+// map/reduce; better solution, also works for empty or larger arrays
+[ { x: 22 }, { x: 42 } ].map( el => el.x )
+                        .reduce( maxCallback2, -Infinity );
+
+ +

Wie reduce() funktioniert

+ +

Angenommen die folgende reduce() Funktion wird genutzt:

+ +
[0, 1, 2, 3, 4].reduce(function (accumulator, currentValue, currentIndex, array) {
+  return accumulator + currentValue;
+});
+
+ +

Die callback-Funktion wird viermal aufgerufen, mit den Parametern und Rückgabewert für jeden Aufruf wir folgend beschrieben:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
callbackaccumulatorcurrentValuecurrentIndexarrayRückgabewert
1. Aufruf011[0, 1, 2, 3, 4]1
2. Aufruf122[0, 1, 2, 3, 4]3
3. Aufruf333[0, 1, 2, 3, 4]6
4. Aufruf644[0, 1, 2, 3, 4]10
+ +

Der zurückgegebene Wert von reduce() ist der Rückgabewert der letzten callback-Funktion (10).

+ +

Es ist zusätzlich möglich eine {{jsxref("Functions/Arrow_functions", "Arrow-Funktion","",1)}} statt einer ganzen Funktion zu benutzen. Der folgende Quelltext erzeugt die gleiche Ausgabe wie der Vorherige:

+ +
[0, 1, 2, 3, 4].reduce( (prev, curr) => prev + curr );
+
+ +

Wenn als zweiter Parameter von reduce() initialValue angegeben ist, wird das Ergebnis wie folgt aussehen:

+ +
[0, 1, 2, 3, 4].reduce((accumulator, currentValue, currentIndex, array) => {
+  return accumulator + currentValue;
+}, 10);
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
callbackaccumulatorcurrentValuecurrentIndexarrayRückgabewert
1. Aufruf1000[0, 1, 2, 3, 4]10
2. Aufruf1011[0, 1, 2, 3, 4]11
3. Aufruf1122[0, 1, 2, 3, 4]13
4. Aufruf1333[0, 1, 2, 3, 4]16
5. Aufruf1644[0, 1, 2, 3, 4]20
+ +

Der von reduce() zurückgegebene Wert ist in diesem Fall 20.

+ +

Beispiele

+ +

Alle Elemente eines Arrays summieren

+ +
var sum = [0, 1, 2, 3].reduce(function (accumulator, currentValue) {
+  return accumulator + currentValue;
+}, 0);
+// sum is 6
+
+ +

Alternativ als Arrow-Funktion geschrieben:

+ +
var total = [ 0, 1, 2, 3 ].reduce(
+  ( accumulator, currentValue ) => accumulator + currentValue,
+  0
+);
+ +

Summe von Werten in einem Objektarray

+ +

Um in einem Array von Objekten Werte aufzusummieren, muss ein Initialwert angegeben werden, so dass jedes Element in der Funktion durchlaufen wird.

+ +
var initialValue = 0;
+var sum = [{x: 1}, {x:2}, {x:3}].reduce(function (accumulator, currentValue) {
+    return accumulator + currentValue.x;
+},initialValue)
+
+console.log(sum) // logs 6
+
+ +

Alternativ als Arrow-Funktion geschrieben:

+ +
var initialValue = 0;
+var sum = [{x: 1}, {x:2}, {x:3}].reduce(
+    (accumulator, currentValue) => accumulator + currentValue.x
+    ,initialValue
+);
+
+console.log(sum) // logs 6
+ +

Geschachtelte Arrays zu einem flachen Array machen

+ +
var flattened = [[0, 1], [2, 3], [4, 5]].reduce(
+  function(accumulator, currentValue) {
+    return accumulator.concat(currentValue);
+  },
+  []
+);
+// flattened is [0, 1, 2, 3, 4, 5]
+
+ +

Alternativ als Arrow-Funktion geschrieben:

+ +
var flattened = [[0, 1], [2, 3], [4, 5]].reduce(
+  ( accumulator, currentValue ) => accumulator.concat(currentValue),
+  []
+);
+
+ +

Zählen von Instanzen eines Wertes in einem Objekt

+ +
var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];
+
+var countedNames = names.reduce(function (allNames, name) {
+  if (name in allNames) {
+    allNames[name]++;
+  }
+  else {
+    allNames[name] = 1;
+  }
+  return allNames;
+}, {});
+// countedNames is:
+// { 'Alice': 2, 'Bob': 1, 'Tiff': 1, 'Bruce': 1 }
+
+ +

Objekte nach einer Eigenschaft gruppieren

+ +
var people = [
+  { name: 'Alice', age: 21 },
+  { name: 'Max', age: 20 },
+  { name: 'Jane', age: 20 }
+];
+
+function groupBy(objectArray, property) {
+  return objectArray.reduce(function (acc, obj) {
+    var key = obj[property];
+    if(!acc[key]) {
+      acc[key] = [];
+    }
+    acc[key].push(obj);
+    return acc;
+  }, {});
+}
+
+var groupedPeople = groupBy(people, 'age');
+// groupedPeople is:
+// {
+//   20: [
+//     { name: 'Max', age: 20 },
+//     { name: 'Jane', age: 20 }
+//   ],
+//   21: [{ name: 'Alice', age:21 }]
+// }
+
+ +

Verbinden von Arrays in einem Array von Objekten mithilfe des Spread-Operators und von initialValue

+ +
// friends - an array of objects
+// where object field "books" - list of favorite books
+var friends = [{
+  name: 'Anna',
+  books: ['Bible', 'Harry Potter'],
+  age: 21
+}, {
+  name: 'Bob',
+  books: ['War and peace', 'Romeo and Juliet'],
+  age: 26
+}, {
+  name: 'Alice',
+  books: ['The Lord of the Rings', 'The Shining'],
+  age: 18
+}];
+
+// allbooks - list which will contain all friends' books +
+// additional list contained in initialValue
+var allbooks = friends.reduce(function(accumulator, currentValue) {
+  return [...accumulator, ...currentValue.books];
+}, ['Alphabet']);
+
+// allbooks = [
+//   'Alphabet', 'Bible', 'Harry Potter', 'War and peace',
+//   'Romeo and Juliet', 'The Lord of the Rings',
+//   'The Shining'
+// ]
+ +

Duplikate in einem Array entfernen

+ +
let arr = [1, 2, 1, 2, 3, 5, 4, 5, 3, 4, 4, 4, 4];
+let result = arr.sort().reduce((accumulator, current) => {
+    const length = accumulator.length;
+    if (length === 0 || accumulator[length - 1] !== current) {
+        accumulator.push(current);
+    }
+    return accumulator;
+}, []);
+console.log(result); //[1,2,3,4,5]
+
+ +

Sequenzielle Abarbeitung von Promises

+ +
/**
+ * Runs promises from array of functions that can return promises
+ * in chained manner
+ *
+ * @param {array} arr - promise arr
+ * @return {Object} promise object
+ */
+function runPromiseInSequence(arr, input) {
+  return arr.reduce(
+    (promiseChain, currentFunction) => promiseChain.then(currentFunction),
+    Promise.resolve(input)
+  );
+}
+
+// promise function 1
+function p1(a) {
+  return new Promise((resolve, reject) => {
+    resolve(a * 5);
+  });
+}
+
+// promise function 2
+function p2(a) {
+  return new Promise((resolve, reject) => {
+    resolve(a * 2);
+  });
+}
+
+// function 3 - will wrapped in a resolved promise by .then()
+function f3(a) {
+  return a * 3;
+}
+
+// promise function 4
+function p4(a) {
+  return new Promise((resolve, reject) => {
+    resolve(a * 4);
+  });
+}
+
+const promiseArr = [p1, p2, f3, p4];
+runPromiseInSequence(promiseArr, 10)
+  .then(console.log);    // 1200
+
+ +

Funktionskomposition ermöglicht Pipelining

+ +
// Building-blocks to use for composition
+const double = x => x + x;
+const triple = x => 3 * x;
+const quadruple = x => 4 * x;
+
+// Function composition enabling pipe functionality
+const pipe = (...functions) => input => functions.reduce(
+    (acc, fn) => fn(acc),
+    input
+);
+
+// Composed functions for multiplication of specific values
+const multiply6 = pipe(double, triple);
+const multiply9 = pipe(triple, triple);
+const multiply16 = pipe(quadruple, quadruple);
+const multiply24 = pipe(double, triple, quadruple);
+
+// Usage
+multiply6(6); // 36
+multiply9(9); // 81
+multiply16(16); // 256
+multiply24(10); // 240
+
+ +

Mapfunktion mit reduce

+ +
if (!Array.prototype.map) {
+  Array.prototype.map = function(callback, thisArg) {
+    return this.reduce(function(mappedArray, currentValue, index, array) {
+      mappedArray[index] = callback.call(thisArg, currentValue, index, array);
+      return mappedArray;
+    }, []);
+  };
+}
+
+[1, 2, , 3].map(
+  (currentValue, index, array) => currentValue + index + array.length
+); // [5, 7, , 10]
+
+
+ +

Polyfill

+ +
// Production steps of ECMA-262, Edition 5, 15.4.4.21
+// Reference: http://es5.github.io/#x15.4.4.21
+// https://tc39.github.io/ecma262/#sec-array.prototype.reduce
+if (!Array.prototype.reduce) {
+  Object.defineProperty(Array.prototype, 'reduce', {
+    value: function(callback /*, initialValue*/) {
+      if (this === null) {
+        throw new TypeError( 'Array.prototype.reduce ' +
+          'called on null or undefined' );
+      }
+      if (typeof callback !== 'function') {
+        throw new TypeError( callback +
+          ' is not a function');
+      }
+
+      // 1. Let O be ? ToObject(this value).
+      var o = Object(this);
+
+      // 2. Let len be ? ToLength(? Get(O, "length")).
+      var len = o.length >>> 0;
+
+      // Steps 3, 4, 5, 6, 7
+      var k = 0;
+      var value;
+
+      if (arguments.length >= 2) {
+        value = arguments[1];
+      } else {
+        while (k < len && !(k in o)) {
+          k++;
+        }
+
+        // 3. If len is 0 and initialValue is not present,
+        //    throw a TypeError exception.
+        if (k >= len) {
+          throw new TypeError( 'Reduce of empty array ' +
+            'with no initial value' );
+        }
+        value = o[k++];
+      }
+
+      // 8. Repeat, while k < len
+      while (k < len) {
+        // a. Let Pk be ! ToString(k).
+        // b. Let kPresent be ? HasProperty(O, Pk).
+        // c. If kPresent is true, then
+        //    i.  Let kValue be ? Get(O, Pk).
+        //    ii. Let accumulator be ? Call(
+        //          callbackfn, undefined,
+        //          « accumulator, kValue, k, O »).
+        if (k in o) {
+          value = callback(value, o[k], k, o);
+        }
+
+        // d. Increase k by 1.
+        k++;
+      }
+
+      // 9. Return accumulator.
+      return value;
+    }
+  });
+}
+
+ +

Wenn es wirklich notwendig ist veraltete JavaScript-Umgebungen zu benutzen, die Object.defineProperty() nicht unterstützen, ist es besser Array.prototype nicht komplett zu ersetzen, weil man es nicht non-enumerable machen kann.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezificationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.21', 'Array.prototype.reduce()')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.8.
{{SpecName('ES6', '#sec-array.prototype.reduce', 'Array.prototype.reduce()')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-array.prototype.reduce', 'Array.prototype.reduce()')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.reduce")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/reduceright/index.html b/files/de/web/javascript/reference/global_objects/array/reduceright/index.html new file mode 100644 index 0000000000..dfcb7e3a0b --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/reduceright/index.html @@ -0,0 +1,334 @@ +--- +title: Array.prototype.reduceRight() +slug: Web/JavaScript/Reference/Global_Objects/Array/ReduceRight +tags: + - Array + - ECMAScript 5 + - JavaScript + - Method + - Prototype + - polyfill +translation_of: Web/JavaScript/Reference/Global_Objects/Array/ReduceRight +--- +
{{JSRef}}
+ +

Die reduceRight() Methode wendet eine Funktion gegen einen Akkumulator auf jeden Wert des Arrays (von rechts nach links) auf und reduziert es um einen einzelnen Wert.

+ +
{{EmbedInteractiveExample("pages/js/array-reduce-right.html")}}
+ + + +

Siehe auch {{jsxref("Array.prototype.reduce()")}} für links nach rechts Reduzierung.

+ +

Syntax

+ +
arr.reduceRight(callback[, initialValue])
+ +

Parameter

+ +
+
callback
+
Funktion, welche für jeden Wert im Array aufgerufen wird und vier Argumente hat: +
+
previousValue
+
Der zuvor im letzten Aufruf des Rückrufs zurückgegebene Wert, oder initialValue, wenn unterstützt. (siehe unten)
+
currentValue
+
Das derzeitige zu verarbeitende Element in dem Array.
+
index{{optional_inline}}
+
Der Index des derzeitigen zu verarbeitenden Elements in dem Array.
+
array{{optional_inline}}
+
Das Arrayobjekt, in dem das Element enthalten ist.
+
+
+
initialValue{{optional_inline}}
+
Objekt, welches beim ersten Aufruf der callback Funktion initial benutzt wird. Wenn kein Initialwert angegeben ist wird das letzte Element aus dem Array benutzt. Der aufruf auf einem leeren Array ohne angabe von initialValue führt zu einem Fehler.
+
+ +

Rückgabewert

+ +

Der Wert, der aus der Reduktion resultiert.

+ +

Beschreibung

+ +

reduceRight Führt die Rückruffunktion einmal für jedes im Array vorhandene Element aus, ohne Löcher im Array, wobei vier Argumente empfangen werden: der Initialwert (initialValue) (oder Wert des vorherigen callback Aufrufes), der Wert des derzeitigen Elements, der derzeitige Index, und das Array auf welches der Durchlauf stattfindet.

+ +

Der Aufruf des reduceRight callback würde ungefähr so aussehen:

+ +
array.reduceRight(function(previousValue, currentValue, index, array) {
+  // ...
+});
+
+ +

Wenn die Funktion das erste Mal ausgeführt wird, kann der vorherige Wert  (previousValue)  und der derzeitige Wert (currentValue) eines von zwei Werten sein. Wenn ein Initialwert (initialValue) der Callback-Funktion zu reduceRight mitgegeben wird, dann wird der previousValue und der initialValue gleich dem initialValue in dem Array. Wenn kein initialValue  mitgegeben wird, dann ist der previousValue gleich dem Wert in dem Array und currentValue wird gleich zu dem geich dem zweiten bis letzten Wert.

+ +

Wenn das Array leer ist und kein initialValue angegeben ist wird ein {{jsxref("TypeError")}} erzeugt. Wenn das Array nur ein Element hat (die Position ist egal) und kein initialValue angegeben ist oder wenn initialValue angegeben ist und das Array leer ist, wird der einzelne Wert zurückgegeben ohne callback aufzurufen.

+ +

Einige Beispieldurchläufe der Funktion würden wie folgt aussehen:

+ +
[0, 1, 2, 3, 4].reduceRight(function(previousValue, currentValue, index, array) {
+  return previousValue + currentValue;
+});
+
+ +

Die callback Funktion wird vier mal aufgerufen. Die Parameter und der Rückgabewert dieser Funktion sind wie folgt:

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
callbackpreviousValuecurrentValueindexarrayRückgabewert
1. Aufruf433[0, 1, 2, 3, 4]7
2. Aufruf722[0, 1, 2, 3, 4]9
3. Aufruf911[0, 1, 2, 3, 4]10
4. Aufruf1000[0, 1, 2, 3, 4]10
+ +

Der Wert, der von reduceRight zurückgegeben wird, ist der Rückgabewert der letzen callback Funktion (10).

+ +

Wenn ein initialValue angegeben wird, sieht das Resultat folgendermaßen aus:

+ +
[0, 1, 2, 3, 4].reduceRight(function(previousValue, currentValue, index, array) {
+  return previousValue + currentValue;
+}, 10);
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
callbackpreviousValuecurrentValueindexarrayRückgabewert
1. Aufruf1044[0, 1, 2, 3, 4]14
2. Aufruf1433[0, 1, 2, 3, 4]17
3. Aufruf1722[0, 1, 2, 3, 4]19
4. Aufruf1911[0, 1, 2, 3, 4]20
5. Aufruf2000[0, 1, 2, 3, 4]20
+ +

Der von reduceRight zurückgegebene Wert ist in diesem Fall 20.

+ +

Beispiele

+ +

Alle Elemente in einem Array summieren

+ +
var sum = [0, 1, 2, 3].reduceRight(function(a, b) {
+  return a + b;
+});
+// sum is 6
+
+ +

Ein Array von Arrays in ein flaches Array schreiben

+ +
var flattened = [[0, 1], [2, 3], [4, 5]].reduceRight(function(a, b) {
+    return a.concat(b);
+}, []);
+// flattened is [4, 5, 2, 3, 0, 1]
+
+ +

Eine Liste von asynchronen Funktionen mit Callbacks hintereinander laufen lassen, so dass das Resultat der vorherigen der nächsten übergeben wird

+ +
const waterfall = (...functions) => (callback, ...args) =>
+  functions.reduceRight(
+    (composition, fn) => (...results) => fn(composition, ...results),
+    callback
+  )(...args);
+
+const randInt = max => Math.floor(Math.random() * max)
+
+const add5 = (callback, x) => {
+  setTimeout(callback, randInt(1000), x + 5);
+};
+const mult3 = (callback, x) => {
+  setTimeout(callback, randInt(1000), x * 3);
+};
+const sub2 = (callback, x) => {
+  setTimeout(callback, randInt(1000), x - 2);
+};
+const split = (callback, x) => {
+  setTimeout(callback, randInt(1000), x, x);
+};
+const add = (callback, x, y) => {
+  setTimeout(callback, randInt(1000), x + y);
+};
+const div4 = (callback, x) => {
+  setTimeout(callback, randInt(1000), x / 4);
+};
+
+const computation = waterfall(add5, mult3, sub2, split, add, div4);
+computation(console.log, 5) // -> 14
+
+// same as:
+
+const computation2 = (input, callback) => {
+  const f6 = x=> div4(callback, x);
+  const f5 = (x, y) => add(f6, x, y);
+  const f4 = x => split(f5, x);
+  const f3 = x => sub2(f4, x);
+  const f2 = x => mult3(f3, x);
+  add5(f2, input);
+}
+ +

Unterschied zwischen reduce und reduceRight

+ +
var a = ['1', '2', '3', '4', '5'];
+var left  = a.reduce(function(prev, cur)      { return prev + cur; });
+var right = a.reduceRight(function(prev, cur) { return prev + cur; });
+
+console.log(left);  // "12345"
+console.log(right); // "54321"
+ +

Polyfill

+ +

reduceRight wurde im ECMA-262 Standard in der 5. Edition hinzugefügt. Aus diesem Grund ist es in manchen Implementierungen nicht vorhanden. Dieses Problem kann beheben werden indem folgender Quelltext am Anfang des Skripts eingefügt werden, wodurch reduceRight auch in solchen Implementierungen unterstützt werden kann.

+ +
// Production steps of ECMA-262, Edition 5, 15.4.4.22
+// Reference: http://es5.github.io/#x15.4.4.22
+if ('function' !== typeof Array.prototype.reduceRight) {
+  Array.prototype.reduceRight = function(callback /*, initialValue*/) {
+    'use strict';
+    if (null === this || 'undefined' === typeof this) {
+      throw new TypeError('Array.prototype.reduce called on null or undefined');
+    }
+    if ('function' !== typeof callback) {
+      throw new TypeError(callback + ' is not a function');
+    }
+    var t = Object(this), len = t.length >>> 0, k = len - 1, value;
+    if (arguments.length >= 2) {
+      value = arguments[1];
+    } else {
+      while (k >= 0 && !(k in t)) {
+        k--;
+      }
+      if (k < 0) {
+        throw new TypeError('Reduce of empty array with no initial value');
+      }
+      value = t[k--];
+    }
+    for (; k >= 0; k--) {
+      if (k in t) {
+        value = callback(value, t[k], k, t);
+      }
+    }
+    return value;
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.22', 'Array.prototype.reduceRight')}}{{Spec2('ES5.1')}}Initial definition. Implemented in JavaScript 1.8.
{{SpecName('ES6', '#sec-array.prototype.reduceright', 'Array.prototype.reduceRight')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.reduceright', 'Array.prototype.reduceRight')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.reduceRight")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/reverse/index.html b/files/de/web/javascript/reference/global_objects/array/reverse/index.html new file mode 100644 index 0000000000..84560faacb --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/reverse/index.html @@ -0,0 +1,92 @@ +--- +title: Array.prototype.reverse() +slug: Web/JavaScript/Reference/Global_Objects/Array/reverse +tags: + - Array + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/reverse +--- +
{{JSRef}}
+ +

Die reverse() Methode kehrt die Reihenfolge der Arrayelemente in-place um. Das erste Element wird zum letzen und das letzte wird zum ersten.

+ +
{{EmbedInteractiveExample("pages/js/array-reverse.html")}}
+ + + +

Syntax

+ +
arr.reverse()
+ +

Rückgabewert

+ +

Das umgedrehte Array.

+ +

Beschreibung

+ +

Die reverse Methode kehrt die Reihenfolge der Elemente des angegebenen Arrays in-place um, ändert das Array und gibt eine Referenz zu diesem zurück.

+ +

Beispiele

+ +

Elemente in einem Array umkehren

+ +

Das folgende Beispiel erzeugt ein Array a mit 3 Elementen und kehrt die Reihenfolge des Arrays um. Der Aufruf von reverse() gibt eine Referenz zum umgekehrten Array a zurück.

+ +
var a = [1, 2, 3];
+
+console.log(a) // [1, 2, 3]
+
+a.reverse();
+
+console.log(a) // [3, 2, 1]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.4.4.8', 'Array.prototype.reverse')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.reverse', 'Array.prototype.reverse')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.reverse', 'Array.prototype.reverse')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.reverse")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/shift/index.html b/files/de/web/javascript/reference/global_objects/array/shift/index.html new file mode 100644 index 0000000000..e576e1bfec --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/shift/index.html @@ -0,0 +1,111 @@ +--- +title: Array.prototype.shift() +slug: Web/JavaScript/Reference/Global_Objects/Array/shift +tags: + - Array + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/shift +--- +
{{JSRef}}
+ +

Die Methode shift() entfernt das erste Element eines Arrays und gibt dieses Element zurück. Diese Methode verändert die Länge des Arrays.

+ +
{{EmbedInteractiveExample("pages/js/array-shift.html")}}
+ + + +

Syntax

+ +
arr.shift()
+ +

Rückgabewert

+ +

Das vom Array entfernte Element; {{jsxref("undefined")}} wenn das Array leer ist.

+ +

Beschreibung

+ +

Die Methode shift entfernt das Element an der nullten Stelle, verschiebt die übrigen Elemente um einen Index nach unten und gibt den Wert des entfernten Elementes zurück. Ist die {{jsxref("Array.length", "length")}} Eigenschaft gleich 0, wird {{jsxref("undefined")}} zurückgegeben.

+ +

shift ist absichtlich generisch; diese Methode kann auf Array ähnlichen Objekten mit {{jsxref("Function.call", "call", "", 1)}} oder {{jsxref("Function.apply", "applied", "", 1)}} genutzt werden. Objekte, die keine length Eigenschaft enthalten, die die letzte in einer Reihe von aufeinanderfolgenden, nullbasierten numerischen Eigenschaften widerspiegelt, verhalten sich möglicherweise nicht in einer sinnvollen Weise.

+ +

Beispiele

+ +

Ein Element eines Arrays entfernen

+ +

Das folgende Skript zeigt das Array myFish bevor und nachdem das erste Element dieses Arrays entfernt wurde. Anschließend wird das entfernte Element angezeigt:

+ +
var myFish = ['angel', 'clown', 'mandarin', 'surgeon'];
+
+console.log('myFish before: ' + myFish);
+// myFish before: ['angel', 'clown', 'mandarin', 'surgeon']
+
+var shifted = myFish.shift();
+
+console.log('myFish after: ' + myFish);
+// myFish after: ['clown', 'mandarin', 'surgeon']
+
+console.log('Removed this element: ' + shifted);
+// Removed this element: angel
+ +

Einsatz von shift() in einer while-Schleife

+ +

Die shift() Methode wird oft in der Bedingung in einer while Schleife verwendet. Im folgenden Beispiel wird in jeder Iteration das nächste Element vom Array entfernt, bis das Array leer ist.

+ +
var names = ["Andrew", "Edward", "Paul", "Chris" ,"John"];
+
+while( (i = names.shift()) !== undefined ) {
+    console.log(i);
+}
+// Andrew, Edward, Paul, Chris, John
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.4.4.9', 'Array.prototype.shift')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.shift', 'Array.prototype.shift')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.shift', 'Array.prototype.shift')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.shift")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/slice/index.html b/files/de/web/javascript/reference/global_objects/array/slice/index.html new file mode 100644 index 0000000000..75ad6c4a25 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/slice/index.html @@ -0,0 +1,244 @@ +--- +title: Array.prototype.slice() +slug: Web/JavaScript/Reference/Global_Objects/Array/slice +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/slice +--- +
{{JSRef}}
+ +

Die slice() Methode schreibt eine flache Kopie von einem Teil des Arrays in ein neues Array-Objekt von begin bis end (end nicht enthalten). Das originale Array wird nicht verändert.

+ +
{{EmbedInteractiveExample("pages/js/array-slice.html")}}
+ + + +

Syntax

+ +
arr.slice([begin[, end]])
+ +

Parameter

+ +
+
begin{{optional_inline}}
+
Null-basierter Index, an welcher die Extraktion beginnt.
+
Bei einem negativen Index kennzeichnet begin einen Versatz vom Ende der Sequenz. slice(-2) extrahiert die letzten zwei Elemente der Sequenz.
+
Wenn begin undefiniert ist, beginnt slice bei Index 0.
+
Wenn begin größer als die Länge der Sequenz ist, wird ein leeres Array zurückgegeben.
+
end {{optional_inline}}
+
Null-basierter Index bevor die Extraktion endet. slice extrahiert bis zu, aber nicht inklusive end.
+
slice(1,4) extrahiert vom zweiten bis zum vierten Element (Elemente sind indexiert als 1, 2 und 3).
+
Bei einem negativen Index kennzeichnet end einen Versatz vom Ende der Sequenz. slice(2, -1) extrahiert vom dritten bis zum vorletzten Element der Sequenz.
+
Wenn auf end weggelassen wird, extrahiert slice bis zum Ende der Sequenz (arr.length).
+
Wenn end größer als die Länge der Sequenz ist, extrahiert slice bis zum Ende der Sequenz (arr.length)
+
+ +

Rückgabewert

+ +

Ein neues Array, welches die extrahierten Elemente enthält.

+ +

Beschreibung

+ +

slice verändert das originale Array nicht. Es gibt eine Schattenkopie der Elemente des Arrays zurück. Elemente des original Arrays werden folgendermaßen in das zurückgegeben Array kopiert:

+ + + +

Wenn ein neues Element zu einem Array hinzugefügt wird, hat es keine Auswirkung auf das andere Array.

+ +

Beispiel

+ +

Gibt einen Teil eines existierenden Arrays zurück.

+ +
var fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango'];
+var citrus = fruits.slice(1, 3);
+
+// fruits enthält  ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']
+// citrus enthält ['Orange','Lemon']
+
+ +

Einsatz von slice

+ +

Im folgenden Beispiel erzeugt slice ein neues Array, newCar, von myCar.
+ Beide haben eine Referenz zu dem Objekt myHonda. Wenn sich die Farbe von myHonda zu lila ändert, dann ist die Änderung in beiden Arrays sichtbar.

+ +
// Using slice, create newCar from myCar.
+var myHonda = { color: 'red', wheels: 4, engine: { cylinders: 4, size: 2.2 } };
+var myCar = [myHonda, 2, 'cherry condition', 'purchased 1997'];
+var newCar = myCar.slice(0, 2);
+
+// Display the values of myCar, newCar, and the color of myHonda
+//  referenced from both arrays.
+console.log('myCar = ' + myCar.toSource());
+console.log('newCar = ' + newCar.toSource());
+console.log('myCar[0].color = ' + myCar[0].color);
+console.log('newCar[0].color = ' + newCar[0].color);
+
+// Change the color of myHonda.
+myHonda.color = 'purple';
+console.log('The new color of my Honda is ' + myHonda.color);
+
+// Display the color of myHonda referenced from both arrays.
+console.log('myCar[0].color = ' + myCar[0].color);
+console.log('newCar[0].color = ' + newCar[0].color);
+
+ +

Dieses Skript schreibt:

+ +
myCar = [{color:'red', wheels:4, engine:{cylinders:4, size:2.2}}, 2,
+         'cherry condition', 'purchased 1997']
+newCar = [{color:'red', wheels:4, engine:{cylinders:4, size:2.2}}, 2]
+myCar[0].color = red
+newCar[0].color = red
+The new color of my Honda is purple
+myCar[0].color = purple
+newCar[0].color = purple
+
+ +

Array-ähnliche Objekte

+ +

Die slice Methode kann auch verwendete werden, um Array-ähnliche Objekte bzw. Collections in Arrays zu konvertieren. Man muss nur die Methode an das Objekt binden.
+ Die {{jsxref("Functions/arguments", "arguments")}} Variable innerhalb einer Funktion ist ein Beispiel für ein Array-ähnliches Objekte.

+ +
function list() {
+  return Array.prototype.slice.call(arguments);
+}
+
+var list1 = list(1, 2, 3); // [1, 2, 3]
+
+ +

Das Binden von Methoden funktioniert mit der .call Funktion von {{jsxref("Function.prototype")}} und der Aufruf kann reduziert werden zu [].slice.call(arguments) anstatt Array.prototype.slice.call. Mit der {{jsxref("Function.prototype.bind", "bind")}} Funktion kann der Aufruf immer vereinfacht werden.

+ +
var unboundSlice = Array.prototype.slice;
+var slice = Function.prototype.call.bind(unboundSlice);
+
+function list() {
+  return slice(arguments);
+}
+
+var list1 = list(1, 2, 3); // [1, 2, 3]
+
+ +

Cross-Browser-Verhalten

+ +

Obwohl host Objekte (wie das DOM Objekt) laut Spezifikation nicht dem Mozilla Verhalten beim Konvertieren mit Array.prototype.slice folgen muss und IE < 9 dies auch nicht tut, erlauben Versionen ab IE 9 dieses. “shimming” kann eine sicheres cross-browser Verhalten ermöglichen. So lange andere moderne Browser weiterhin dieses Verhalten unterstützen, sowie zur Zeit IE, Mozilla, Chrome, Safari und Opera es tun, werden Entwickler beim Lesen von (DOM unterstützendem) slice Code, basierend auf diesem Schema, von der Semantik nicht in die Irre geführt.Sie können mit Sicherheit auf die Semantik vertrauen um das de facto Standard Verhalten sicherzustellen. (Dieser shim ermöglicht es auch, dass IE mit dem zweiten Argument von slice() ein explizites {{jsxref("null")}}/{{jsxref("undefined")}}) als Wert verwendet. Bei älteren Versionen des IE war dies nicht erlaubt, jedoch funktioniert es bei allen modernen Browsern inklusive IE >= 9.)

+ +
/**
+ * Shim for "fixing" IE's lack of support (IE < 9) for applying slice
+ * on host objects like NamedNodeMap, NodeList, and HTMLCollection
+ * (technically, since host objects have been implementation-dependent,
+ * at least before ES6, IE hasn't needed to work this way).
+ * Also works on strings, fixes IE < 9 to allow an explicit undefined
+ * for the 2nd argument (as in Firefox), and prevents errors when
+ * called on other DOM objects.
+ */
+(function () {
+  'use strict';
+  var _slice = Array.prototype.slice;
+
+  try {
+    // Can't be used with DOM elements in IE < 9
+    _slice.call(document.documentElement);
+  } catch (e) { // Fails in IE < 9
+    // This will work for genuine arrays, array-like objects,
+    // NamedNodeMap (attributes, entities, notations),
+    // NodeList (e.g., getElementsByTagName), HTMLCollection (e.g., childNodes),
+    // and will not fail on other DOM objects (as do DOM elements in IE < 9)
+    Array.prototype.slice = function(begin, end) {
+      // IE < 9 gets unhappy with an undefined end argument
+      end = (typeof end !== 'undefined') ? end : this.length;
+
+      // For native Array objects, we use the native slice function
+      if (Object.prototype.toString.call(this) === '[object Array]'){
+        return _slice.call(this, begin, end);
+      }
+
+      // For array like object we handle it ourselves.
+      var i, cloned = [],
+        size, len = this.length;
+
+      // Handle negative value for "begin"
+      var start = begin || 0;
+      start = (start >= 0) ? start : Math.max(0, len + start);
+
+      // Handle negative value for "end"
+      var upTo = (typeof end == 'number') ? Math.min(end, len) : len;
+      if (end < 0) {
+        upTo = len + end;
+      }
+
+      // Actual expected size of the slice
+      size = upTo - start;
+
+      if (size > 0) {
+        cloned = new Array(size);
+        if (this.charAt) {
+          for (i = 0; i < size; i++) {
+            cloned[i] = this.charAt(start + i);
+          }
+        } else {
+          for (i = 0; i < size; i++) {
+            cloned[i] = this[start + i];
+          }
+        }
+      }
+
+      return cloned;
+    };
+  }
+}());
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.4.4.10', 'Array.prototype.slice')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.slice', 'Array.prototype.slice')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.slice', 'Array.prototype.slice')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.slice")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/some/index.html b/files/de/web/javascript/reference/global_objects/array/some/index.html new file mode 100644 index 0000000000..0fe959b0d7 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/some/index.html @@ -0,0 +1,209 @@ +--- +title: Array.prototype.some() +slug: Web/JavaScript/Reference/Global_Objects/Array/some +tags: + - Array + - ECMAScript5 + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/some +--- +
{{JSRef}}
+ +

Die Methode some() überprüft ob mindestens ein Element des Arrays den als Funktion übergebenen Kriterien entspricht.

+ +
+

Hinweis: Diese Methode gibt false für jede Bedingung auf einem leeren Array zurück.

+
+ +
{{EmbedInteractiveExample("pages/js/array-some.html")}}
+ + + +

Syntax

+ +
arr.some(callback[, thisArg])
+ +

Parameter

+ +
+
callback
+
Funktion die jedes Element überprüft, nimmt drei Argumente entgegen: +
+
currentValue
+
Das aktuell zu verarbeitende Element des Arrays.
+
index{{Optional_inline}}
+
Der Index des aktuell zu verarbeitenden Elementes im Array.
+
array{{Optional_inline}}
+
Die Arrayinstanz auf welcher die some() Methode aufgerufen wurde.
+
+
+
thisArg{{Optional_inline}}
+
Wert der über das this Schüsselwort innerhalb von callback verfügbar ist.
+
+ +

Rückgabewert

+ +

true wenn die callback Methode ein positives ({{Glossary("truthy")}}) Ergebnis für eines der Elemente im array ermittelt hat; Andernfalls, false.

+ +

Beschreibung

+ +

some() führt die callback Funktion einmal für jedes Element innerhalb des Arrays aus, bis ein Element gefunden wird, bei dem callback einen truthy Wert (ein Wert der durch die Konvertierung zu boolean true ergibt) zurückgibt. Wird ein solches Element gefunden, gibt some() sofort true zurück. callback wird nur für Elemente des Arrays ausgeführt, die einen zugewiesenen Wert haben; Für undefinierte oder gelöschte Elemente des Arrays wird callback nicht ausgeführt.

+ +

callback wird mit drei Argumenten aufgerufen: Dem Wert des Elementes, dem Index des Elementes und dem zugrundeliegenden Array.

+ +

WIrd ein thisArg Parameter an die some() Methode übergeben, wird dieser als this bei der callback Funtion benutzt. Andernfalls wird der Wert {{jsxref("undefined")}} als this benutzt. Der tatsächliche Wert von this wird entsprechend der generellen Regeln zur Belegung des this Schlüsselwortes innerhalb von Funktionen gesetzt.

+ +

some() verändert nicht das Array auf dem die Methode aufgerufen wurde.

+ +

Die von some() zu verarbeitenden Elemente werden vor dem ersten Aufruf von callback ermittelt. Elemente, die nach dem Aufruf von some() zum Array hinzugefügt werden, werden nicht mit callback aufgerufen. Wird ein noch nicht besuchtes Element des Arrays durch callback geändert, wird sein Wert, der an callback übermittelt wird, der Wert zu dem Zeitpunkt, zu dem some() den Index besucht, sein. Wird ein Element aus dem Array gelöscht, wird es nicht betrachtet.

+ +

Beispiele

+ +

Werte eines Arrays überprüfen

+ +

Die folgenden Beispiele prüfen ob es ein Element größer als 10 im Array gibt.

+ +
function isBiggerThan10(element, index, array) {
+  return element > 10;
+}
+
+[2, 5, 8, 1, 4].some(isBiggerThan10);  // false
+[12, 5, 8, 1, 4].some(isBiggerThan10); // true
+
+ +

Werte eines Arrays mit arrow functions überprüfen

+ +

Arrow Funktionen ermöglichen eine kürzere Schreibweise für die gleiche Logik.

+ +
[2, 5, 8, 1, 4].some(x => x > 10);  // false
+[12, 5, 8, 1, 4].some(x => x > 10); // true
+
+ +

Prüfen ob ein Element in einem Array existiert

+ +

Um die Methode  includes() nachzuahmen, gibt  die folgende Funktion true zurück, wenn das Element im Array existiert:

+ +
var fruits = ['apple', 'banana', 'mango', 'guava'];
+
+function checkAvailability(arr, val) {
+  return arr.some(function(arrVal) {
+    return val === arrVal;
+  });
+}
+
+checkAvailability(fruits, 'kela');   // false
+checkAvailability(fruits, 'banana'); // true
+ +

Prüfen ob ein Element in einem Array existiert mit einer arrow function

+ +
var fruits = ['apple', 'banana', 'mango', 'guava'];
+
+function checkAvailability(arr, val) {
+  return arr.some(arrVal => val === arrVal);
+}
+
+checkAvailability(fruits, 'kela');   // false
+checkAvailability(fruits, 'banana'); // true
+ +

Jeden Wert in einen boolschen Wert konvertieren

+ +
var TRUTHY_VALUES = [true, 'true', 1];
+
+function getBoolean(a) {
+  'use strict';
+
+  var value = a;
+
+  if (typeof value === 'string') {
+    value = value.toLowerCase().trim();
+  }
+
+  return TRUTHY_VALUES.some(function(t) {
+    return t === value;
+  });
+}
+
+getBoolean(false);   // false
+getBoolean('false'); // false
+getBoolean(1);       // true
+getBoolean('true');  // true
+ +

Polyfill

+ +

some() wurde im Rahmen des ECMA-262 Standards in der 5. Edition hinzugefügt. Daher kann es sein, dass es nicht in allen Implementierungen des Standards enthalten ist. Diese Problem kann behoben werden, indem folgenden Quelltext vor Ihren Skripten eingefügt wird, wodurch Sie die some() Methode in Ihrem Programmcode verwenden können. Die nachfolgende Implementierung ist eine exakte Abdeckung der ECMA-262 Spezifikation in der 5. Edition, basierend auf der Annahme dass {{jsxref("Object")}} und {{jsxref("TypeError")}} Originalwerte aufweisen und dass fun.call den Originalwert von {{jsxref("Function.prototype.call()")}} liefert.

+ +
// Production steps of ECMA-262, Edition 5, 15.4.4.17
+// Reference: http://es5.github.io/#x15.4.4.17
+if (!Array.prototype.some) {
+  Array.prototype.some = function(fun/*, thisArg*/) {
+    'use strict';
+
+    if (this == null) {
+      throw new TypeError('Array.prototype.some called on null or undefined');
+    }
+
+    if (typeof fun !== 'function') {
+      throw new TypeError();
+    }
+
+    var t = Object(this);
+    var len = t.length >>> 0;
+
+    var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
+    for (var i = 0; i < len; i++) {
+      if (i in t && fun.call(thisArg, t[i], i, t)) {
+        return true;
+      }
+    }
+
+    return false;
+  };
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES5.1', '#sec-15.4.4.17', 'Array.prototype.some')}}{{Spec2('ES5.1')}}Initiale Definition. Implementiert in JavaScript 1.6.
{{SpecName('ES6', '#sec-array.prototype.some', 'Array.prototype.some')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.some', 'Array.prototype.some')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.some")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/sort/index.html b/files/de/web/javascript/reference/global_objects/array/sort/index.html new file mode 100644 index 0000000000..a59d8ff2c6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/sort/index.html @@ -0,0 +1,264 @@ +--- +title: Array.prototype.sort() +slug: Web/JavaScript/Reference/Global_Objects/Array/sort +tags: + - Array + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/sort +--- +
{{JSRef}}
+ +

Die sort() Methode sortiert die Elemente eines Arrays {{interwiki("wikipedia","in-place")}} und gibt das Array zurück. Standardmäßig werden alle Elemente in Strings umgewandelt und dann anhand ihrer UTF-16 Codepoints miteinander verglichen.

+ +

Die Zeit- und Speicherkomplexität des Sortierens kann nicht garantiert werden, weil sie implementierungsabhängig ist.

+ +
{{EmbedInteractiveExample("pages/js/array-sort.html")}}
+ + + +

Syntax

+ +
arr.sort([compareFunction])
+
+ +

Parameter

+ +
+
compareFunction {{optional_inline}}
+
Gibt eine Funktion an, die die Sortierreihenfolge definiert. Wenn nicht angegeben, wird das Array nach dem Unicode-Codepoint jedes Zeichens entsprechend der Stringumwandlung jedes Elements sortiert. +
+
firstEl
+
Das erste Element zum Vergleich.
+
secondEl
+
Das zweite Element zum Vergleich.
+
+
+
+ +

Rückgabewert

+ +

Das sortierte Array. Beachten Sie, dass das Array {{interwiki("wikipedia","in-place")}} sortiert und keine Kopie angelegt wird.

+ +

Beschreibung

+ +

Wenn compareFunction nicht angegeben wird, werden alle Arrayelemente, die nicht undefined sind, sortiert indem sie in Strings konvertiert werden und in UTF-16-Code-Unit-Reihenfolge verglichen werden. Zum Beispiel steht "banana" vor "cherry". Bei einer numerischen Sortierung kommt 9 vor 80, aber weil Zahlen in Strings konvertiert werden, kommt "80" in Unicode vor "9". Alle Elemente die undefined sind werden ans Ende des Arrays sortiert.

+ +
+

Hinweis: In UTF-16 werden Unicode-Zeichen über \uFFFF als zwei Ersatzcodeeinheiten im Bereich \uD800 - \ uDFFF codiert. Der Wert jeder Codeeinheit wird für den Vergleich gesondert berücksichtigt. Daher wird das durch das Ersatzpaar \uD655 \uDE55 gebildete Zeichen vor dem Zeichen \uFF3A sortiert.

+
+ +

Wenn compareFunction angegeben wird, werden alle Arrayelemente, die nicht undefined sind, nach dem Rückgabewert der Vergleichsfunktion sortiert (alle Elemente die undefined sind werden ans Ende des Arrays sortiert, ohne Aufruf von compareFunction). Wenn a und b zwei zu vergleichende Elemente sind, gilt Folgendes:

+ + + +

Die Vergleichsfunktion hat die Form:

+ +
function compare(a, b) {
+  if (a ist kleiner als b anhand von Sortierkriterien) {
+    return -1;
+  }
+  if (a ist größer als b anhand der Sortierkriterien) {
+    return 1;
+  }
+  // a muss gleich b sein
+  return 0;
+}
+
+ +

Um Nummern anstatt Strings zu vergleichen, kann die Vergleichsfunktion einfach b von a subtrahieren. Die folgende Funktion sortiert ein Array aufsteigend (sofern kein Infinity und NaN enthalten):

+ +
function compareNumbers(a, b) {
+  return a - b;
+}
+
+ +

Die sort Methode kann bequem mit {{jsxref("Operators/function", "Funktionsausdrücken", "", 1)}} benutzt werden:

+ +
var numbers = [4, 2, 5, 1, 3];
+numbers.sort(function(a, b) {
+  return a - b;
+});
+console.log(numbers);
+
+// [1, 2, 3, 4, 5]
+
+ +

ES2015 bietet {{jsxref("Functions/Arrow_functions", "Pfeilfunktionen", "", 1)}} mit noch kürzerer Syntax.

+ +
let numbers = [4, 2, 5, 1, 3];
+numbers.sort((a, b) => a - b);
+console.log(numbers);
+
+// [1, 2, 3, 4, 5]
+ +

Objekte können anhand der Werte eines ihrer Eigenschaften sortiert werden.

+ +
var items = [
+  { name: 'Edward', value: 21 },
+  { name: 'Sharpe', value: 37 },
+  { name: 'And', value: 45 },
+  { name: 'The', value: -12 },
+  { name: 'Magnetic', value: 13 },
+  { name: 'Zeros', value: 37 }
+];
+
+// Sortieren nach Wert
+items.sort(function (a, b) {
+  return a.value - b.value;
+});
+
+// Sortieren nach Wert
+items.sort(function(a, b) {
+  var nameA = a.name.toUpperCase(); // Groß-/Kleinschreibung ignorieren
+  var nameB = b.name.toUpperCase(); // Groß-/Kleinschreibung ignorieren
+  if (nameA < nameB) {
+    return -1;
+  }
+  if (nameA > nameB) {
+    return 1;
+  }
+
+  // Namen müssen gleich sein
+  return 0;
+});
+ +

Beispiele

+ +

Erstellen, Anzeigen und Sortieren eines Arrays

+ +

Im folgenden Beispiel werden vier Arrays erstellt, das ursprüngliche Array angezeigt, danach die sortierten Arrays. Die numerischen Arrays werden erst ohne, dann mit Vergleichsfunktion sortiert.

+ +
var stringArray = ['Blue', 'Humpback', 'Beluga'];
+var numericStringArray = ['80', '9', '700'];
+var numberArray = [40, 1, 5, 200];
+var mixedNumericArray = ['80', '9', '700', 40, 1, 5, 200];
+
+function compareNumbers(a, b) {
+  return a - b;
+}
+
+console.log('stringArray:', stringArray.join());
+console.log('Sorted:', stringArray.sort());
+
+console.log('numberArray:', numberArray.join());
+console.log('Sorted without a compare function:', numberArray.sort());
+console.log('Sorted with compareNumbers:', numberArray.sort(compareNumbers));
+
+console.log('numericStringArray:', numericStringArray.join());
+console.log('Sorted without a compare function:', numericStringArray.sort());
+console.log('Sorted with compareNumbers:', numericStringArray.sort(compareNumbers));
+
+console.log('mixedNumericArray:', mixedNumericArray.join());
+console.log('Sorted without a compare function:', mixedNumericArray.sort());
+console.log('Sorted with compareNumbers:', mixedNumericArray.sort(compareNumbers));
+ +

Dieses Beispiel erzeugt die folgende Ausgabe. Wie die Ausgabe zeigt, werden Zahlen bei Verwendung einer Vergleichsfunktion korrekt sortiert, ob es sich um Zahlen oder numerische Strings handelt.

+ +
stringArray: Blue,Humpback,Beluga
+Sorted: Beluga,Blue,Humpback
+
+numberArray: 40,1,5,200
+Sorted without a compare function: 1,200,40,5
+Sorted with compareNumbers: 1,5,40,200
+
+numericStringArray: 80,9,700
+Sorted without a compare function: 700,80,9
+Sorted with compareNumbers: 9,80,700
+
+mixedNumericArray: 80,9,700,40,1,5,200
+Sorted without a compare function: 1,200,40,5,700,80,9
+Sorted with compareNumbers: 1,5,9,40,80,200,700
+ +

Sortierung von nicht-ASCII Zeichen

+ +

Zum Sortieren von Strings mit Nicht-ASCII-Zeichen, d. h. Zeichenfolgen mit Akzentzeichen (e, é, è, a, ä, etc.), Zeichenfolgen aus anderen Sprachen als Englisch: Verwenden Sie {{jsxref("String.localeCompare")}}. Diese Funktion kann diese Zeichen vergleichen, damit sie in der richtigen Reihenfolge angezeigt werden.

+ +
var items = ['réservé', 'premier', 'cliché', 'communiqué', 'café', 'adieu'];
+items.sort(function (a, b) {
+  return a.localeCompare(b);
+});
+
+// items is ['adieu', 'café', 'cliché', 'communiqué', 'premier', 'réservé']
+ +

Sortieren mit map()

+ +

Die compareFunction kann mehrmals pro Element innerhalb des Arrays aufgerufen werden. Abhängig von der Beschaffenheit von compareFunction kann dies zu einem hohen Overhead führen. Je mehr Arbeit eine compareFunction erledigt und je mehr Elemente zu sortieren sind, desto sinnvoller ist es die Verwendung von {{jsxref("Array.prototype.map()", "map()")}} zum Sortieren in Betracht zu ziehen. Die Idee ist, das Array einmal zu durchlaufen, um die tatsächlichen Werte für das Sortieren in ein temporäres Array zu extrahieren, das temporäre Array zu sortieren und dann das temporäre Array zu durchlaufen, um die richtige Reihenfolge zu erreichen.

+ +
// Das zu sortierende Array
+var list = ['Delta', 'alpha', 'CHARLIE', 'bravo'];
+
+// Temporäres Array enthält Objekte mit Position und Sortierwert
+var mapped = list.map(function(el, i) {
+  return { index: i, value: el.toLowerCase() };
+})
+
+// Sortieren des gemappten Arrays mit den reduzierten Werten
+mapped.sort(function(a, b) {
+  if (a.value > b.value) {
+    return 1;
+  }
+  if (a.value < b.value) {
+    return -1;
+  }
+  return 0;
+});
+
+// Behälter für die sich ergebende Reihenfolge
+var result = mapped.map(function(el){
+  return list[el.index];
+});
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition
{{SpecName('ES5.1', '#sec-15.4.4.11', 'Array.prototype.sort')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.sort', 'Array.prototype.sort')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.sort', 'Array.prototype.sort')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.sort")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/splice/index.html b/files/de/web/javascript/reference/global_objects/array/splice/index.html new file mode 100644 index 0000000000..f77aab6bb1 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/splice/index.html @@ -0,0 +1,162 @@ +--- +title: Array.prototype.splice() +slug: Web/JavaScript/Reference/Global_Objects/Array/splice +tags: + - Array + - JavaScript + - Method + - Prototype + - Reference +translation_of: Web/JavaScript/Reference/Global_Objects/Array/splice +--- +
{{JSRef}}
+ +

Die splice() Methode ändert den Inhalt eines Arrays durch das Entfernen vorhandener Elemente und/oder Hinzufügen neuer Elemente.

+ +
{{EmbedInteractiveExample("pages/js/array-splice.html")}}
+ +

Syntax

+ +
array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
+
+ +

Parameter

+ +
+
start
+
Index ab welchem das Array geändert werden soll. Falls start größer als die Länge des Arrays ist, wird start auf die Länge des Arrays gesetzt.
+
Falls start negativ ist, beginnt die Änderung entsprechend viele Stellen rückwärts vom Ende des Arrays (d.h. hat start den Wert -n ist dies gleichbedeutend mit array.length - n) und wird auf 0 gesetzt wenn der absolute Wert von start größer als die Länge des Arrays ist.
+
deleteCount {{optional_inline}}
+
Gibt die Anzahl der zu entfernenden alten Array Elemente an.
+
Wenn deleteCount weggelassen wird oder wenn der Wert größer oder gleich array.length - start ist (d. h. wenn der Wert größer oder gleich der Anzahl der von start aus verbleibenden Elemente ist), wird das ganze Array ab dem Index start gelöscht.
+
Wenn deleteCount 0 oder negativ ist, werden keine Elemente entfernt. In diesem Fall sollte man mindestens ein neues Element als weiteren Parameter übergeben, da das Array sonst nicht geändert wird.
+
item1, item2, ... {{optional_inline}}
+
Die Elemente, die dem Array ab dem Index start hinzugefügt werden sollen. Falls keine Elemente angegeben werden, entfernt splice lediglich Elemente des Arrays.
+
+ +

Rückgabewert

+ +

Ein Array, welches die entfernten Elemente enthält. Wenn nur ein Element entfernt wurde, wird ein Array mit nur einem Element zurückgegeben. Wenn kein Element entfernt wurde, wird ein leeres Array zurückgegeben.

+ +

Beschreibung

+ +

Wenn die Anzahl der neu hinzugefügten Elemente ungleich der Anzahl der entfernten Elemente ist, wird die Länge des Arrays geändert. Bei gleicher Anzahl werden vorhandene Elemente sozusagen ersetzt.

+ +

Beispiele

+ +

Entfernen von 0 (null) Elementen bei Index 2 und Einfügen von "drum"

+ +
var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
+var removed = myFish.splice(2, 0, 'drum');
+
+// myFish is ["angel", "clown", "drum", "mandarin", "sturgeon"]
+// removed is [], no elements removed
+ +

Entfernen von o (null) Elementen bei Index 2 und Einfügen von "drum" und "guitar"

+ +
var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
+var removed = myFish.splice(2, 0, 'drum', 'guitar');
+
+// myFish is ["angel", "clown", "drum", "guitar", "mandarin", "sturgeon"]
+// removed is [], no elements removed
+ +

Entfernen von 1 Element bei Index 3

+ + + +
var myFish = ['angel', 'clown', 'drum', 'mandarin', 'sturgeon'];
+var removed = myFish.splice(3, 1);
+
+// removed is ["mandarin"]
+// myFish is ["angel", "clown", "drum", "sturgeon"]
+ + + +

Entfernen von 1 Element bei Index 2 und Einfügen von "trumpet"

+ +
var myFish = ['angel', 'clown', 'drum', 'sturgeon'];
+var removed = myFish.splice(2, 1, 'trumpet');
+
+// myFish is ["angel", "clown", "trumpet", "sturgeon"]
+// removed is ["drum"]
+
+ +

Entfernen von 2 Elementen bei Index 0 und Einfügen von "parrot", "anemone" und "blue"

+ +
var myFish = ['angel', 'clown', 'trumpet', 'sturgeon'];
+var removed = myFish.splice(0, 2, 'parrot', 'anemone', 'blue');
+
+// myFish is ["parrot", "anemone", "blue", "trumpet", "sturgeon"]
+// removed is ["angel", "clown"]
+ +

Entfernen von 2 Elementen vom Index 2

+ +
var myFish = ['parrot', 'anemone', 'blue', 'trumpet', 'sturgeon'];
+var removed = myFish.splice(myFish.length - 3, 2);
+
+// myFish is ["parrot", "anemone", "sturgeon"]
+// removed is ["blue", "trumpet"]
+ +

Entfernen von einem Element bei Index -2

+ +
var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
+var removed = myFish.splice(-2, 1);
+
+// myFish is ["angel", "clown", "sturgeon"]
+// removed is ["mandarin"]
+ +

Entfernen von allen Elementen nach Index 2 (inklusiv)

+ +
var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
+var removed = myFish.splice(2);
+
+// myFish is ["angel", "clown"]
+// removed is ["mandarin", "sturgeon"]
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommenter
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.4.4.12', 'Array.prototype.splice')}}{{Spec2('ES5.1')}}
{{SpecName('ES6', '#sec-array.prototype.splice', 'Array.prototype.splice')}}{{Spec2('ES6')}}
{{SpecName('ESDraft', '#sec-array.prototype.splice', 'Array.prototype.splice')}}{{Spec2('ESDraft')}}
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.splice")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/tolocalestring/index.html b/files/de/web/javascript/reference/global_objects/array/tolocalestring/index.html new file mode 100644 index 0000000000..ef5c1883b5 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/tolocalestring/index.html @@ -0,0 +1,183 @@ +--- +title: Array.prototype.toLocaleString() +slug: Web/JavaScript/Reference/Global_Objects/Array/toLocaleString +tags: + - Array + - Internationalization + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/toLocaleString +--- +
{{JSRef}}
+ +

Die Methode toLocaleString() gibt als Rückgabewert einen String zurück, welcher die Elemente des Arrays darstellt. Die Array-Elemente werden mittels ihrer toLocaleString Methode in Strings umgewandelt und durch einen sprachspezifischen String (wie zum Beispiel ein Kommazeichen “,”) separiert.

+ +
{{EmbedInteractiveExample("pages/js/array-tolocalestring.html")}}
+ +

Syntax

+ +
arr.toLocaleString([locales [, options]]);
+
+ +

Parameter

+ +
+
locales {{optional_inline}}
+
Ein String mit einem Language-Tag nach BCP 47 oder ein Array solcher Strings. Für die allgemeine Art und Interpretation des locales Parameters, siehe Seite {{jsxref("Intl")}}.
+
options {{optional_inline}}
+
Ein Objekt mit konfigurierbaren Eigenschaften, für Numbers siehe {{jsxref("Number.prototype.toLocaleString()")}}, und für Datumsangaben siehe {{jsxref("Date.prototype.toLocaleString()")}}.
+
+ +

Rückgabewert

+ +

Ein einzelner String der die Elemente des Arrays darstellt.

+ +

Beispiele

+ +

Verwendung von locales und options

+ +

Die Elemente des Arrays werden mittels der toLocaleString Methode in einen String umgewandelt.

+ + + +

Jedem Strings und Numbers Element im Array prices die Währung zuordnen:

+ +
var prices = ['￥7', 500, 8123, 12];
+prices.toLocaleString('ja-JP', { style: 'currency', currency: 'JPY' });
+
+// "￥7,￥500,￥8,123,￥12"
+
+ +

Für weitere Beispiele, siehe auch {{jsxref("Global_Objects/Intl","Intl")}}, {{jsxref("Global_Objects/NumberFormat","NumberFormat")}} und {{jsxref("Global_Objects/DateTimeFormat","DateTimeFormat")}}.

+ +

Polyfill

+ +
// https://tc39.github.io/ecma402/#sup-array.prototype.tolocalestring
+if (!Array.prototype.toLocaleString) {
+  Object.defineProperty(Array.prototype, 'toLocaleString', {
+    value: function(locales, options) {
+      // 1. Let O be ? ToObject(this value).
+      if (this == null) {
+        throw new TypeError('"this" is null or not defined');
+      }
+
+      var a = Object(this);
+
+      // 2. Let len be ? ToLength(? Get(A, "length")).
+      var len = a.length >>> 0;
+
+      // 3. Let separator be the String value for the
+      //    list-separator String appropriate for the
+      //    host environment's current locale (this is
+      //    derived in an implementation-defined way).
+      // NOTE: In this case, we will use a comma
+      var separator = ',';
+
+      // 4. If len is zero, return the empty String.
+      if (len === 0) {
+        return '';
+      }
+
+      // 5. Let firstElement be ? Get(A, "0").
+      var firstElement = a[0];
+      // 6. If firstElement is undefined or null, then
+      //  a.Let R be the empty String.
+      // 7. Else,
+      //  a. Let R be ?
+      //     ToString(?
+      //       Invoke(
+      //        firstElement,
+      //        "toLocaleString",
+      //        « locales, options »
+      //       )
+      //     )
+      var r = firstElement == null ?
+        '' : firstElement.toLocaleString(locales, options);
+
+      // 8. Let k be 1.
+      var k = 1;
+
+      // 9. Repeat, while k < len
+      while (k < len) {
+        // a. Let S be a String value produced by
+        //   concatenating R and separator.
+        var s = r + separator;
+
+        // b. Let nextElement be ? Get(A, ToString(k)).
+        var nextElement = a[k];
+
+        // c. If nextElement is undefined or null, then
+        //   i. Let R be the empty String.
+        // d. Else,
+        //   i. Let R be ?
+        //     ToString(?
+        //       Invoke(
+        //        nextElement,
+        //        "toLocaleString",
+        //        « locales, options »
+        //       )
+        //     )
+        r = nextElement == null ?
+          '' : nextElement.toLocaleString(locales, options);
+
+        // e. Let R be a String value produced by
+        //   concatenating S and R.
+        r = s + r;
+
+        // f. Increase k by 1.
+        k++;
+      }
+
+      // 10. Return R.
+      return r;
+    }
+  });
+}
+
+ +

Für die Unterstützung von veralteten JavaScript Engines, die Object.defineProperty nicht kennen, sollte kein Polyfill für Array.prototype Methoden eingesetzt werden, da sie auf diese Weise nicht mehr nicht-durchzählbar gemacht werden können.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ESDraft', '#sec-array.prototype.tolocalestring', 'Array.prototype.toLocaleString')}}{{Spec2('ESDraft')}}Initiale Definition war in ECMAScript 3.
{{SpecName('ES Int Draft', '#sup-array.prototype.tolocalestring', 'Array.prototype.toLocaleString')}}{{Spec2('ES Int Draft')}}Diese Definition ersetzt die Definition aus ECMA-262.
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.toLocaleString")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/tosource/index.html b/files/de/web/javascript/reference/global_objects/array/tosource/index.html new file mode 100644 index 0000000000..0e7dd02745 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/tosource/index.html @@ -0,0 +1,69 @@ +--- +title: Array.prototype.toSource() +slug: Web/JavaScript/Reference/Global_Objects/Array/toSource +tags: + - Array + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/toSource +--- +
{{JSRef}} {{non-standard_header}}
+ +

Die toSource() Methode gibt einen String zurück, welcher den Quelltext des Arrays repräsentiert.

+ +

Syntax

+ +
arr.toSource()
+ +

Rückgabewert

+ +

Ein String, der den Quelltext des Array repräsentiert.

+ +

Beschreibung

+ +

Die toSource Methode gibt folgende Werte zurück:

+ + + +

Diese Methode wird für gewöhnlich von JavaScript intern aufgerufen und nicht explizit in einem QUelltext. Man kann toSource beim Debuggen aufrufen, um den Inhalt eines Arrays abzufragen.

+ +

Beispiele

+ +

Untersuchen des Quelltextes eines Arrays

+ +

Um den Quellcode eines Arrays zu untersuchen:

+ +
var alpha = new Array('a', 'b', 'c');
+
+alpha.toSource();
+//returns ['a', 'b', 'c']
+
+ +

Spezifikationen

+ +

In keiner Spezifikation enthalten. Implementiert in JavaScript 1.3.

+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.toSource")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/tostring/index.html b/files/de/web/javascript/reference/global_objects/array/tostring/index.html new file mode 100644 index 0000000000..0d8d1da3e6 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/tostring/index.html @@ -0,0 +1,80 @@ +--- +title: Array.prototype.toString() +slug: Web/JavaScript/Reference/Global_Objects/Array/toString +tags: + - Array + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/toString +--- +
{{JSRef}}
+ +

Die toString() Methode gibt einen String zurück, der das Array und seine Elemente repräsentiert.

+ +

{{EmbedInteractiveExample("pages/js/array-tostring.html")}}

+ +

Syntax

+ +
arr.toString()
+ +

Rückgabewert

+ +

Ein String, der die Elemente des Arrays repräsentiert.

+ +

Beschreibung

+ +

Das {{jsxref("Array")}} Objekt überschreibt die toString Methode von {{jsxref("Object")}}. Für Arrayobjekte fügt die toString Methode das Array zu einem String zusammen, der jedes Element des Arrayelemente durch Kommata getrennt enthält.

+ +

JavaScript ruft die toString Methode automatisch auf wenn ein Array als Text repräsentiert wird oder wenn ein Array in einer Stringkonkatenation verwendet wird.

+ +

ECMAScript 5 Semantik

+ +

Beginnend mt JavaScript 1.8.5 (Firefox 4), und mit der Semantik des ECMAScript der 5. Edition, ist die toString() Methode generisch und kann mit jeglichen Objekten verwendet werden. {{jsxref("Object.prototype.toString()")}} wird aufgerufen und der resultierende Wert wird zurückgegeben.

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES1')}}{{Spec2('ES1')}}Initiale Definition. Implementiert in JavaScript 1.1.
{{SpecName('ES5.1', '#sec-15.4.4.2', 'Array.prototype.toString')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.tostring', 'Array.prototype.toString')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.tostring', 'Array.prototype.toString')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.toString")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/unobserve/index.html b/files/de/web/javascript/reference/global_objects/array/unobserve/index.html new file mode 100644 index 0000000000..fd31177c3a --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/unobserve/index.html @@ -0,0 +1,88 @@ +--- +title: Array.unobserve() +slug: Web/JavaScript/Reference/Global_Objects/Array/unobserve +tags: + - Array + - JavaScript + - Method + - Obsolete +translation_of: Archive/Web/JavaScript/Array.unobserve +--- +
{{JSRef}} {{obsolete_header}}
+ +

Die Array.unobserve() Methode wird eingesetzt um Observers die mit {{jsxref("Array.observe()")}} eingestellt wurden zu entfernen, jedoch ist dieses veraltet und wurde schon von Browsern entfernt. Man kann einen allgemeineres {{jsxref("Proxy")}} Objekt benutzen.

+ +

Syntax

+ +
Array.unobserve(arr, callback)
+ +

Parameter

+ +
+
arr
+
Das Array, welches nicht mehr Überwacht werden soll.
+
callback
+
Die Referenz zu dem Observer, die mit der Überwachung von Änderungen auf dem Array arr aufhören soll.
+
+ +

Beschreibung

+ +

Array.unobserve() sollt nach {{jsxref("Array.observe()")}} aufgerufen werden, um einen Observer von einem Array zu entfernen.

+ +

callback sollte eine Referenz auf eine Funktion sein und nicht einen anonyme Funktion sein, weil diese Referenz genutzt wird um den Observer zu entfernen. Es ist nicht zulässig Array.unobserve() mit einer anonymen Funktion aufzurufen, weil dadurch kein Observer entfernt wird.

+ +

Beispiele

+ +

Observer von Array entfernen

+ +
var arr = [1, 2, 3];
+
+var observer = function(changes) {
+  console.log(changes);
+}
+
+Array.observe(arr, observer);
+​
+arr.push(4);
+// [{type: "splice", object: <arr>, index: 3, removed:[], addedCount: 1}]
+
+Array.unobserve(arr, observer);
+
+arr.pop();
+// The callback wasn't called
+ +

Einsatz einer anonymen Funktion

+ +
var persons = ['Khalid', 'Ahmed', 'Mohammed'];
+
+Array.observe(persons, function (changes) {
+  console.log(changes);
+});
+
+persons.shift();
+// [{type: "splice", object: <arr>, index: 0, removed: [ "Khalid" ], addedCount: 0 }]
+
+Array.unobserve(persons, function (changes) {
+  console.log(changes);
+});
+
+persons.push('Abdullah');
+// [{type: "splice", object: <arr>, index: 2, removed: [], addedCount: 1 }]
+// The callback will always be called
+
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.unobserve")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/unshift/index.html b/files/de/web/javascript/reference/global_objects/array/unshift/index.html new file mode 100644 index 0000000000..2960b03cbb --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/unshift/index.html @@ -0,0 +1,99 @@ +--- +title: Array.prototype.unshift() +slug: Web/JavaScript/Reference/Global_Objects/Array/unshift +tags: + - Array + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/unshift +--- +
{{JSRef}}
+ +

Die unshift() Methode fügt ein oder mehrere Elemente am Anfang eines Array hinzu und gibt die neue Länge des Arrays zurück.

+ +
{{EmbedInteractiveExample("pages/js/array-unshift.html")}}
+ +

Syntax

+ +
arr.unshift(element1[, ...[, elementN]])
+ +

Parameter

+ +
+
elementN
+
Die Elemente die am Anfang des Arrays hinzugefügt werden sollen.
+
+ +

Rückgabewert

+ +

Die neue {{jsxref("Array.length", "length")}} Eigenschaft des Arrays auf dem die Methode aufgerufen wurde.

+ +

Beschreibung

+ +

Die unshift Methode fügt die gegeben Elemente am Anfang eines Arrays ähnlichen Objektes hinzu.

+ +

unshift ist extra generisch gehalten. Diese Methode kann mit {{jsxref("Function.call", "call", "", 1)}} oder {{jsxref("Function.apply", "apply", "", 1)}} auf einem Array ähnlichen Objekt angewendet werden. Objekte, die nicht über die Eigenschaft length verfügen, welche nicht das letzte in einer Reihe aufeinander folgenden, null-basierenden nummerische Werten repräsentieren, können sinnlose Ergebnisse liefern.

+ +

Beispiele

+ +
var arr = [1, 2];
+
+arr.unshift(0); // result of call is 3, the new array length
+// arr is [0, 1, 2]
+
+arr.unshift(-2, -1); // = 5
+// arr is [-2, -1, 0, 1, 2]
+
+arr.unshift([-3]);
+// arr is [[-3], -2, -1, 0, 1, 2]
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES3')}}{{Spec2('ES3')}}Initiale Definition. Implementiert in JavaScript 1.2.
{{SpecName('ES5.1', '#sec-15.4.4.13', 'Array.prototype.unshift')}}{{Spec2('ES5.1')}} 
{{SpecName('ES6', '#sec-array.prototype.unshift', 'Array.prototype.unshift')}}{{Spec2('ES6')}} 
{{SpecName('ESDraft', '#sec-array.prototype.unshift', 'Array.prototype.unshift')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.unshift")}}

+
+ +

Siehe auch

+ + diff --git a/files/de/web/javascript/reference/global_objects/array/values/index.html b/files/de/web/javascript/reference/global_objects/array/values/index.html new file mode 100644 index 0000000000..3736af04f8 --- /dev/null +++ b/files/de/web/javascript/reference/global_objects/array/values/index.html @@ -0,0 +1,86 @@ +--- +title: Array.prototype.values() +slug: Web/JavaScript/Reference/Global_Objects/Array/values +tags: + - Array + - ECMAScript 2015 + - Iterator + - JavaScript + - Method + - Prototype +translation_of: Web/JavaScript/Reference/Global_Objects/Array/values +--- +
{{JSRef}}
+ +

Die values() Methode gibt ein neues Iterator Objekt des Arrays zurück, welches die Werte für jeden Eintrag im Array enthält.

+ +

{{EmbedInteractiveExample("pages/js/array-values.html")}}

+ +
var a = ['w', 'y', 'k', 'o', 'p'];
+var iterator = a.values();
+
+console.log(iterator.next().value); // w
+console.log(iterator.next().value); // y
+console.log(iterator.next().value); // k
+console.log(iterator.next().value); // o
+console.log(iterator.next().value); // p
+ +

Syntax

+ +
arr.values()
+ +

Rückgabewert

+ +

Ein neues {{jsxref("Iterator")}} Objekt von dem Array.

+ +

Beispiele

+ +

Benutzung der for...of loop

+ +
var arr = ['w', 'y', 'k', 'o', 'p'];
+var iterator = arr.values();
+
+for (let letter of iterator) {
+  console.log(letter);
+}
+
+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('ES2015', '#sec-array.prototype.values', 'Array.prototype.values')}}{{Spec2('ES2015')}}Initiale Definition.
{{SpecName('ESDraft', '#sec-array.prototype.values', 'Array.prototype.values')}}{{Spec2('ESDraft')}} 
+ +

Browserkompatibilität

+ +
+ + +

{{Compat("javascript.builtins.Array.values")}}

+
+ +

Siehe auch

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