Arrays in JavaScript

What is an Array?

The Array is a single variable that stores different elements or data types like Strings, Boolean, Numbers, etc. It is often used when we want to store a list of elements and access them by a single variable. Every value is associated with a numeric index starting with 0. Arrays store values in the way shown below.

An overview of array syntax

Declaring an array can be done in two different ways.

Examples -

var arrayName = [];  // method 1
var arrayName = new Array(); // method 2

The most preferred way to create an array is method 1.

The following are the characteristics of a JavaScript array:

1. It is possible for an array to contain mixed-type values. For example, In an array, you can store elements that are numerical, string, boolean, etc...
2. An array's size is dynamic and auto-growing.we don't need to specify the array size.

Create an array to use method1

var arrayName = ["string", 120, true,0.87]

Array literals are wrapped in square brackets [ ] and have comma-separated elements.

The methods for accessing JavaScript Array Elements.

The first element of an array starts from index-0 and the second element's index-1 and so on...

A Square bracket [ ] specifies the index to access an element in an array.

arrayName[index]

Accessing the elements of the car arrays is shown below:

var car = ["BMW", "Porsche", "Ford", "Ferrari"];

console.log(car[0]); // 'BMW'
console.log(car[2]); // 'Ford'

Changing the value of an element is done by assigning it that value:

var car = ["BMW", "Porsche", "Ford", "Ferrari"];
car[3] = 'Lamborghini';

console.log(car);

Output:

["BMW", "Porsche", "Ford", "Lamborghini"]

The Length property of an Array.

The length property of an array returns the number of elements and the length of an Array is always one more than the highest index of an Array. The below example shows how to use the lengths property.

var car = ["BMW", "Porsche", "Ford", "Ferrari"];
console.log(car.length); //  4

An Overview of array operations.

1. A new element is added to the beginning of an array

To add an element to the beginning of an array, you use the unshift() method:

let car = ["BMW", "Porsche", "Ford", "Ferrari"];
car.unshift('Jeep');

console.log(car);

Output:

['Jeep', "BMW", "Porsche", "Ford", "Ferrari"]

2. A new element is added to the end of an array

To add an element to the end of an array, you use the push() method:

let car = ["BMW", "Porsche", "Ford", "Ferrari"];
car.push('Jeep');

console.log(car);

Output:

["BMW", "Porsche", "Ford", "Ferrari", 'Jeep']

3. Removing an element from the beginning of an array

To remove an element to the beginning of an array, you use the shift() method:

let car = ["BMW", "Porsche", "Ford", "Ferrari"];
const arrayName = car.shift();

console.log(arrayName);

Output:

BMW

4. Removing an element from the end of an array

To remove an element to the end of an array, you use the pop() method:

let car = ["BMW", "Porsche", "Ford", "Ferrari"];
const arrayName = car.pop();

console.log(arrayName);

Output:

Ferrari

5. Finding the index of an array element

To find the index of an element of an array, you use the indexOf() method:

let car = ["BMW", "Porsche", "Ford", "Ferrari"];
const arrayName = car.indexOf("Porsche");

console.log(arrayName); // 1

6. Determine whether a value is an array or not

To check if a value is an array, you use Array.isArray() method:

let car = ["BMW", "Porsche", "Ford", "Ferrari"];

console.log(Array.isArray(car)); // true

💡The most important things to remember

1. The Array is a single variable that stores different elements or multiple values.
2. An array can be created using an array literal or Array constructor syntax.
3. Array literal syntax: var newArray = ["string", 2, true];
4. Array constructor syntax:var newArray = new Array(2);
5. An array index must be numeric.
6. Array elements (values) can be accessed using a zero-based index (key). e.g. array[0].
7. A single array can store values of different data types.
8. The array includes length property and various methods to operate on array objects.

Array Methods Reference