Let’s get started.
This question has an answer that truthfully is a little ambiguous. The standard is to decide based on your needs and consider staying consistent with your declaration style. With that in mind, let’s look at the syntax for the various ways you can declare an array.
const array name = new Array(item1, item2, …);
In most cases, developers use this method to create a new array when the array's values are known. A great example of this would be using this method to create new instances of players in a game. A developer could provide this constructor with a variable with all players' entered data.
Empty Array Initialization
const array name = [ ];
That’s right; it is essentially an array literal but without added items. Armed with this information, let’s look at what array items are and what types of items are allowed.
Array items — also known as array elements — are nothing more than the items stored inside an array. The items within an array are often of various types, and as a result, they can be used for robust sets of data within complex structures.
Now that you know the types of data that arrays can support let’s dive into how to access and manipulate that data. Then you will see some examples of using arrays for the hypothetical browser game.
Accessing Array Items
To access an array element, you will need to use the bracket notation to target the index of the array element you want. This practice is straightforward but comes with the caveat that the array index starts at zero and not one.
const player = [“Artemis”, 35, “5’11”, “06:23:00”]
This line of code creates an array literal with four values, then targets the first item in the array, which is the name Artemis.
If the array has ten items, the length array will return that value. However, the maximum array index would be one less than that. So if you were to loop through the array till its end using the length() method, you would also need to subtract one from the value returned by the method.
The array sort() method is used to sort the items in an array. For example, if the array is all numbers — weather strings or integers — the sort method will organize them according to their numerical values.
The Mozilla Developer page says, “The default sort order is ascending, built upon converting the elements into strings, then comparing their sequences of UTF-16 code units values. ”Using the sort() method can be unpredictable if done incorrectly. But on the whole, it still provides a simple way to handle basic sorting techniques.
Next, you will see a codepen example of how arrays can be created, interacted with, and even modified. In that same codepen, you will also see an example of array looping using the length method. This codepen is also interactive, allowing you to play around with the code and get a little more familiar with the subject of arrays.
You have even had a chance to play around with a live code example covering the topics in this post. Moving forward, you can build on this information by practicing different uses for arrays, and different ways to manipulate, edit, and even display array information in the browser.