JavaScript is an awesome client side or server side language that is used to create interactive web pages.
In this section we are going to talk about some of most used array methods in JavaScript or even JavaScript frameworks like Angular and React. Let see what is an Array in JavaScript.
What is an Array ?
An Array is a special type of object that can hold multiple values or elements of same type , An array is a very useful thing in aura of programming. We use Array in our daily programming life. An array index position starts from 0 and can have unlimited positions in it. we use arrays to transfer data from one platform to another platform.
A simple example to an array is we can store multiple values of same type like this example:
var arrayObject = ["JavaScript","Angular","React", "Python", "nodejs"]; Here are 6 JavaScript array methods that every developer should know.
filter()
Filter is an array function that returns an array of all values that matches with your given condition. Filter function is go through all elements of an array to pass a test that we give to it. if there is no element matched with the condition then empty array will be return in that case. Lets create it with an example:
const ages = [20, 22, 26, 30, 21, 35, 33];
ages.filter(age => age < 25);
Parameters: filter() has three argument
- currentValue -first argument
- index - second argument
- array Object - third argument
currentValue argument is required and others are optional. We can also use this keyword if there is no argument passed in the filter.
Push() and Pop()
In JavaScript we usually add elements or remove element into an array, while working with array function we may need to update array length according to our requirements so there are very useful function that JavaScript provides us to use with arrays.
To add new element in an array we have push() function.
push()
we can use push() function to add some new element into the an array but it does not validate if it is push the duplicate values it just pushes elements into it. Remember it only returns the total length of the array , not the updated array.push() function takes only one argument of type array you are pushing in.
var countries = ["INDIA", "USA", "DUBAI","UK", GERMANY"];
var totalCountries = countries.push("FRANCE");
Now the updated array looks like:
["INDIA", "USA", "DUBAI","UK", GERMANY", "FRANCE"];
pop()
Pop is very important function for arrays in JavaScript. It is used to remove the last element from an array and it does not take any argument, it just removes the existing last element from the array. it returns the last popped element from the array See the example below:
var countries = ["INDIA", "USA", "DUBAI","UK", "GERMANY"];
countries.pop();
output:
"GERMANY"
Again when you apply pop() then the output will be
"UK"
and the updated array looks like
INDIA, USA, DUBAI
map()
Map is an immutable method and it is used to manipulate the data present in the array. it creates new array after manipulating it , it often used to format the array according to our requirement like if we want to add something to elements of the array of to reduce the element size by deleting something from them.
lets see an example here we have an array of numbers we want to multiple every number by 2 see how it can be done with map() function in JavaScript.
var numbers = [10, 20, 30, 40, 50];
var updatedNumbers = numbers.map(number => 2 * number);
output:
[20, 40, 60, 80, 100]
forEach()
Foreach is very important array function in JavaScript. if you want to go through all the elements you have in an array and want to update the existing array then forEach will be perfect for you.
Parameters:
JavaScript array has three parameters in it.
- element - required
- index - optional
- array - optional
thisArg - this is to use when executing the callback
Example
const items = [10,20, 30, 40, 50];
items.forEach(function (item) {
console.log(item)
});
output:
10
20
30
40
50
indexOf()
If you want to access the index of element in array then indexOf() function is great approach. we often need to get index of an array item sometimes or we want to access an element on exact index of an array then indexOf() function in JavaScript is very useful.
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var a = fruits.indexOf("Apple");
output:
2
find()
Find function is used to filter element in an array , it is Simillar to filter() but it only returns the first element it finds in its way and return it. It is very useful array function where we get to find an element that matches with a condition.
example:
var numbers = [1, 2, 3, 4, 5, 6, 7, 8];
numbers.find(item => item >= 5);
output:
5
6
7
8
join()
JOIN function in JavaScript that creates and return a new string by joining each element of the given array separated by comma by default or by a specified separator character if the user provides any in the join function.
const numbers = [1,2,3,4,5,6,7,8];
numbers.join();
output: 1,2,3,4,5,6,7,8
const numbers - [1,2,3,4,5,6,7,8];
numbers.join("=> ");
output: 1 => 2 => 3 => 4 => 5 => 6 => 7 => 8
Summary
In this section we looked into JavaScript most used Array functions. There are more than 20 Array functions in the market which we can use to make our programming structure more productive and reliable.
.jpg)
0 Comments