DEV Community

Cover image for JavaScript Quick Guide: Array Methods
Alfredo Pasquel
Alfredo Pasquel

Posted on

JavaScript Quick Guide: Array Methods

JavaScript provides a variety of powerful methods for efficiently manipulating arrays. In this post, we'll explore some of the most commonly used array methods and how they can streamline your JavaScript development.

  • forEach() The forEach() method is perfect for executing a function on each element in an array. It's commonly used for iterating over arrays.

const numbers = [1, 2, 3, 4];
numbers.forEach((num) => console.log(num * 2));
// Output: 2, 4, 6, 8

  • map() Transforms an array's elements and returns a new array. It applies a function to each element and returns a new array with the results.

const numbers = [1, 2, 3, 4];
const doubled = numbers.map((num) => num * 2);
console.log(doubled);
// Output: [2, 4, 6, 8]

  • filter() Creates a new array containing only the elements that meet a specific condition.

const numbers = [1, 2, 3, 4, 5];
const evens = numbers.filter((num) => num % 2 === 0);
console.log(evens);
// Output: [2, 4]

  • reduce() It accumulates values from an array into a single output. It iterates over the array and applies a reducer function to each element.

const numbers = [1, 2, 3, 4];
const sum = numbers.reduce((accumulator, currentValue) => accumulator + currentValue, 0);
console.log(sum);
// Output: 10

  • find() It returns the first matching element in an array or undefined if none is found.

const users = [
{ name: 'Alice', age: 25 },
{ name: 'Bob', age: 30 },
];
const user = users.find((user) => user.age > 25);
console.log(user);
// Output: { name: 'Bob', age: 30 }

  • some() and every() They check for conditions across array elements. some() returns true if at least one element satisfies the condition, while every() returns true only if all elements do.

const numbers = [1, 2, 3, 4];
const hasEven = numbers.some((num) => num % 2 === 0);
console.log(hasEven);
// Output: true

const allEven = numbers.every((num) => num % 2 === 0);
console.log(allEven);
// Output: false

  • sort() It sorts through an array in lexicographical order

const numbers = [4, 2, 5, 1, 3];
numbers.sort((a, b) => a - b);
console.log(numbers);
// Output: [1, 2, 3, 4, 5]

These JavaScript array methods will improve how your code handles data. If implemented properly they will make your code easier to read, streamlined and efficient. If you want to transform, sort, filter an array, or these types of things then these are the tools you'll need to get that done in JavaScript.

Sources:

  • Mozilla Developers Network:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array

SurveyJS custom survey software

Simplify data collection in your JS app with a fully integrated form management platform. Includes support for custom question types, skip logic, integrated CCS editor, PDF export, real-time analytics & more. Integrates with any backend system, giving you full control over your data and no user limits.

Learn more

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more