Series Introduction
The JavaScript Array data type currently has 37 methods on it according to the MDN docs and in this series we are going to cover them all one by one explaining each one with examples as we work our way down the list.
If you have any questions regarding anything in this series please get in contact with me by using the methods listed at the bottom of this post.
This is post #3 in this series if you're interested in reading the other posts in this series you will find a complete list with links at the bottom of this post.
Method #3: Array.of()
Array.of() allows for the creation of a new Array instance using the passed in values regardless of how many values there are or what type of data they are. Array.of() will take the passed in values and return a new array containing them.
Creating Arrays
You may be asking why would we need a method like this considering there are multiple other ways of creating an array from data, you could for instance call the Array constructor and pass in the values you want to put in the array like so:
Array('str',3,1) // Array(3) ["str", 3, 1]
Now, this is all good but there is one key difference which separates the Array constructor and the Array.of() method and that is how they handle single integer values being passed.
If you were to pass a single integer to the Array constructor like so:
Array(3)
You would expect it to output:
[3]
But, it doesn't. You see when you pass in a single integer to the Array constructor it will actually return a new array with that many empty slots, not even undefined. Just completely empty.
Here is what the console would show as being returned for the above code:
// Array(3) [<3 empty slots>]
Now if we take the same values and pass it through Array.of() we get a different response:
Array.of(3) // [3]
As you can see we actually get a proper array returned to us with the values we expected to see in it.
This method is definitely one of the more niche ones on the Array data type as there are so many more ways of creating arrays in JavaScript but this a good one to be aware of should you ever come across it.
Examples
Although this is a pretty small method with not many working parts, let's look at some examples to further understand it.
Array.of(1,2,3,4,5); // [1, 2, 3, 4, 5]
Array.of({hello: 1}, 2, 'str', true); // [{…}, 2, "str", true]
Array.of(undefined, null, false, 0); // [undefined, null, false, 0]
So, as you can see from the above examples, you can make anything into an array using this method as long as the values you pass are valid ones. However, if I'm being honest I can't find a reason to use this method over just passing the values into '[]'.
But, I suppose this is the beautiful thing about programming there is always more than one way to achieve our goals. However, if you do know a good use-case for using Array.of() over other ways of creating arrays please let me know over on Twitter.
As always if you have any questions or just want to chat you can find me on any of the methods listed below. I hope you enjoyed this quick post and if you did I would greatly appreciate it if you would consider sharing it so someone else could find it useful.
If you have any questions or just want to chat please get in touch with me over on Twitter @MrConerMurphy.
Top comments (0)