Javascript has different built-in methods such as Object methods, Array methods, String methods, Number methods, etc.
In this article, you will learn about different javascript array methods, their properties, and how to use them in your code. Before we proceed, let's discuss what an array is in javascript.
what is an array?
An array is an object that stores multiple elements of any type. Arrays are written in a pair of square brackets [ ]. elements in an array are separated by a comma (,).
It is common practice to declare an array with const.
const fruit = ["orange", "mango", "pineapple", "apple"]
Elements in an array can be string, boolean, number, object, and even other arrays (nested arrays)
The example below is an array with different types of elements.
const person = ["male", 29, "tall", true]
Array Index
Array Index is the position of the elements in an array. It starts from 0 and increases by 1 with each element.
In the array above, the index of "male" is 0; the index of 29 is 1; the index of "tall" is 2; the index of true is 3.
Array Length
The length of an array is the number of elements in an array. Unlike the array index, array length starts from 1. The length of the array above is 4.
Now that we've discussed array, let's learn about array methods which is the aim of this article.
Javascript Array Methods
Array methods are built-in functions in javascript that are applied to arrays. These methods make changes or specific activities to arrays, such as adding to the elements in an array, merging two or more arrays, and joining each method to perform a unique function.
some of the array methods commonly used are;
push () method: adds an element to an array at the end.
const hobbies = ["singing", "reading", "skipping"] hobbies.push("dancing") console.log(hobbies); //output: singing, reading, skipping, dancing
pop() method: remove an element from an array at the end. It removes the last element in an array.
const food = ["rice", "beans", "yam", "bread", "noodles"] food.pop(); console.log(food) //output: rice, beans, yam, bread
unshift() method: adds an element to an array at the beginning.
const food = ["rice", "beans", "yam", "bread", "noodles"] food.unshift(potatoes); console.log(food) //output: potatoes, rice, beans, yam, bread, noodles
shift() method: removes the first element in an array.
const food = ["rice", "beans", "yam", "bread", "noodles"] food.unshift(); console.log(food) //output: beans, yam, bread, noodles
concat() method: creates a new array by merging existing arrays. it joins two or more arrays together and returns a new array.
const maleStudents = ["Gabriel", "George", "Peter"] const femaleStudents = ["Mary", "Joy", "Princess"] const students = maleStudents.concat(femaleStudents) console.log(students) //output: Gabriel, George, Peter, Mary, Joy, Princess
slice() method: selects and slices out a part of an array.
const subjects = ["french", "art", "mathematics", "english"] console.log(subject.splice(2)); //output: mathematics, english
splice() method: add new items to an array. splice method consists of;
first parameter: which defines the position of where new items should be added to the array.
second parameter: which defines how many items should be removed from the array.
the rest of the parameters define the new items to be added to the array.
const fruits = ["mango", "apple", "cashew", "orange"] fruits.splice = [2, 1, "pineapple", "pawpaw"] console.log(fruits); //output: mango, apple, pineapple, pawpaw, cashew, orange
indexOf() method: returns the position of an item in an array.
const fruits = ["mango", "apple", "cashew", "pineapple", "orange"] console.log(fruits.index(cashew)); //output: 2
reverse() method: rearranges and reverses the elements in an array. The last element will be the first and the first element will be the last.
const names = ["john", "sarah", "caroline", "micheal"] names.reverse() console.log(names); //output: micheal, caroline, sarah, john
join() method: concatenate all the elements in an array and return a new string.
const alphabet = ["c", "o", "n", "s", "i", "s", "t"] console.log(alphabet.join('')); //output: consist
forEach() method: loops over an array and calls a function for each element.
const names = ["john", "sarah", "caroline"] names.forEach(myFunction); myFunction(items){console.log(items);} //output: // john // sarah // caroline
includes() method: checks if an array includes a specified element. It returns true if the array contains the specified element and returns false if the array does not contain the specified.
const months = ["february", "april", "june", "august", "may"] console.log(months.includes(june)); //output: true console.log(months.includes(july)); //output: false
conclusion
In conclusion, javascript array methods are actions that are performed on arrays to bring them in various ways such as adding or removing elements from an array, concatenating arrays, iterating over arrays, and creating new arrays.