Skip to main content

Working with collections

JavaScript Arrays: Methods, Immutability, and Patterns

Choose an array method from the output you need: transform, select, locate, test, or combine values without hiding the data flow.

JavaScriptbeginner4 min readJavaScript fundamentals

Learning overview

Estimated time
4 minutes
Difficulty
Beginner
Prerequisites
No prior experience required
Learning outcome
Explain javascript using a clear mental model · Apply javascript in practical JavaScript work
Last updated
July 18, 2026

Use arrays for ordered collections

Arrays are objects specialized for indexed values and a length. Indexes begin at zero. Use them when order and iteration matter; use an object or Map when named lookup is the primary relationship.

Choose methods by result

Map returns one transformed item for each input, filter returns matching items, find returns the first match, some and every return booleans, and reduce combines a collection into another value.

array-methods.js
const lessons = [
  { title: "Variables", minutes: 12, complete: true },
  { title: "Arrays", minutes: 18, complete: false },
];

const remaining = lessons.filter((lesson) => !lesson.complete);
const titles = remaining.map((lesson) => lesson.title);
const totalMinutes = lessons.reduce((sum, lesson) => sum + lesson.minutes, 0);

Make updates explicit

Spread, slice, map, and filter create new arrays but only copy one level. Nested objects remain shared unless they are copied too. Sort mutates the array; use toSorted when supported or copy before sorting.

immutable-update.js
const updated = lessons.map((lesson) =>
  lesson.title === "Arrays"
    ? { ...lesson, complete: true }
    : lesson
);

const byDuration = lessons.toSorted((a, b) => a.minutes - b.minutes);

Frequently asked questions

What is the difference between map and forEach?

Map returns a new array of transformed values. ForEach returns undefined and is appropriate for deliberate side effects.

Does spread make a deep copy of an array?

No. It creates a shallow array copy. Nested objects and arrays still refer to the same values unless copied separately.

Topic graph

A taxonomy-generated path through this subject.

  1. JavaScript
  2. JavaScript fundamentals
  3. javascript
  4. arrays
  5. data-structures
  6. immutability
  7. What Is JavaScript in Programming?
  8. Learn JavaScript: From Fundamentals to Web Applications
  9. JavaScript Tutorial: Build a Filterable Task List

Recommended automatically from shared technologies, topics, intent, and difficulty.

Hand-picked companion pages that deepen this topic.

Your next steps

Continue learning

  1. 1glossaryWhat Is JavaScript in Programming?
  2. 2guidesLearn JavaScript: From Fundamentals to Web Applications
  3. 3guidesJavaScript Tutorial: Build a Filterable Task List
  4. 4cheatsheetsJavaScript Cheatsheet: Syntax, Collections, DOM, Async