Skip to main content

Command Palette

Search for a command to run...

JavaScript Array

Updated
3 min read

What is an Array?

An Array is a special variable that can store multiple values together.

When we have only one value, we usually store it in a variable like this:

let data = "newData";

But when we have multiple values and want to store them together, we use an Array.

Example:

const arr = ["dataOne", "dataTwo", "dataThree"];

With an array, we can store many values together and access them whenever we need.

Array Indexing

Arrays use Zero-Based Indexing, which means counting starts from 0, not 1.

Example:

const arr = ["dataOne", "dataTwo", "dataThree"];
Index Value
0 dataOne
1 dataTwo
2 dataThree

If we want to access the second value:

console.log(arr[1]);

Output:

dataTwo

Array Methods

1. push() Method

The push() method is used to add a new element at the end of an array.

Example:

const animals = ["pigs", "goats", "sheep"];

const count = animals.push("cows");

console.log(count);

Output:

4
console.log(animals);

Output:

["pigs", "goats", "sheep", "cows"]

2. pop() Method

The pop() method is used to remove the last element from an array.

Example:

const plants = ["broccoli", "cauliflower", "cabbage", "kale", "tomato"];

console.log(plants.pop());

Output:

tomato
console.log(plants);

Output:

["broccoli", "cauliflower", "cabbage", "kale"]

If we call pop() again:

plants.pop();
console.log(plants);

Output:

["broccoli", "cauliflower", "cabbage"]

3. shift() Method

The shift() method removes the first element from an array.

It returns the removed element and the array length decreases.

Example:

const numbers = [1, 2, 3];

console.log(numbers.shift());

Output:

1
console.log(numbers);

Output:

[2,3]

4. unshift() Method

The unshift() method adds new elements to the beginning of an array and returns the new array length.

Example:

const array = [1, 2, 3];

console.log(array.unshift(4, 5));

Output:

5
console.log(array);

Output:

[4, 5, 1, 2, 3]

Some Most Popular Array Methods

Some of the most commonly used array methods are:

  • map()

  • filter()

  • forEach()

  • reduce()

map()

The map() method is used to perform an operation on each element of an array and create a new array.

Example:

const numbers = [1, 2, 3, 4];

const result = numbers.map((num) => num * 2);

console.log(result);

Output:

[2,4,6,8]

Here each number is multiplied by 2, and a new array is created.

filter()

The filter() method is used to select elements from an array based on a condition.

Example:

const numbers = [1, 2, 3, 4, 5];

const result = numbers.filter((num) => num > 3);

console.log(result);

Output:

[4,5]

Here only numbers greater than 3 are returned.

forEach()

The forEach() method is used to loop through each element of an array.

It does not return a new array.

Example:

const numbers = [1,2,3];

numbers.forEach((num)=>{
 console.log(num)
});

Output:

1
2
3

reduce()

The reduce() method is used to combine all elements of an array into a single value.

Example:

const numbers = [1,2,3,4];

const sum = numbers.reduce((total,num)=>{
 return total + num;
},0);

console.log(sum);

Output:

10