tutorialstonight logo
A Platform To Learn To Code

JAVASCRIPT ARRAY METHODS



What Are Array Methods In Javascript?

Javascript Array methods are special built-in function which has a special task to perform on the array. These methods either change the original array or return a new array by modifying it according to our need.

The array is a special data type which can store multiple values of same or different data types. Javascript provides many built-in properties as well as methods to deal with the array and its data members.

Here is a simple example of an array and forEach array method to loop through an array.

Test array => const arr = [1, 2, 3, 4, 5]

Using forEach() method to loop through the array and print elements
arr.forEach((element) => console.log(element))

( We Will learn this method in detail in this section. )


Javascript Array Length

Before we jump to array methods let's take a loop at a very important array property which is length property.

length property in javascript when applied on the array it returns the number of elements in the array. It is used when you want the length of array for some purpose like in looping through the array using for loop.

Example

Try It

Javascript Array Methods List

Here is a list of javascript array methods, we will go in detail with each method further in the section.

Click on any method to jump to the section.

  1. concat()
  2. copyWithIn()
  3. entries()
  4. fill()
  5. filter()
  6. find()
  7. findIndex()
  8. forEach()
  9. includes()
  10. indexOf()
  11. join()
  12. map()
  13. push()
  14. pop()
  15. shift()
  16. unshift()
  17. reduce()
  18. reverse()
  19. slice()
  20. some()
  21. sort()
  22. splice()
  23. toString()
  24. values()

Now let's look at each String methods in detail.


1. concat Array In Javascript

The concat() method in javascript is used to merge 2 or more arrays in one array. Here is syntax of the concat() method.

const new_array = old_array(arg1, arg2, ...)

Here the arguments of the method can be an array and/or any value to concatenate into the new array.

Example

Try It

2. copyWithIn Method In Javascript

The copyWithIn() method in javascript is used to copy a part of the array with in the same array.

This method modifies elements of the original array but the length of the array is not modified.

arr.copyWithIn(targetIndex, startIndex, endIndex)

The copyWithIn() method takes three arguments:

  • target: It defines the target index from where a copy of the element should starts
  • startsIndex (optional): It defines index at which starts copying the element. The default value is 0.
  • endIndex (optional): It defines the index at which to stop copying the element. The default value is the last index.

Example

Try It

3. entries Method In Javascript

The entries() method in javascript returns a new Array Iterator object.

This iterator object contains the index and value in form of key-value pair.

This iterator can be used to loop through the array.

Example

Try It

4. fill Method In Javascript

The fill() method in javascript returns a modified array by filling it with the passed value.

arr.fill(value, start, end)

The fill() method accepts 3 arguments:

  • value: Value to be filled
  • start(optional): Index from where the filling has to start. Its default value is 0.
  • end(optional): Index where the filling is to be stopped.

Example

Try It

5. filter Method In Javascript

The filter() method in javascript is used to create a new array with the elements passing certain condition.

The filter() methods accept a function and that function returns true or false after checking some conditions over each and every element. If true is returned then that element is added to the new array, else discarded.

Finally a new array is returned with those added elements.

arr.filter(callback_function(element, index){
//codes
return true/false; })

The 2 argument of the function are the element and its index value. The example below return an array with all elements greater than 10.

Example

Try It

6. find Method In Javascript

The find() method in javascript is returned the first value of the array elements which satisfies the provided condition.

The find() methods accepts a callback function where you can define the condition.

arr.find(callback_function(element, index){
//codes
})

The 2 argument of the function are the element and its index value. The example below returns the first elemnt with value greater than 10.

Example

Try It

7. findIndex Method In Javascript

The findIndex() method in javascript is returned the index of the first element of the array elements which satisfies the provided condition. If no such element exists then returns -1.

The findIndex() methods accepts a callback function where you can define the condition.

arr.findIndex(callback_function(element, index){
//codes
})

The 2 argument of the function are the element and its index value. The example below returns the index of the first element with value greater than 10.

Example

Try It

8. forEach Method In Javascript

The forEach() method in javascript is used to run a user-defined function once for each element of the array.

The function to be executed accepts current element and its index value as an argument. Passing index is optional.

arr.forEach(callback_function(element, index){
//codes
})

In the example below we have multiplied 2 to each element.

Example

Try It

9. includes Method In Javascript

The includes() method in javascript determines whether certain values exists in the array or not. If the value exists in the array then it returns true else return false.

The function accepts 2 argument

  • value: value to look for in the array
  • fromIndex: index position from where you have to look for the value.

arr.includes(callback_function(value, fromIndex){
//codes
})

Example

Try It

10. indexOf Method In Javascript

The indexOf() method in javascript returns the first index of the element passed as an argument. If the value does not exist then returns -1.

The function accepts 2 argument

  • value: value to look for in the array
  • fromIndex: index position from where you have to look for the value.

arr.indexOf(value)

Example

Try It

11. join Method In Javascript

The join() method in javascript concatenates all elements of the array, separated by commas or by some specified separator and returns it as a string.

The function accepts 1 argument which is separated. It is optional and its default value is a comma (",").

Example

Try It

12. map Method In Javascript

The map() method in javascript is most useful array method, it returns a new array by filling the array with the results of callback function running for each element of the array.

const new_array = arr.map(callback_function(currentValue, index){
//execute code and return new element
})

The first argument of the callback function of map() method is current value of the calling array and the second value is index of current value. Index argument is optional.

Example

Try It

13. push Method In Javascript

The push() method in javascript is used to add one or more elements to the end of the calling array.

It also returns the new length of the array.

arr.push(value1, value2, ...)

Example

Try It

14. pop Method In Javascript

The pop() method in javascript removes the last element from the array and returns the removed elements.

Example

Try It

15. shift Method In Javascript

Similarly, like pop() method shift() method also removes the element from the array but instead of removing the last element, it removes the first element.

Example

Try It

16. unshift Method In Javascript

Similarly, like push() method unshift() method also adds the element to the array but instead of adding it to the ending of the array, it adds it to the beginning.

Example

Try It

17. reduce Method In Javascript

The reduce() method in javascript reduce the array element to a single value, using a reducer function.

The reducer callback function accepts the following arguments:

  • accumulator: It stores return value of previously returned in last execution or initial value in the first iteration. Default initial value is 0.
  • currentValue: It is the current element being executed.
  • index: index value of the current element. It is optional.

Example

Try It

18. reverse Method In Javascript

The reverse() method in javascript reverse the array elements from first to last.

Example

Try It

19. slice Method In Javascript

The slice() method in javascript returns a new array by copying the calling array's elements in new the array.

The slice() method accepts 2 arguments:

  • start: It is starting position to copy the element. It is optional, its default value is 0.
  • end: It is ending position to copy the element. It is optional, its default value is the last index of the array.

Example

Try It

20. some Method In Javascript

The some() method in javascript determines whether at least one element in the array passes certain condition by providing a callback function.

If any of array element passes the test then it returns true, else returns false.

The callback function's first argument is the current element and the second element is the index of the element which is also optional.

Example

Try It

21. sort Method In Javascript

The sort() method in javascript sort the array element in ascending order according to the characters's Unicode value. Means it convert its element to string and sort it by comparing the string in UTF-16 code.

The sort() function accepts a compare function which defines some sorting order. This compare function has 2 arguments, 'firstElement': the first element for comparison and 'secondElement': these second element for comparison.

Example

Try It

22. splice Method In Javascript

The splice() method in javascript changes the array element by replacing or removing array element from the array. It can also add elements to desired index in array either by keeping or removing rest elements of the array.

arr.splice(index, deleteCount, replaceBy)

Example

Try It

23. toString Method In Javascript

The toString() method in javascript returns a string representing the elements of the array.

Example

Try It

24. values Method In Javascript

The values() method in javascript returns a new array iterator that contains values of each index in the array.

Example

Try It