DEV Community

Cover image for Array.from VS Array.prototype.map
Ashik Patel
Ashik Patel

Posted on

1

Array.from VS Array.prototype.map

Hello there,

let's discuss these 2 amazing methods or functions in a proper context and get to know each of them.

Array.From(arrayLike) is a static method which can be used to create an array from any sort of array-like non-array object in order to perform any available instance method of Array.prototype. Not clear yet ? stick with me I will try to make it clear.

Array.prototype.map is a instance method which also works similar to the Array.from but it is only working with instance of the Array.

Consider the following examples.

Image description

Output:

Image description

Here you can see, the output is same but the internal working is a bit different.

From the above example we cannot use Array.from as instance method on any array. Same goes for map, we cannot perform map method on Array class itself.

i.e

Image description

When we consider map, it will work only on instance of an Array.

i.e

Image description

so now is it possible to create a whole new array with the Array.from ? Yes you can do the above with the following code.

Image description

Important

*Now since you're able to create a whole new array with the use of Array.from method, you can perform all the other Array.prototype methods such as sort,push,append,pop and etc with newly create an array. *

Array.from is really helpful when you are working with very large and complex project. it helps to prevent any breakdown while dealing with array methods when sometimes your incoming data or response looks like array but it is non-array object. In this case one can always double check and create an actual Array to perform other useful array methods.

P.S Scenario is based on my own working project.

Thanks

SurveyJS custom survey software

Simplify data collection in your JS app with a fully integrated form management platform. Includes support for custom question types, skip logic, integrated CCS editor, PDF export, real-time analytics & more. Integrates with any backend system, giving you full control over your data and no user limits.

Learn more

Top comments (0)

Image of Docusign

🛠️ Bring your solution into Docusign. Reach over 1.6M customers.

Docusign is now extensible. Overcome challenges with disconnected products and inaccessible data by bringing your solutions into Docusign and publishing to 1.6M customers in the App Center.

Learn more