JavaScript Array Methods

➡️ JavaScript Array:

In JavaScript, an array is considered an object. It allows for storing multiple values in a single variable. By definition, a Js array is a collection of the same type of data. However, a Javascript array is considered a sequence of values. The data type of these values may be of different types.

Js array is a consecutive group of memory locations with the same name. The memory locations in an array are referred to as elements of the array. The total number of elements in the array is called the size of the array (or its length). Each location or element in the array is accessed by specifying the name of the array and the position number of the particular element in the array. This position number is called the index.

Note: In JavaScript, the index is written within square brackets ([ ]) with the name of the array.

var arr = [1, 2, 3, 4];

JavaScript Array length

The length property returns or sets the number of elements in an array.

let fruit = ["mango", "apple", "banana", "papaya"];

// find the length of the fruit array
let len = fruit.length;
console.log(len);

// Output: 4

JavaScript Array reverse()

The reverse() method returns the array in reverse order.

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

// reversing the numbers array
let reversedArray = numbers.reverse();

console.log(reversedArray);

// Output: [ 5, 4, 3, 2, 1 ]

JavaScript Array sort()

The sort() method sorts the items of an array in a specific order (ascending or descending).

let city = ["California", "Barcelona", "Paris", "Kathmandu"];

// sort the city array in ascending order
let sortedArray = city.sort();
console.log(sortedArray);

// Output: [ 'Barcelona', 'California', 'Kathmandu', 'Paris' ]

Javascript Array join()

The join() method returns a new string by concatenating all of the elements in an array, separated by a specified separator.

let message = ["JavaScript", "is", "fun."];

// join all elements of array using space
let joinedMessage = message.join(" ");
console.log(joinedMessage);

// Output: JavaScript is fun.

JavaScript Array pop()

The pop() method removes the last element from an array and returns that element.

let cities = ["Madrid", "New York", "Kathmandu", "Paris"];

// remove the last element
let removedCity = cities.pop();

console.log(cities)         // ["Madrid", "New York", "Kathmandu"]
console.log(removedCity);   // Paris

JavaScript Array push()

The push() method adds zero or more elements to the end of the array.

let city = ["New York", "Madrid", "Kathmandu"];

// add "London" to the array
city.push("London");

console.log(city);

// Output: [ 'New York', 'Madrid', 'Kathmandu', 'London' ]

JavaScript Array shift()

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

let languages = ["English", "Java", "Python", "JavaScript"];

// removes the first element of the array
let first = languages.shift();
console.log(first);
console.log(languages);

// Output: English
//         [ 'Java', 'Python', 'JavaScript' ]

JavaScript Array unshift()

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

let languages = ["Java", "Python", "C"];

// add "JavaScript" at the beginning of the array
languages.unshift("JavaScript");
console.log(languages);

// Output: [ 'JavaScript', 'Java', 'Python', 'C' ]

JavaScript Array concat()

The concat() method returns a new array by merging two or more values/arrays.

let primeNumbers = [2, 3, 5, 7]
let evenNumbers = [2, 4, 6, 8]

// join two arrays 
let joinedArrays = primeNumbers.concat(evenNumbers);
console.log(joinedArrays);

/* Output:
[
  2, 3, 5, 7,
  2, 4, 6, 8 
]
*/

JavaScript Array splice()

The splice() method returns an array by changing (adding/removing) its elements in place.

let prime_numbers = [2, 3, 5, 7, 9, 11];

// replace 1 element from index 4 by 13
let removedElement = prime_numbers.splice(4, 1, 13);
console.log(removedElement);
console.log(prime_numbers);

// Output: [ 9 ]
//         [ 2, 3, 5, 7, 13, 11 ]

JavaScript Array lastIndexOf()

The lastIndexOf() method returns the index of the last occurrence of a specified element in the array.

let priceList = [10, 8, 2, 31, 10, 31, 65];

// finding the index of the last occurence of 31
let lastIndex = priceList.lastIndexOf(31);

console.log(lastIndex); 

// Output: 5

JavaScript Array indexOf()

The indexOf() method returns the first index of occurrence of an array element, or -1 if it is not found.

let languages = ["Java", "JavaScript", "Python", "JavaScript"];

// get the index of the first occurrence of "JavaScript"
let index = languages.indexOf("JavaScript");
console.log(index);

// Output: 1

JavaScript Array slice()

The slice() method returns a shallow copy of a portion of an array into a new array object.

let numbers = [2, 3, 5, 7, 11, 13, 17];

// create another array by slicing numbers from index 3 to 5
let newArray = numbers.slice(3, 6);
console.log(newArray);

// Output: [ 7, 11, 13 ]

JavaScript Array map()

The map() method creates a new array with the results of calling a function for every array element.

let numbers = [2, 4, 6, 8, 10];

// function to return the square of a number
function square(number) {
  return number * number;
}

// apply square() function to each item of the numbers list
let square_numbers = numbers.map(square);
console.log(square_numbers);

// Output: [ 4, 16, 36, 64, 100 ]

Thanks for reading ❤️