initial commit

1 files changed, 227 insertions, 0 deletions

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
+---
+<div>{{JSRef}}</div>
+
+<p>Die <code><strong>Array.from()</strong></code> Methode erstellt eine neue, oberflächlich kopierte Array Instanz von einem Array-ähnlichen oder iterierbaren Objekt.</p>
+
+<div>{{EmbedInteractiveExample("pages/js/array-from.html")}}</div>
+
+
+
+<h2 id="Parameters" name="Parameters">Syntax</h2>
+
+<pre>Array.from(arrayLike[, mapFn[, thisArg]])</pre>
+
+<h3 id="Parameters" name="Parameters"><span>Parameter</span></h3>
+
+<dl>
+ <dt><code>arrayLike</code></dt>
+ <dd>Ein Array-ähnliches oder iterierbares Objekt, welches zu einem Array konvertiert wird.</dd>
+ <dt><code>mapFn</code>{{Optional_inline}}</dt>
+ <dd>Map Funktion, welche auf jedes Element des Arrays angewendet wird.</dd>
+ <dt><code>thisArg</code>{{Optional_inline}}</dt>
+ <dd>Wert, welcher als <code>this</code> beim Ausführen von <code>mapFn</code> genutzt wird.</dd>
+</dl>
+
+<h3 id="Rückgabewert">Rückgabewert</h3>
+
+<p>Eine neue {{jsxref("Array")}} Instanz.</p>
+
+<h2 id="Description" name="Description">Beschreibung</h2>
+
+<p><code><strong>Array.from()</strong></code> erstellt ein Array aus:</p>
+
+<ul>
+ <li>Array-ähnliche Objekte (Objekte mit einer <code>length</code> Eigenschaft und indexierten Elementen) oder</li>
+ <li><a href="/de/docs/Web/JavaScript/Guide/iterable">Iterierbare Objekte</a> (Objekte welche Elemente zurückgeben können, wie zum Beispiel {{jsxref("Map")}} und {{jsxref("Set")}}).</li>
+</ul>
+
+<p><strong>Array.from() </strong>hat einen optionalen Parameter <code>mapFn</code>, 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 <code>Array.from(obj, mapFn, thisArg)</code> dasselbe wie <code>Array.from(obj).map(mapFn, thisArg)</code>, mit dem Unterschied, dass kein Array als Zwischenergebnis produziert wird. Das ist besonders wichtig für Array Subklassen, wie <a href="/de/docs/Web/JavaScript/Typed_arrays">typed Arrays</a>. Das Array des Zwischenergebnisses<br>
+ würde sonst Werte kürzen, um dem zutreffenden Typ zu entsprechen.</p>
+
+<p>Die <code>length</code> Eigenschaft der <code>from()</code> Methode ist 1.</p>
+
+<p>In ES2015 erlaubt die class Syntax, Subklassen für eingebaute und benutzerdefinierte Klassen. Klassenseitige statische Methoden wie <code>Array.from()</code><strong> </strong>sind von der Subklasse <code>Array</code> vererbt und erzeugen eine neue Instanz der Subklasse und nicht von <code>Array</code>.</p>
+
+<h2 id="Beispiele">Beispiele</h2>
+
+<h3 id="Array_von_einem_String">Array von einem <code>String</code></h3>
+
+<pre class="brush: js">Array.from('foo');
+// ["f", "o", "o"];</pre>
+
+<h3 id="Array_von_einem_Set">Array von einem <code>Set</code></h3>
+
+<pre class="brush: js">var s = new Set(["foo", window]);
+Array.from(s);
+// ["foo", window]</pre>
+
+<h3 id="Array_von_einem_Map">Array von einem <code>Map</code></h3>
+
+<pre class="brush: js">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'];</pre>
+
+<h3 id="Array_von_einem_Array_ähnlichen_Objekt_(arguments)">Array von einem Array ähnlichen Objekt (<code>arguments</code>)</h3>
+
+<pre class="brush: js">function f() {
+  return Array.from(arguments);
+}
+
+f(1, 2, 3);
+
+// [1, 2, 3]</pre>
+
+<h3 id="Einsatz_von_Arrow-Funktionen_und_Array.from">Einsatz von Arrow-Funktionen und <code>Array.from</code></h3>
+
+<pre class="brush: js">// Using an arrow function as the map function to
+// manipulate the elements
+Array.from([1, 2, 3], x =&gt; 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) =&gt; i);
+// [0, 1, 2, 3, 4]
+</pre>
+
+<h2 id="Polyfill">Polyfill</h2>
+
+<p><code>Array.from()</code> 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 <code>Array.from()</code><strong> </strong>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 <code>callback.call</code> 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.</p>
+
+<pre class="brush: js">// 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 &gt; 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 &gt; 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 &gt; 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 &lt; len… (also steps a - h)
+      var kValue;
+      while (k &lt; 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;
+    };
+  }());
+}
+</pre>
+
+<h2 id="Spezifikationen">Spezifikationen</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Spezifikation</th>
+   <th scope="col">Status</th>
+   <th scope="col">Kommentar</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ES2015', '#sec-array.from', 'Array.from')}}</td>
+   <td>{{Spec2('ES2015')}}</td>
+   <td>Initiale Definition.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-array.from', 'Array.from')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td> </td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browserkompatibilität">Browserkompatibilität</h2>
+
+<div>
+
+
+<p>{{Compat("javascript.builtins.Array.from")}}</p>
+</div>
+
+<h2 id="See_also" name="See_also">Siehe auch</h2>
+
+<ul>
+ <li>{{jsxref("Array")}}</li>
+ <li>{{jsxref("Array.prototype.map()")}}</li>
+ <li>{{jsxref("TypedArray.from()")}}</li>
+</ul>