Array Methods – JavaScript

Last updated on September 11, 2022
Author: ciphertrick

Last updated on September 11, 2022
Author: ciphertrick

Table of Contents

What is a method?

A function inside an object.

let exampleObject = {
  callF() {
  }
}

forEach() Method

We use forEach() to loop over elements inside an array – one element at a time.

Here’s an example,

let exampleArray = [1, 2, 3, 4, 5]

exampleArray.forEach(number => {
  console.log(number)
})

Here, in this example above, we have an array called exampleArray and then we have used forEach on it and inside the brackets – there’s an Arrow Function which console.logs the number every time forEach is called.

.map

This is the same as forEach() but – this one returns something from the function call – always.

So looping over elements and then returning something. This is what .map does.

let exampleArrayA = [1, 2, 3, 4, 5]

let resultA = exampleArrayA.map((number) => {
  return number * 3
})

console.log(resultA)

This takes in elements from Array and multiplies all of them individually by 3. The final result would be an array with all the numbers * 3

Note: The array we will get because of .map() will be a brand new array.

.filter

This helps filter values of an Array.

For example, we can filter the array and only have the values under 3

let exampleArrayA = [1, 2, 3, 4, 5]

let resultA = exampleArrayA.filter((number) => {
  return number <= 3
})

console.log(resultA)

This will return all the numbers lesser of equal to 3

This works on a true or false basis.

This returns a new array as well. Does not modify current/existing array.

.find()

This works like filter but as soon as the condition stated becomes true, it stops.

let exampleArrayA = [1, 2, 3, 4, 5]

let resultA = exampleArrayA.find((number) => {
  return number > 3
})

console.log(resultA)

The output will be 4 and as soon as there’s one output, the function stops. That’s it. Only needs to be true one time and it’s done.

.some()

This loops through all elements in Array and then if the condition we specified in the function is true, returns true else false.

It only displays true OR false.

let exampleArrayA = [1, 2, 3, 4, 5]

let resultA = exampleArrayA.some((number) => {
  return number > 3
})

console.log(resultA)

This would return true as we have at least one number greater than 3 in our Array.

.every()

This is like some but opposite. Instead of checking at least one condition is fulfilled, this checks if all of them are fulfilled. If yes, then returns True. Otherwise False.

let exampleArrayA = [1, 2, 3, 4, 5]

let resultA = exampleArrayA.some((number) => {
  return number > 3
})

console.log(resultA)

This would return false as there are numbers smaller than 3 as well.

.reduce()

This takes at least 2 arguments.

This function reduces the array to one singular value by looping through elements and doing something each time to achieve that.

let exampleArrayA = [1, 2, 3, 4, 5]

let resultA = exampleArrayA.reduce((sum, number) => {
  return sum + number
}, 0)

console.log(resultA)

Now, let’s break down what’s happening here.

sum = the current sum of number of elements of arrays so far

number = the element/number inside an array

return sum + number = this adds the sum to number, sum is initially set to 0 as you can notice in the second argument and then after each time the function is called, there is a new sum.

The function eventually stops when all the numbers of that array are added up to get a sum. This way we reduced the array to a singular value which was the sum of all the numbers inside that array.

If you’re wondering what this 0 is

This is the starting point of sum… it starts from 0 so we can say that sum has a value of 0 in the start.

.includes()

This tests if we have a specific number that we mention inside the array. If yes, then prints out true otherwise false.

let exampleArrayA = [1, 2, 3, 4, 5]

let resultA = exampleArrayA.includes(5)

console.log(resultA)

The output of this would be true.

Conclusion

This was all about Array Methods. I try to explain things in the easiest way possible and I hope I did some justice here.

ciphertrick