path: root/files/tr/web/javascript/reference/global_objects/array/from/index.html

---
title: Array.from()
slug: Web/JavaScript/Reference/Global_Objects/Array/from
translation_of: Web/JavaScript/Reference/Global_Objects/Array/from
---
<div>{{JSRef}}</div>

<p><code><strong>Array.from()</strong></code> metodu bir dizi-benzeri veya gezinilebilir bir nesneden yeni bir Dizi örneği oluşturur.</p>

<pre class="brush: js">Array.from("birşey");
// ["b", "i", "r", "ş", "e", "y"]</pre>

<h2 id="Söz_dizimi">Söz dizimi</h2>

<pre class="syntaxbox">Array.from(arrayLike[, mapFn[, thisArg]])
</pre>

<h3 id="Parametreler">Parametreler</h3>

<dl>
 <dt><code>arrayLike</code></dt>
 <dd>Diziye çevrilecek olan dizi-benzeri ya da gezinilebilir nesnedir.</dd>
 <dt><code>mapFn</code></dt>
 <dd>İsteğe bağlı. Map fonksiyonu tüm dizi öğeleri için çağrılır.</dd>
 <dt><code>thisArg</code></dt>
 <dd>İsteğe bağlı. <code>mapFn fonksiyonu işletilirken kullanılacak olan this argüman değeridir.</code></dd>
</dl>

<h3 id="Dönüş_değeri">Dönüş değeri</h3>

<p>Yeni bir {{jsxref("Array")}} örneği.</p>

<h2 id="Açıklama">Açıklama</h2>

<p><code>Array.from(),</code> aşağıdaki yapılardan <code>Diziler</code> oluşturmanıza izin verir:</p>

<ul>
 <li>dizi-benzeri nesneler (sıralı öğeler ve bir uzunluk(<code>length</code>) özelliği olan nesneler) ya da</li>
 <li><a href="/en-US/docs/Web/JavaScript/Guide/iterable">gezinilebilir nesneler</a> (öğelerini alabildiğiniz nesneler, {{jsxref("Map")}} ve {{jsxref("Set")}} gibi).</li>
</ul>

<p><code>Array.from()</code> has an optional parameter <code>mapFn</code>, which allows you to execute a {{jsxref("Array.prototype.map", "map")}} function on each element of the array (or subclass object) that is being created. More clearly,<code> Array.from(obj, mapFn, thisArg)</code> has the same result as <code>Array.from(obj).map(mapFn, thisArg)</code>, except that it does not create an intermediate array. This is especially important for certain array subclasses, like <a href="/en-US/docs/Web/JavaScript/Typed_arrays">typed arrays</a>, since the intermediate array would necessarily have values truncated to fit into the appropriate type.</p>

<p>The <code>length</code> property of the <code>from()</code> method is 1.</p>

<p>In ES2015, the class syntax allows for sub-classing of both built-in and user defined classes; as a result, static methods such as <code>Array.from</code> are "inherited" by subclasses of <code>Array</code> and create new instances of the subclass, not <code>Array</code>.</p>

<h2 id="Örnekler">Örnekler</h2>

<h3 id="Bir_metinden_Dizi_oluşturma">Bir metinden Dizi oluşturma</h3>

<pre class="brush: js">Array.from("birşey");
// ["b", "i", "r", "ş", "e", "y"]</pre>

<h3 id="Bir_Set_nesnesinden_Dizi_oluşturma">Bir <code>Set nesnesinden Dizi oluşturma</code></h3>

<pre class="brush: js">var s = new Set(["birşey", window]);
Array.from(s);
// ["birşey", window]</pre>

<h3 id="Bir_Map_nesnesinden_Dizi_oluşturma">Bir <code>Map nesnesinden Dizi oluşturma</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]]</pre>

<h3 id="Bir_dizi-benzeri_nesneden_dizi_oluşturma_(argümanlar)">Bir dizi-benzeri nesneden dizi oluşturma (argümanlar)</h3>

<pre class="brush: js">function f() {
  return Array.from(arguments);
}

f(1, 2, 3);

// [1, 2, 3]</pre>

<h3 id="Ok_işlevleri_ve_Array.from_kullanma">Ok işlevleri ve <code>Array.from kullanma</code></h3>

<pre class="brush: js">// Bir işlevini, map işlevi olarak kullanıp
// öğeler üzerinde oynama yapmak
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> was added to the ECMA-262 standard in the 6th edition (ES2015); as such it may not be present in other implementations of the standard. You can work around this by inserting the following code at the beginning of your scripts, allowing use of <code>Array.from</code> in implementations that don't natively support it.  This algorithm is exactly the one specified in ECMA-262, 6th edition, assuming <code>Object</code> and <code>TypeError</code> have their original values and that <code>callback.call</code> evaluates to the original value of {{jsxref("Function.prototype.call")}}. In addition, since true iterables can not be polyfilled, this implementation does not support generic iterables as defined in the 6th edition of 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="Specifications">Specifications</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
  <tr>
   <td>{{SpecName('ES6', '#sec-array.from', 'Array.from')}}</td>
   <td>{{Spec2('ES6')}}</td>
   <td>Initial definition.</td>
  </tr>
  <tr>
   <td>{{SpecName('ESDraft', '#sec-array.from', 'Array.from')}}</td>
   <td>{{Spec2('ESDraft')}}</td>
   <td></td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility">Browser compatibility</h2>

<div>{{CompatibilityTable}}</div>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Edge</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatChrome("45")}}</td>
   <td>{{CompatGeckoDesktop("32")}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>9.0</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Chrome for Android</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatGeckoMobile("32")}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
  </tr>
 </tbody>
</table>
</div>

<h2 id="See_also">See also</h2>

<ul>
 <li>{{jsxref("Array")}}</li>
 <li>{{jsxref("Array.prototype.map()")}}</li>
 <li>{{jsxref("TypedArray.from()")}}</li>
</ul>