JavaScript метод .from()

Определение и применение

JavaScript метод .from() преобразует и возвращает новый массив из массивоподобного, или итерируемого объекта.

Поддержка браузерами

Метод	Chrome	Firefox	Opera	Safari	IExplorer	Edge
`.from()`	45.0	32.0	32.0	9.0	Нет	Да

JavaScript синтаксис:

// только с указанием  массивоподобного, или итерируемого объекта
var newArray = Array.from( arrayLike );

// с callback функцией
var newArray = Array.from( arrayLike, function( currentValue, index ));

// с использованием объекта, на который может ссылаться ключевое слово this
var newArray = Array.from( arrayLike, function( currentValue, index ),  thisValue );

Версия JavaScript

ECMAScript 2015 (6th Edition)

Значения параметров

Параметр	Описание
arrayLike	Массивоподобный, или итерируемый объект, который преобразуется в массив. Обязательное значение.
function	Функция обратного вызова, которая будет выполнена один раз для каждого элемента в массиве. Функция принимает следующие параметры: *currentValue* - значение текущего элемента *index* - индекс массива текущего элемента. Если в качестве параметра метода передается что-то, что не является объектом функции, то будет вызвано исключение TypeError. Необязательный параметр.
thisValue	Объект, на который может ссылаться ключевое слово this внутри функции обратного вызова. Если параметр thisValue не используется, то в качестве значения this будет использоваться undefined (в конечном счете this будет зависеть от обычных правил контекста выполнения функции). Необязательный параметр.

Параметр

Описание

arrayLike

Массивоподобный, или итерируемый объект, который преобразуется в массив. Обязательное значение.

function

Функция обратного вызова, которая будет выполнена один раз для каждого элемента в массиве. Функция принимает следующие параметры:

currentValue - значение текущего элемента
index - индекс массива текущего элемента.

Если в качестве параметра метода передается что-то, что не является объектом функции, то будет вызвано исключение TypeError. Необязательный параметр.

thisValue

Объект, на который может ссылаться ключевое слово this внутри функции обратного вызова. Если параметр thisValue не используется, то в качестве значения this будет использоваться undefined (в конечном счете this будет зависеть от обычных правил контекста выполнения функции). Необязательный параметр.

Пример использования

В следующем примере мы с помощью метода .from() создадим новый массив из переменной и из строки:

let array = [1, 2, 3]; // инициализируем переменную, содержащую массив
let newArray = Array.from( array ); // инициализируем переменную, содержащую результат преобразования метода .from()
console.log( newArray ); // выводим в консоль значение переменной newArray 
// результат [1, 2, 3]


let newArrayString = Array.from( "string" ); // инициализируем переменную, содержащую результат преобразования метода .from()
console.log( newArrayString ); // выводим в консоль значение переменной newArrayString 
// результат ["s", "t", "r", "i", "n", "g"]

В следующем примере мы рассмотрим использование второго аргумента метода .from(), который позволяет использовать функцию обратного вызова, которая будет выполнена один раз для каждого элемента в массиве:

let array = [1, 2, 3]; // инициализируем переменную, содержащую массив

// используем стрелочную функцию во втором аргументе
let newArray = Array.from( array, ( currentValue, index ) => currentValue * index ); // инициализируем переменную, содержащую результат преобразования метода .from() 

console.log( newArray ); // выводим в консоль значение переменной newArray 
// результат [0, 2, 6]

В следующем примере мы рассмотрим использование третьего аргумента метода .from(), который указывает на объект, на который мы можем ссылаться с использованием ключевого слова this внутри функции обратного вызова:

let numbers = [2, 3, 4]; // инициализируем переменную, содержащую массив числовых значений 
let myObject = { // инициализируем переменную, содержащую объект 
  square: function( currentValue ) { // метод объекта, который принимает значение  
    return currentValue * currentValue; // возвращаем новое значение (текущее значение умноженное на себя) 
  }
};

let squared = Array.from( numbers, function( currentValue ) {
    return this.square( currentValue ); // с помощью ключевого слова this вызываем метод объекта и возвращаем результат его выполнения
}, myObject ); // объект, на который мы можем ссылаться внутри функции (с помощью клюевого слова this) 

console.log( squared ); // выводим значение переменной squared равное [4, 9, 16];

JavaScript Array