DEV Community

Cover image for πŸ€Έβ€β™‚οΈ JavaScript Array Methods Simplified.
Ephraim Duncan
Ephraim Duncan

Posted on

πŸ€Έβ€β™‚οΈ JavaScript Array Methods Simplified.

Probably anyone reading this knows what an array is but let's revise a bit.

What is a Array?

Simply, an array is a variable (a very special one) that holds more than one value. So you can keep an unlimited number of values in it and it is much helpful and easier to work with than declaring and assigning each variable all over again.

Array's can be created by [] with the elements seperated by , or if you want to be nerdy, you can use new Array().

Let's get to why we are here. Array Methods.

* .concat()

The concat method is used to add two arrays as one.

let planets = ["Mars","Uranus","Venus"]
let newPlanet = ["Proxima Centauri B"]

planets.concat(newPlanet) 
// ["Mars","Uranus","Venus","Proxima Centauri B"]
Enter fullscreen mode Exit fullscreen mode

* .join()

The join method joins the elements of an array by a given string which it takes as the argument and returns the string value.

let numbers = [1,2,3,4]
numbers.join(".")
// "1.2.3.4"
Enter fullscreen mode Exit fullscreen mode

* .slice()

The slice() method returns the selected elements in an array, as a new array object without changing the original array. It selects the elements starting at the given start argument, and ends at, but does not include, the given end argument.

let numbers = [1,2,3,4,5,6]
numbers.slice(2,4)
// [3,4]

console.log(numbers) // The original does not change
// [1,2,3,4,5,6]
Enter fullscreen mode Exit fullscreen mode

* .indexOf()

It returns the index value of an element in an array.

let alphas = ["a","b","c"]
alphas.indexOf("c")
// 2

Enter fullscreen mode Exit fullscreen mode

* .lastIndexOf()

It returns the last index value of an element in an array if the same element repeats itself more than one.

let alphas = ["a","b","b","b","c"]
alphas.lastIndexOf("b")
// 3
Enter fullscreen mode Exit fullscreen mode

* .reverse()

It returns the array reversed.

let alphas = ["a","b","c"]
alphas.reverse()
// ["c","b"',"a"]
Enter fullscreen mode Exit fullscreen mode

* .sort()

The sort method is used to sort elements of the array alphabetically.

let alphas = ["d","y","c"]
let digits = [23,5,11]
alphas.sort()
// ["c","d","y"]

digits.sort()
// [11,23,5]
Enter fullscreen mode Exit fullscreen mode

* .shift()

The shift method removes the first element of the array shifts the values at consecutive indexes down, then returns the removed value.

const digits = [1,2,3,4]

const shiftArray = digits.shift()
// digits = [2,3,4]
// shiftArray = 1
Enter fullscreen mode Exit fullscreen mode

* .unshift()

The unshift method adds new items to the beginning of an array and returns the new length.

const digits = [1,2,3,4]

const unshiftArray = digits.unshift("a")
// digits = ["a",1,2,3,4]
// unshiftArray = 5
Enter fullscreen mode Exit fullscreen mode

* .pop()

The pop method removes the last element of an array and returns the element removed.

const digits = [1,2,3,4]

const popArray = digits.pop()
// digits = [1,2,3]
// popArray= 1
Enter fullscreen mode Exit fullscreen mode

* .push()

The opposite of the unshift method. The push method adds new items to the end of an array and returns the new length.

const digits = [1,2,3,4]

const pushArray = digits.push("a")
// digits = [1,2,3,4,"a"]
// pushArray = 5
Enter fullscreen mode Exit fullscreen mode

* .splice()

The splice method replaces the element in an array from one position to another and returns the element that was replaced.

const digits = [1,2,3,4]

const spliceArray = digits.splice(1,2,"a")
// digits = [1,"a",4]
// spliceArray = [2,3]
Enter fullscreen mode Exit fullscreen mode

Top comments (0)