Mohamed Mohamud
Mohamed Mohamud's Blog

Mohamed Mohamud's Blog

Array methods in JavaScript, simplified!

Array methods in JavaScript, simplified!

I hope so anyway

Mohamed Mohamud's photo
Mohamed Mohamud

Published on Nov 25, 2021

3 min read

Table of contents

  • Array.push()
  • Array.pop()
  • Array.unshift()
  • Array.shift()
  • Array.map()
  • Array.some()
  • Array.every()
  • Array.find()

As part of my Knowledge is Power series, I aim to post once a week about something I've learned. This week one of the things I've learned about is Arrays.

Arrays are a comprehensive and powerful tool in JavaScript and there are so many ways to use them to your advantage. I hope to simplify some Array functions so that it's easier for all of us newbies to understand!

Array.push()

The push() method simply adds an element to the end of the array and increases its length. It's not limited to one element, you can add more than one simply by adding a comma and another element.

See below:

array.push() used to add to the end of an array

Array.pop()

The pop() method does the opposite of what push() does at the end of the array, it simply 'pops' what's at the end and removes it (only one element at a time).

See below:

array.pop() used to remove the last element within the array

Array.unshift()

The unshift() method adds an element to the beginning of the array and increases its length. It's not limited to one element, you can add more than one simply by adding a comma and another element.

See below:

array.unshift() used to add to the beginning of the array

Array.shift()

The shift() method 'shifts' an element (at a time) from the beginning of the array and removes it.

array.shift() used to remove an element from the beginning of the array

Array.map()

Things are getting interesting, the map() method creates a new array with the results of calling a function.

Check this; the function runs on every element within the array.

See below:

.map() creates a new array with the results of calling a provided function on every element in the calling array

Array.some()

The some() method tests whether at least one of the elements in the array passes the test within the called function.

See below:

some() method being used

Array.every()

The every() method tests if all the elements in the array pass the test within the function - it returns a Boolean value.

In the below example, you can see it returns false but do you know which number is causing it to return false?

The every() method tests all the elements in the array with called function and returns a Boolean value

Array.find()

You don't need to find which number is causing it to return false, just use the .find() method! The find() method returns the value of the first element in the provided array that satisfies the provided testing function. If no value satisfies the testing function, it will return undefined.

carbon (9).png

These are just some of the array methods out there but these are just the ones that I've been exposed to over the last few days.

Because you got down this far, enjoy this visualisation of some array methods that I put together, it made me chuckle.

Arrays.png

If you're still reading, thank you so much, I hope to use this blog to post and share useful information I gain! I would love to connect with other developers to see what they're learning and learn from them - please connect with me on the following:

Twitter: @codingmohamed

Github: github.com/codingmohamed

LinkedIn: linkedin.com/in/mohamed-mohamud-0ba187155

Email:

 
Share this