JavaScript Array
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