map, filter, and reduce cover the broadest transformations. But you often need to find a single item, test whether any or all elements match a condition, or reorder an array. These methods handle those cases.
find returns the first matching element
find searches through an array and returns the first element for which the callback returns a truthy value:
const users = [
{ id: 1, name: "Ada", active: true },
{ id: 2, name: "Grace", active: false },
{ id: 3, name: "Alan", active: true },
];
const user = users.find((u) => u.id === 2);
// { id: 2, name: "Grace", active: false }
If no element matches, find returns undefined:
const missing = users.find((u) => u.id === 99);
// undefined
find stops searching as soon as it finds a match — it does not scan the entire array unnecessarily.
findIndex returns the position instead
const index = users.findIndex((u) => u.id === 2);
// 1
If you need to remove or replace an element, findIndex gives you its position.
some tests whether at least one element matches
some returns true if the callback returns a truthy value for any element:
const numbers = [1, 2, 3, 4, 5];
numbers.some((n) => n > 4); // true
numbers.some((n) => n > 10); // false
Like find, some short-circuits — it stops as soon as it finds a match.
every tests whether all elements match
every returns true only if the callback returns a truthy value for every element:
const numbers = [2, 4, 6, 8];
numbers.every((n) => n % 2 === 0); // true — all even
numbers.every((n) => n > 3); // false — 2 is not > 3
every also short-circuits — it stops at the first failure.
An empty array returns true for every. This is called a “vacuous truth” — there are no elements that fail the test, so the test passes:
[].every(() => false); // true
sort reorders elements
sort rearranges the array in place and returns a reference to the same array:
const names = ["Charlie", "Alice", "Bob"];
names.sort();
// ["Alice", "Bob", "Charlie"]
The default sort converts to strings
Without a comparison function, sort converts elements to strings and compares them. This works for strings but produces wrong results for numbers:
const numbers = [10, 2, 1, 20];
numbers.sort();
// [1, 10, 2, 20] — sorted as strings, not numbers
Provide a comparison function for numbers
The comparison function receives two elements and should return:
- a negative number if the first should come before the second
- a positive number if the first should come after the second
0if their order does not matter
const numbers = [10, 2, 1, 20];
numbers.sort((a, b) => a - b);
// [1, 2, 10, 20] — correct numeric sort
numbers.sort((a, b) => b - a);
// [20, 10, 2, 1] — descending
Sorting objects by property
const products = [
{ name: "Laptop", price: 999 },
{ name: "Phone", price: 699 },
{ name: "Book", price: 15 },
];
products.sort((a, b) => a.price - b.price);
// [{ name: "Book", price: 15 }, { name: "Phone", price: 699 }, { name: "Laptop", price: 999 }]
toSorted is a non-mutating alternative (ES2023)
const numbers = [3, 1, 2];
const sorted = numbers.toSorted((a, b) => a - b);
// sorted: [1, 2, 3]
// numbers: [3, 1, 2] — unchanged
toSorted is available in modern environments. Check your target platforms before relying on it.
toReversed is a non-mutating alternative to reverse (ES2023)
const numbers = [1, 2, 3];
const reversed = numbers.toReversed();
// reversed: [3, 2, 1]
// numbers: [1, 2, 3] — unchanged
toSpliced is a non-mutating alternative to splice (ES2023)
const fruits = ["apple", "banana", "cherry", "date"];
// Remove 1 item at index 1
const withoutBanana = fruits.toSpliced(1, 1);
// ["apple", "cherry", "date"]
// fruits: unchanged
// Replace 1 item at index 1
const swapped = fruits.toSpliced(1, 1, "blueberry");
// ["apple", "blueberry", "cherry", "date"]
// fruits: unchanged
with replaces an element immutably (ES2023)
const colors = ["red", "green", "blue"];
const updated = colors.with(1, "yellow");
// ["red", "yellow", "blue"]
// colors: ["red", "green", "blue"] — unchanged
This is equivalent to [...colors]; updated[1] = "yellow" but in a single expression. It throws if the index is out of range, making it safer than direct assignment.
When to use each method
| Question | Method |
|---|---|
| Is at least one element matching? | some |
| Are all elements matching? | every |
| What is the first matching element? | find |
| What is the index of the first match? | findIndex |
| How do I reorder this array? | sort (mutates) or toSorted (copies) |
What to carry forward
findreturns the first match orundefinedsomereturnstrueif any element matches — short-circuitseveryreturnstrueif all elements match — short-circuits on first failuresortmutates the original array and sorts as strings by default- always provide a comparison function to
sortfor numbers - use
[...array].sort(...)to sort without mutating the original toSorted,toReversed,toSpliced, andwithare non-mutating alternatives introduced in ES2023- prefer the
to*methods when your environment supports them for cleaner immutable code
These methods complete the array toolkit. Combined with map, filter, and reduce, they cover essentially every array operation you will encounter.
Quick Check
One answerYou only need to know whether any item in the array matches a condition. Which method communicates that intent best?
Choose the best answer and use it to track your progress through the lesson.
Why that answer is correct
`some` returns a boolean answer to an any-match question. `find` returns the matching element itself.