loading

Top important Javascript (js) Array Methods for frontend developers

the array is a very important topic in javascript. Almost everywhere it is needed whether we are in frontend or backend with node js, so it becomes necessary to know javascript methods.

we can declare an array in js by following the methods

const arr=["1","2","3"]
         or
const arr=new Array("1","2","3")

const array=[]
const length=array.length
const array=["apple","grapes"]
array.push("mango")

The find() the method returns the value of the first element that passes a test. We pass a filter function to check items that we want to find based on condition.

  • find method run for every item in an array
  • it returns undefined if no item is found
  • It does execute for an empty item
  • the find method does not change or manipulate the original array.
const array=["mango","apple","grapes"]
const findmango=array.find(el=>el=="mango")

filter method in an array is used to filter items from the array. we pass a function to filter items based on the condition it filters out the items in a new array.

  • The filter method does not execute the function on an empty element of the array
  • The filter method does not change the original array.
  • The filter method creates a new array of items returned from the filter function.
const ages = [32, 33, 16, 40];
const voters=ages.filter(el=>el>18)

to find all items passed the particular conditions we will have to use the filter method

const arr=[10,20,22,50,60]
const all_items_above_21 = arr.filter(num=>num>21)

The findindex method is used to find an index of an item in the array.

  • find method executes a function for each element

There may be multiple ways to empty an array the easiest way is to assign an empty array.

const arr=["12","22","17"]

Four ways to empty an array in javascript

  • Pass empty array
  • Set array length to zero
  • Delete all elements using splice one by one
  • Pop all items of an array.
let a = [1,2,3];

//method 1
a = [];

//method 2
a.length = 0;

//method 3
a.splice(0,a.length);

//method 4
while(a.length > 0) {
    a.pop();
}

to merge two arrays we can append two arrays using the append method or spread operator.

const arr1 = ["Cecilie", "Lone"];
const arr2 = [1, 2, 3];


//method 1
const mergedArray = arr1.concat(arr2);

//method 2
const mergedArray = [...arr1,...arr2]

concat method joins items of two or more arrays and returns a new array containing the items of all arrays. The Concat method does not change the original array.

const arr1 = ["mango", "apple"];
const arr2 = ["Emil", "Tobias", "Linus"];
const arr3 = ["ashish","manish"];
const children = arr1.concat(arr2, arr3);

There are multiple ways to remove array items. we can use the filter or splice method to remove a specific item from an array.

let value = 3
let arr = [1, 2, 3, 4, 5, 3]
arr = arr.filter(item => item !== value)
console.log(arr)
arr=[1,2,4,5]

Removing an element from an array by index. If the index of an item is known then we can use the splice method otherwise we can first find the element index and then we can remove it from the array using the splice method.

const arr=[1,2,4,5,6,7,8]
const index=arr.findindex(el=>el==4)  //find index of item 4
arr.splice(4,1)  //remove 1 item from index 4

Loading...

About Author

Loading...

Loading...

👨‍💻

Frontend development

Learn frontend development with examples and practical exercise of HTML,CSS,JS,React.js.