Hello everyone, glad to have you here. Today’s discussion will be on “introduction to Javascript arrays”. The aim of this article is to simply brief readers on what Javascript arrays are, how they are defined, displayed, and in most cases when a developer should implement them.

What are arrays?

Arrays sometimes referred to as data structures or relatively a special variable in my understanding, are unique structures defined to store elements of the same datatype in a continuous and adjacent memory location. In some articles, Javascript arrays are described as a special type of object and some refer to it as a "linear data structure". I know you might be asking, what is an object? What is a data structure? But that is not the aim of the topic today. With the above definition, you can imagine an array as a box having different partitions with items placed inside those partitions. Below, a diagrammatic view would be demonstrated.

Above we see a box having 6 partitions with items in them, this my friend is a picture one can imagine an array to be like.

Why they are used?

Most Javascript beginners used to basic variable declaration begin to ask questions such as; Why use an array? Why can't I just create a variable and assign values to them? Well in this section we will discuss its usage and importance. Given you have a list of student names you'll like to pass into your code, a new beginner would most likely create a variable and assign values to each of them.

const student1 = "Ivan"
const student2 = "Rapheal"
const student3 = "Augustine"

With this style of implementation, memory is being consumed more and in some suggestions, this is not a "good coding technique". Now with the implementation of an array, these elements can reserve memory, and provide easier access, and easier implementation.

How arrays are created?

An array can be created in three formats namely:

• The basic syntax
• Definition of the array and then assigning elements later in code
• And then, Create the array using the new keyword. In this article, the three formats will be demonstrated.

Basic Syntax

The basic syntax in creating a Javascript array is a simple format whereby the array is declared and in the braces, the items are passed. Below is a demonstration

const array_name = [, element1, ...];

In describing the code above, "const" is described as constant (meaning the variable cannot be reassigned), while "array_name" is the unique name you give your array. Then inside the braces, we have the elements you decide to store in the array. Using the previous example, I'll be creating an array to store 3 student names.

const students = ["Ivan", "Austin", "Rapheal"];

Defining and passing the elements after

This is achieved by declaring the array at first, then thereafter below your code you call the name of the array and then assign the elements. Code snippet below

const students = [];
students[0]= "rapheal";
students[1]= "augustine";
students[2]= "ivan";

Above, we have an array called "students" but then at first not assigned elements. Proceeding, we have the array name being called with the element index in braces and then passing of elements being assigned to each index. You probably would be wondering what an index is? But later in this article, this will be discussed.

Using the new keyword

In achieving the same goal as the others, this style can also be implemented. But for simplicity, readability, and execution speed, the basic format would be advice being used.

const students = new Array("ivan", "daniel", "rapheal");

**Please note--->** the same rules used in naming variables are also used in naming an array.

How are they accessed?

In Javascript, an array can be accessed by the user trying to get an element from the array, or by displaying the full array. In this section, more insight shall be provided on both ways an array can be accessed.

Accessing the array element

Given a user just wants to access a single element, the array can be accessed based on the call of the index. You probably would be wondering what an array index is, and in this manner, I shall describe the term. During array initialization, it is safe to assume each element has an index Why? Because then how can I locate an element in need? This is where the index comes in. The index serves as the location of that element in search whereby, the format is ordered numerically starting from 0. This numerical order identify the positions of these elements whereby the first element is counted as 0 and the next element as 1. Let's say an array consists of 3 elements, the first element would be indexed at 0, the second at 1, and then the last at 2. Below we can see a demonstration explaining in better terms.

Question! What if your array is so large, that you can't count the indexes of each element manually? How can you identify the index of an element you would like to access? Good, that is when a loop is implemented in order to count the indexes. Not to worry if you do not have an idea about loops you can check other articles or research about how loops work and how they can be used with arrays.

Displaying the Full array

Now let's assume a user trying to display all array elements without looping. How can this be achieved? This is done by simply calling the array name. Below is a demonstration whereby the array is defined and called to display the list of students in an HTML component.

const students = ["Ivan", "Daniel", "Rapheal"];
document.getElementById("demo").innerHTML = cars;

When should JavaScript Arrays be Implemented?

Most Javascript beginners find it challenging when to implement such a structure, given because of the frequent implememtation of local variables. It is suggested that one implements such a structure when a list of items (of the same data) needs to undergo a basic store and return process.

In summary, arrays are variables set to hold a specified number of items (of the same type), which may later be used to return data when needed. With this article, I hope I can deliver an easier introduction to Javascript arrays.

Thank you and do comment on your thoughts.