Visual Explanation: JavaScript Array.from()

Max N
2 min readOct 25, 2019

--

Today we will be looking at a method from the Array object and that will be the Array.from() method. The Array.from() creates a new, shallow-copied Array instance from an array-like or iterable object.

One example of the Array.from() is:

console.log(Array.from(‘foo’));
// expected output: Array [“f”, “o”, “o”]

Here is a visual on how the Array.from() method works for strings. Here we have a string called “foo”:

Think of the string “foo” as being in a railroad car. While the string is not an array, that railroad car holds one string. The train drives the string into the .from method (the left half of the image).

And then after coming out of the .from method, the individual characters in the “foo” string are placed into their own railroad cars. Altogether the train acts as an array. Each railroad car carries a character.

There are other things Array.from() method can iterate from like a Map, Set, or an Object but in its simplest case, this is what it can do for a string.

--

--

Max N
Max N

Written by Max N

A writer that writes about JavaScript and Python to beginners. If you find my articles helpful, feel free to follow.

No responses yet