I spent my last hour on learning JS Array Functions. Here What I have learned!

Image is taken from https://cdn.weasyl.com/

I can hardly remember popular Javascript built-in functions especially array functions. So, I spent my last hour reading the “Javascript Arrays” chapter of “Javascript Cookbook” book. I am sharing my learning here.

** indexOf
Purpose:
Searching item in an array
Return: index of the searched item

var animals = ['dog', 'cat', 'seal']
console.log(animals.indexOf('dog')) // Prints 0

** findIndex
Purpose:
Searching item in an array based on a test function
Return: index of the searched item

var allNums = [2, 4, 9, 6, 7, 1, 1]
var over = allNums.findIndex(function (element){
return (element>=6) // Returns 2
})
console.log(allNums[over]) // Prints 9

** Combination Concat() and Apply()
You can flatten a 2d Array by using both of these functions

var fruitArray = []
fruitArray[0] = ['strawberry', 'orange']
fruitArray[1] = ['lime', 'peach']
fruitArray[2] = ['banana', 'kiwi']

var newFruitArray = fruitArray.concat.apply([],fruitArray)
console.log(newFruitArray)
// Prints [ 'strawberry', 'orange', 'lime', 'peach', 'banana', 'kiwi' ]

** splice
Purpose:
Removing/Replacing/Adding Array Elements
To replace the first item with new items,

var animals = ['dog', 'cat', 'seal', 'lion', 'tiger']
animals.splice(0, 1, "zeba", "elephent")
console.log(animals) // Prints [ 'zeba', 'elephent', 'cat', 'seal', 'lion', 'tiger' ]

It can take multiple arguments. The first one is mandatory. It represents the index where the splicing would take place. The second one is optional. It is the number of elements you want to remove. The rest of the parameters is going to be placed in between the block of array made from the first two arguments.

If you just pass the first arguments, all elements from this in the array will have vanished. For the above animals array,

var animals = ['dog', 'cat', 'seal', 'lion', 'tiger']
animals.splice(2)
console.log(animals) // Prints [ 'dog', 'cat' ]

** slice

Unlike Splice, it will not affect the main array. Slice will create a new array from the existing array like below,

var animals = ['dog', 'cat', 'seal', 'lion', 'tiger']
console.log(animals.slice(0,2)) // Prints [ 'dog', 'cat' ]

The first argument represents where to start. And the second one represents till which index (exclusive) you want to slice the array.

** map

Suppose you want to make an array a1 based on another array b1. a1 will contain the remainder (for ex. mod by 2) of the b1 array. You may think then what is the difference between map and forEach. Actually, they both iterate the whole array. But map must have return statement whereas forEach not necessarily have return statement.

var b1 = [2, 4, 9, 6, 7, 1, 1]
var a1 = b1.map(function (element){
return element%2
})
console.log(a1) // Prints [ 0, 0, 1, 0, 1, 1, 1 ]

** filter

You can filter in an array by this function. For example, you like to have only the numbers whose remainders are 0.

var b1 = [2, 4, 9, 6, 7, 1, 1]
var a1 = b1.filter(function (element){
return element%2==0
})
console.log(a1) // Prints [ 2, 4, 6 ]

** reduce

You can use that function to sum up all elements of an array. Here, reduce takes two arguments. First n1 is the sum of the previous, and n2 is the new element of the array.

var b1 = [2, 4, 9, 6, 7, 1, 1]
var sum = b1.reduce(function (n1, n2){
return n1+n2
})
console.log(sum) // Prints 30

Here, I have showed some of the commonly used Javascript Array functions. Don’t forget to claps!!!!

If you like this article, make sure to follow my Medium profile and check out some other articles of mine!

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store