AppDividend
Latest Code Tutorials

Array.from() Function in JavaScript: The Complete Guide

The array.from() method in Javascript creates a new array instance from a given array. If you pass a string to the Array.from() function, then every alphabet of the string is converted to an element of the new array instance. In the case of integer values, a new array instance takes the given Array elements.

Javascript array.from()

The array.from() is a built-in JavaScript function that creates a new, shallow-copied array instance from an array-like object or iterable object. The array.from() method takes an array-like object as an argument and returns the new array instance.

The array.from() lets you develop Arrays from the array-like objects (objects with a length property and indexed items) or iterable objects (objects where you can get its items, such as Map and Set).

The Array from() function was introduced in ECMAScript 2015.

Syntax

The syntax of the Array.from() method is the following.

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

Parameters

arrayLike

It is an array-like object or iterable object to convert to an array.

mapFn: Optional

Map function to call on every element of the array.

thisArg: Optional

Value to use as this when executing mapFn.

Return Value

The from() function returns new  Array instance.

The Array.from(obj, mapFn, thisArg) has a same result as Array.from(obj).map(mapFn, thisArg), except that it does not create the intermediate array.

Let us take a simple example of an array.from() function.

// app.js

let str = 'appdividned';
let strArr = Array.from(str);

console.log(strArr);

Now, run the above file in node.js and see the output.

node app

Javascript Array From Example | Array.from() Tutorial

So, it has created an array based on the string. The letters of the string are split into a single element of an array.

Array from a Set

To create an array from the Set in Javascript, use Array.from() method and pass the Set as an argument, and in return, you will get the Array filled with set values.

Let us create an array from Set.

// app.js

let april = new Set(['avengers', 28]); 
let fab = Array.from(april);

console.log(fab);

Array.from() Tutorial

Creating an array from an array-like object

To create an array from the array-like object in Javascript, use Array.from() method and pass the Set as an argument, and in return, you will get the Array.

Let us see this scenario.

// app.js

function arrFrm(){
    return Array.from(arguments);
}
let arr = arrFrm(1, 2, 3);

console.log(arr);

Javascript Array From Example

Using arrow functions and Array.from

To use the arrow function in from() method, pass the first argument as an iterator and the second as an arrow function to process the item of the iterator one by one and return the Array filled with processed items.

// app.js

let data = Array.from([1, 2, 3], x => x * x);
console.log(data);

So, it will generate an array, and each element is squared from their previous elements.

Array.from() method example

That is it for this function example.

See also

Javascript array reverse()

Javascript array includes()

Javascript array find()

Javascript array findIndex()

Javascript array indexOf()

Leave A Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.