DEV Community

_Khojiakbar_
_Khojiakbar_

Posted on • Edited on

Array high order methods

High-order array methods in JavaScript are methods that operate on arrays and typically take other functions as arguments. These methods allow for powerful and concise ways to manipulate and analyze data within arrays. Here’s a broad explanation of some of the most commonly used high-order array methods:

1. map()

Purpose: Creates a new array populated with the results of calling a provided function on every element in the calling array.

  • return does not work.
  • Can work like forEach().
  • Conditionals does not work.

Usage: Transforming data by applying a function to each element.

const numbers = [1, 2, 3, 4];
const doubled = numbers.map(num => num * 2); // doubled is [2, 4, 6, 8]
Enter fullscreen mode Exit fullscreen mode

2. filter()

Purpose: Creates a new array with all elements that pass the test implemented by the provided function.

  • forEach and map integration
  • no modification

Usage: Filtering out elements based on a condition.

const numbers = [1, 2, 3, 4];
const evens = numbers.filter(num => num % 2 === 0); // evens is [2, 4]
Enter fullscreen mode Exit fullscreen mode

3. reduce()

Purpose: Executes a reducer function (that you provide) on each element of the array, resulting in a single output value.
Usage: Summing up values, calculating averages, or accumulating a value based on array elements.
Structure let nArr = array.reduce(()=>{}, 0)

const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0); // sum is 10
Enter fullscreen mode Exit fullscreen mode

4. forEach()

Purpose: Executes a provided function once for each array element.
Usage: Performing an action on each element, often used instead of a for loop for iteration.
return x

! return does not work

const numbers = [1, 2, 3, 4];
numbers.forEach(num => console.log(num)); // Logs 1, 2, 3, 4 to the console
Enter fullscreen mode Exit fullscreen mode

5. find()

Purpose: Returns the value of the first element in the array that satisfies the provided testing function.
Usage: Finding a single element that matches a condition.

  • Looks like filter()
  • Conditionals does not work.
const numbers = [1, 2, 3, 4];
const found = numbers.find(num => num > 2); // found is 3
Enter fullscreen mode Exit fullscreen mode

6. findIndex()

Purpose: Returns the index of the first element in the array that satisfies the provided testing function.
Usage: Finding the index of a single element that matches a condition.

const numbers = [1, 2, 3, 4];
const index = numbers.findIndex(num => num > 2); // index is 2
Enter fullscreen mode Exit fullscreen mode

7. some()

Purpose: Tests whether at least one element in the array passes the test implemented by the provided function.
Usage: Checking if any elements meet a condition.

const numbers = [1, 2, 3, 4];
const hasEven = numbers.some(num => num % 2 === 0); // hasEven is true
Enter fullscreen mode Exit fullscreen mode

8. every()

Purpose: Tests whether all elements in the array pass the test implemented by the provided function.
Usage: Checking if all elements meet a condition.

const numbers = [1, 2, 3, 4];
const allEven = numbers.every(num => num % 2 === 0); // allEven is false
Enter fullscreen mode Exit fullscreen mode

9. sort()

Purpose: Sorts the elements of an array in place and returns the sorted array.
Usage: Sorting elements based on specified criteria.

const numbers = [4, 2, 3, 1];
numbers.sort(); // numbers is now [1, 2, 3, 4]

const words = ['apple', 'banana', 'cherry'];
words.sort((a, b) => a.localeCompare(b)); // words is now ['apple', 'banana', 'cherry']
words.sort()
Enter fullscreen mode Exit fullscreen mode

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs

👋 Kindness is contagious

Dive into an ocean of knowledge with this thought-provoking post, revered deeply within the supportive DEV Community. Developers of all levels are welcome to join and enhance our collective intelligence.

Saying a simple "thank you" can brighten someone's day. Share your gratitude in the comments below!

On DEV, sharing ideas eases our path and fortifies our community connections. Found this helpful? Sending a quick thanks to the author can be profoundly valued.

Okay