From 218934fa2ed1c702a6d3923d2aa2cc6b43c48684 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:43:23 -0500 Subject: initial commit --- .../reference/global_objects/array/from/index.html | 242 +++++++++++++++++++++ 1 file changed, 242 insertions(+) create mode 100644 files/uk/web/javascript/reference/global_objects/array/from/index.html (limited to 'files/uk/web/javascript/reference/global_objects/array/from') diff --git a/files/uk/web/javascript/reference/global_objects/array/from/index.html b/files/uk/web/javascript/reference/global_objects/array/from/index.html new file mode 100644 index 0000000000..7cfb6325b8 --- /dev/null +++ b/files/uk/web/javascript/reference/global_objects/array/from/index.html @@ -0,0 +1,242 @@ +--- +title: Array.from() +slug: Web/JavaScript/Reference/Global_Objects/Array/from +tags: + - Array + - ECMAScript6 + - Масив +translation_of: Web/JavaScript/Reference/Global_Objects/Array/from +--- +
{{JSRef}}
+ +

Метод Array.from() створює новий екземпляр Array (дрібну копію) з подібного до масиву або ітерабельного об'єкта.

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

Синтаксис

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

Параметри

+ +
+
arrayLike
+
Подібний до масиву або ітерабельний об'єкт, який треба перетворити на масив.
+
mapFn {{Optional_inline}}
+
Функція Map для виклику на кожному елементі масиву.
+
thisArg {{Optional_inline}}
+
Значення this для функції mapFn.
+
+ +

Значення, яке повертається

+ +

Новий екземпляр {{jsxref("Array")}}.

+ +

Опис

+ +

Array.from() дозволяє створювати масиви з:

+ + + +

Array.from() має необов'язковий параметр mapFn, який дозволяє виконати функцію {{jsxref("Array.prototype.map", "map")}} на кожному елементі масиву (або об'єкта підкласу), який створюється. Іншими словами, Array.from(obj, mapFn, thisArg) має той самий результат, що й Array.from(obj).map(mapFn, thisArg), тільки він не створює проміжний масив. Це особливо важливо для певних підкласів масивів, таких як типізовані масиви, оскільки проміжний масив обов'язково урізав би значення для перетворення у відповідний тип.

+ +

Властивість length методу from() дорівнює 1.

+ +

У ES2015, синтаксис класів дозволяє створення підкласів як для вбудованих класів, так і для тих, що створені користувачем; в результаті статичні методи, такі як Array.from "успадковуються" підкласами класу Array і створюють нові екземпляри підкласу, а не класу Array.

+ +

Приклади

+ +

Масив з рядка

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

Масив з об'єкта Set

+ +
const set = new Set(['foo', 'bar', 'baz', 'foo']);
+Array.from(set);
+// [ "foo", "bar", "baz" ]
+ +

Масив з об'єкта Map

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

Масив з подібного до масиву об'єкта (arguments)

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

Використання стрілкових функцій та Array.from()

+ +
// Використання стрілкової функції в якості функції map
+// для маніпулювання елементами
+Array.from([1, 2, 3], x => x + x);
+// [2, 4, 6]
+
+
+// Генерування послідовності чисел
+// Оскільки масив ініціалізується значенням `undefined` на кожній позиції,
+// значення `v` нижче дорівнюватиме `undefined`
+Array.from({length: 5}, (v, i) => i);
+// [0, 1, 2, 3, 4]
+
+ +

Генератор послідовності (range)

+ +
// Функція генератора послідовності (зазвичай відома як "range", напр. у Clojure, PHP та ін.)
+const range = (start, stop, step) => Array.from({ length: (stop - start) / step + 1}, (_, i) => start + (i * step));
+
+// Згенерувати числа у діапазоні 0..4
+range(0, 4, 1);
+// [0, 1, 2, 3, 4]
+
+// Згенерувати числа у діапазоні 1..10 з кроком 2
+range(1, 10, 2);
+// [1, 3, 5, 7, 9]
+
+// Згенерувати алфавіт з допомогою Array.from, користуючись тим, що він впорядкований як послідовність
+range('A'.charCodeAt(0), 'Z'.charCodeAt(0), 1).map(x => String.fromCharCode(x));
+// ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"]
+
+ +

Поліфіл

+ +

Метод Array.from був доданий до стандарту ECMA-262 у 6-й версії (ES2015); таким чином, він може не існувати у інших реалізаціях стандарту. Ви можете обійти цю проблему, вставивши наступний код на початку ваших скриптів, що дозволить використовувати метод Array.from у реалізаціях, які не мають його вбудованої підтримки. Цей алгоритм саме той, що визначений у ECMA-262, у 6-й версії, за умови, що Object та TypeError мають свої первинні значення і callback.call дорівнює первинному значенню {{jsxref("Function.prototype.call")}}. На додаток, оскільки справжні ітерабельні об'єкти не можуть мати поліфілу, ця реалізація не підтримує загальні ітерабельні об'єкти, визначені у 6-й версії ECMA-262.

+ +
// Функціональні кроки ECMA-262, версія 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);
+    };
+
+    // Властивість length метода from дорівнює 1.
+    return function from(arrayLike/*, mapFn, thisArg */) {
+      // 1. Нехай C дорівнює значенню this.
+      var C = this;
+
+      // 2. Нехай items дорівнює 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. Якщо mapfn дорівнює undefined, тоді нехай mapping дорівнює false.
+      var mapFn = arguments.length > 1 ? arguments[1] : void undefined;
+      var T;
+      if (typeof mapFn !== 'undefined') {
+        // 5. інакше
+        // 5. а Якщо IsCallable(mapfn) дорівнює false, викинути виняток TypeError.
+        if (!isCallable(mapFn)) {
+          throw new TypeError('Array.from: when provided, the second argument must be a function');
+        }
+
+        // 5. б. Якщо надано thisArg, нехай T дорівнює thisArg; інакше нехай T дорівнює undefined.
+        if (arguments.length > 2) {
+          T = arguments[2];
+        }
+      }
+
+      // 10. Нехай lenValue дорівнює Get(items, "length").
+      // 11. Нехай len дорівнює ToLength(lenValue).
+      var len = toLength(items.length);
+
+      // 13. Якщо IsConstructor(C) дорівнює true, тоді
+      // 13. а. Нехай A дорівнює результату виклику внутрішнього метода С [[Construct]]
+      // зі списком аргументів, що містить єдиний елемент len.
+      // 14. a. Інакше, нехай A дорівнює ArrayCreate(len).
+      var A = isCallable(C) ? Object(new C(len)) : new Array(len);
+
+      // 16. Нехай k дорівнює 0.
+      var k = 0;
+      // 17. Повторювати, доки k < len… (також кроки 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. Нехай putStatus дорівнює Put(A, "length", len, true).
+      A.length = len;
+      // 20. Повернути A.
+      return A;
+    };
+  }());
+}
+
+ +

Специфікації

+ + + + + + + + + + + + + + + + + + + + + +
СпецифікаціяСтатусКоментар
{{SpecName('ESDraft', '#sec-array.from', 'Array.from')}}{{Spec2('ESDraft')}}
{{SpecName('ES2015', '#sec-array.from', 'Array.from')}}{{Spec2('ES2015')}}Початкове визначення.
+ +

Сумісність з веб-переглядачами

+ + + +

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

+ +

Див. також

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