JS Array methods: Which method to use to...?

shubhamkshatriya25

Shubham Singh Kshatriya

Posted on November 6, 2021

JS Array methods: Which method to use to...?

Arrays are list-like objects whose prototype provides various methods to perform many operations. Did you ever thought what are the different use-cases where these methods can be used?

The answer to this question can be found using: I WANT TO...

1. Mutate the original array

Add an element

  • push(): Adds one or more elements to the end of an array and returns the new length of the array.
  • unshift(): Adds one or more elements to the beginning of an array and returns the new length of the array.

Remove an element

  • pop(): Removes the last element from an array and returns that element.
  • shift(): Removes the first element from an array and returns that element.
  • splice(): Changes the contents of an array by removing or replacing existing elements and/or adding new elements.

Others:

  • fill(): Changes all elements in an array to a static value.
  • sort(): Sorts an array.
  • reverse(): Reverses an array.

Alt Text

2. Create a new array from original array

Portion of array

  • slice(): Returns a shallow copy of a portion of an array into a new array.

Computed from array.

  • map(): Creates a new array from an existing one by applying a function to each one of the elements of the existing array.
  • reduce(): Reduces an array of values down to just one value.
  • filter(): Takes each element in an array and applies a conditional statement against it. If this conditional returns true, the element gets pushed to the new array.

Merge into array

  • concat(): Merges two or more arrays.

Flatten the array:

  • flat(): Creates a new array with all sub-array elements concatenated into it recursively up to the specified depth.
  • flatMap(): Returns a new array formed by applying a given callback function to each element of the existing array, and then flattening the result by one level.

Alt Text

3. Find the

Index of element

  • findIndex(): Returns the index of the first element in the array that satisfies the given condition. Otherwise, it returns -1.

Array element

  • find(): Returns the first element in the array that satisfies the given condition. Otherwise, it returns undefined. Alt Text

4. Check if array contains an element

Using a condition

  • some(): Returns true if, in the array, it finds an element for which the provided function returns true; otherwise it returns false.
  • every(): Returns true if, in the array, it finds all the element returns true for the provided function; otherwise it returns false.

Using a value

  • includes(): Checks whether an array includes a certain value, returning true or false as appropriate. Alt Text

5. Loop the array

  • forEach(): Executes a provided function once for each array element. Alt Text

6. Join the array elements

  • join(): Creates and returns a new string by concatenating all of the elements in an array Alt Text
💖 💪 🙅 🚩
shubhamkshatriya25
Shubham Singh Kshatriya

Posted on November 6, 2021

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related