Like any other object-oriented programming language, javascript provides many features and objects for your software development. In javascript, nearly everything is an object, and they all come with their own set of powerful benefits. For example, one of the most commonly used objects in a javascript is called an array.

Let’s get started.

What is a javascript array?

Javascript arrays are data collections, which are types of objects, but they should be thought of as displays instead. The reason for this distinction is that javascript also provides a data collection type called objects that have a different syntax.

Const letters = ['a', 'b', 'c'];

Here, letters is an array. The array is storing 3 values.

let’s look at the syntax of a javascript array:

1. How to create an array?

You can create an array using two ways:

i. Using an array literal : the easiest way to create an array is by using an array literal []. For example

Const array1 = ['java', 'python'];

ii. Using the new keyword : you can also create an array using javascript's new keyword.

Const array2 = new array('java', 'python');

In both of the above examples, we have created an array having two elements.

note: it is recommended to use array literal[] to create an array.

2.Access elements of an array

You can access elements of an array using indices (0, 1, 2 …). For example

Const array1 = ['java', 'python', 'a', 'b', 'c'];

// first element
Console.log(array1[0]);  // "java"

// second element
Console.log(array1[1]); // "python"

note: array's index starts with 0, not 1.

3. Add an element to an array

You can use the built-in method push() and unshift() to add elements to an array.

The push() method adds an element at the end of the array. For example,

Let subjects = ['java', 'python'];

// add an element at the end
Subjects.push('statistics');

Console.log(subjects); //  [java', 'python', 'statistics']

The unshift() method adds an element at the beginning of the array. For example,

Let subjects = ['java', 'python'];

//add an element at the start
Subjects.unshift('c#'); 

Console.log(subjects); // ['c#', 'java', 'python']

4. Change the elements of an array

You can also add elements or change the elements by accessing the index value.

Let subjects = ['java', 'python'];

// this will add the new element 'c#' at the 2 index
Subjects[2] = 'c#';

Console.log(subjects); // ['java', 'python', 'c#']

Suppose, an array has two elements. If you try to add an element at index 3 (fourth element), the third element will be undefined. For example,

Let subjects = [ 'java', 'python'];

// this will add the new element 'c#' at the 3 index
Subjects[3] = 'c#';

Console.log(subjects); // ['java', 'python', undefined, "c#"]

Basically, if you try to add elements to high indices, the indices in between will have undefined value.

5. Remove an element from an array

You can use the pop() method to remove the last element from an array. The pop() method also returns the returned value. For example,

Let subjects = ['c#', 'java', 'python', 'exercise'];

// remove the last element
Subjects.pop();
Console.log(subjects); // ['c#', 'java', 'python']

// remove the last element from ['c#', 'java', 'python']
Const removedelement = subjects.pop();

//get removed element
Console.log(removedelement); // 'python'
Console.log(subjects);  // ['c#', 'java']

If you need to remove the first element, you can use the shift() method. The shift() method removes the first element and also returns the removed element. For example,

Let subjects = ['c#', 'java', 'python'];

// remove the first element
Subjects.shift();

Console.log(subjects); // ['java', 'python']

6. Array length

You can find the length of an element (the number of elements in an array) using the length property. For example,

Const subjects = [ 'java', 'python'];

// this gives the total number of elements in an array
Console.log(subjects.length); // 2

We have learned a lot about javascript arrays, how they work and how to use them in your programming. We have also learned the syntax of the javascript array and seen examples of arrays. 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.

Happy learning!!!