THE JAVASCRIPT FIELD GUIDE

Lesson 9.3 · Arrays Interactive article

Searching arrays

Find items and positions by exact value or by a callback condition with indexOf, includes, find, findLast, some, and every.

13 min + experimentsBeginner to intermediateBy Shrikanth PSUpdated Sep 28, 2026How this lesson was made

By the end you can

01
Pick exact-value methodsUse indexOf, lastIndexOf, and includes without falling for NaN, object-reference, or index 0 bugs.
02
Search with callbacksUse find, findIndex, findLast, and findLastIndex when the match is a condition.
03
Ask yes/no questionsChoose some and every, and explain their short-circuit and empty-array behavior.

What searching an array means

Searching an array means asking, “where is the item I care about?” or “does any item have the shape I need?” Arrays are ordered, so JavaScript can scan them from left to right, from right to left, or until a callback says the search is finished.

The curriculum summary for this lesson is short and important: arrays let you find items and positions by value or by condition. A value search is like looking for the exact string "draft". A condition search is like looking for the first product whose price is above 20, even if you do not know that product object ahead of time.

Real-life analogySearching a bookshelf

Imagine a shelf of books. If you know the exact title, you can scan from the left and say, “it is in slot 3,” or “not on the shelf.” If you only care whether it exists, you can answer yes or no. If the question is “show me the first book written after 2010,” you need a test for each book. That is the difference between exact-value methods and callback methods.

In real life: Read titles from left to right: In JavaScript: indexOf scans indexes from 0 upward
In real life: Report the shelf position: In JavaScript: An index such as 2, or -1 for not found
In real life: Ask only “is it there?”: In JavaScript: includes returns true or false
In real life: Ask for the first book after 2010: In JavaScript: find uses a callback test

Where the analogy stops: A bookshelf title search is visual. JavaScript does exact comparisons and callback calls, so two identical-looking object literals are still different objects unless they are the same reference.

This lesson assumes you have met arrays, strict comparisons in the Comparisons lesson, object references in Objects & references, and callbacks in Function expressions & callbacks and Arrow functions. We will keep naming those ideas as they appear.

indexOf, lastIndexOf & includes

EXACT VALUE

Use indexOf, lastIndexOf, and includes when you already have the exact value you are looking for. They do not call your function. They compare the search value to array items.

array.indexOf(value) returns the first index, or -1.
array.lastIndexOf(value) returns the last index, or -1.
array.includes(value) returns true or false.

Exact-value searchingPop out in the code editor (opens in a new tab)JavaScript

1const codes = ["A1", "B2", "A1", NaN];2const firstA1 = codes.indexOf("A1");3const lastA1 = codes.lastIndexOf("A1");4const hasNaN = codes.includes(NaN);5const nanIndex = codes.indexOf(NaN);6 7const saved = { id: 1 };8const objects = [saved, { id: 1 }];9const sameReference = objects.indexOf(saved);10const newObject = objects.indexOf({ id: 1 });11 12console.log(firstA1, lastA1, hasNaN, nanIndex);13console.log(sameReference, newObject);

Read the first half first. The string "A1" appears at indexes 0 and 2, so indexOf("A1") is 0 and lastIndexOf("A1") is 2. Both methods use -1 as the “not found” value because 0 is a real index.

Now the famous edge case: NaN never equals itself with strict equality. That is why indexOf(NaN) is -1. includes uses a slightly different sameness rule called SameValueZero, so includes(NaN) is true.

Objects bring the reference rule from Objects & references. Two object literals can look identical and still be different objects. Searching for the saved reference works; searching for a brand-new { id: 1 } does not find the earlier object.

fromIndex starts the scan

These methods also accept a starting position: names.indexOf("Ada", 2), names.lastIndexOf("Ada", 3), and names.includes("Ada", 2). Positive numbers skip earlier items. Negative numbers count from the end before the scan begins. The array is not changed.

Strings have methods with similar names, such as "banana".indexOf("na") and "banana".includes("na"). This lesson is about array methods; the String methods lesson revisits text-specific searching.

find & findIndex

STEP THROUGH

Exact-value search is not enough for real data. You often have an array of objects and a condition: first out-of-stock product, first expensive invoice, first user with a missing profile. That is when you use a callback.

find(callback) returns the first item whose callback returns a truthy value, or undefined.
findIndex(callback) returns the first matching index, or -1.

Real-life analogyFind is asking a librarian

With find, you stop describing the exact item and start describing the test. JavaScript asks your callback about each item in order. The first time the callback says yes, the search is done.

In real life: “Show me the first book after 2010”: In JavaScript: books.find(book => book.year > 2010)
In real life: The librarian checks one book at a time: In JavaScript: The callback receives one item at a time
In real life: The first matching book is handed to you: In JavaScript: find returns the item itself

Where the analogy stops: A librarian understands meaning. JavaScript only knows the exact boolean result your callback returns for each item.

Step through the recording. Change the condition and notice two details: the callback gets one product at a time, and find stops as soon as the answer is known.

Step 0 of 8Ready

Your turn: follow the blue line

Predict which product is the first match. Then step through the real callback calls and watch where find stops.

Running in

script

Next: line 1

Click the blue line to take the next stepPop out in the code editor (opens in a new tab)JavaScript

2  { name: "Tea", price: 8, inStock: true },3  { name: "Tent", price: 55, inStock: false },4  { name: "Torch", price: 24, inStock: true },5];6 7const match = products.find((product) => {8  return product.price > 20;9});10 11console.log(match?.name);

CallStoreChangeResultRun = next line. Ran = already executed.

Recent returnsNothing yet. Start with the blue line.

Search conditionprice > 20product.price > 20!inStock!product.inStockname starts with "T"product.name.startsWith("T")

Changing the condition starts a fresh recording. Predict where find stops before stepping again.

A guided replay recorded from real JavaScript calls, not an engine debugger. Step follows executed statements; Back reviews a snapshot. Reset starts a fresh run.

Current searchPop out in the code editor (opens in a new tab)JavaScript

1const products = [2  { name: "Tea", price: 8, inStock: true },3  { name: "Tent", price: 55, inStock: false },4  { name: "Torch", price: 24, inStock: true },5  { name: "Notebook", price: 12, inStock: false },6];7products.find((product) => product.price > 20);

Real result2 calls

resultTent

visitedTea → Tent

Teain stock

price$8

Tentout

price$55

Torchin stock

price$24

Notebookout

price$12

Try it yourself

Method:Condition:

find returned Tent after 2 callback calls. Visited: Tea → Tent.

The result is computed by real array methods. Notice how filter visits every item and returns all matches, while find stops at the first match.

The lab includes filter only for contrast. The next array lesson, map, filter & reduce, covers it properly. Remember the difference now: find returns the first match; filter returns all matches in a new array.

findLast & findLastIndex

ES2023

Sometimes the best answer is nearest the end: the latest error in a log, the most recent unpaid invoice, the last message from a person. findLast and findLastIndex run the same kind of callback as find, but they search from right to left.

findLast and findLastIndexPop out in the code editor (opens in a new tab)JavaScript

1const logs = ["info", "error", "warn", "error"];2const lastError = logs.findLast((entry) => entry === "error");3const lastErrorIndex = logs.findLastIndex((entry) => entry === "error");4 5console.log(lastError);6console.log(lastErrorIndex);7console.log(typeof Array.prototype.findLast === "function");

Outputright to left

lastErrorerror

lastErrorIndex3

supportedtrue

Try it yourself

Feature check: available

The last error is error at index 3. This browser says findLast support is true.

findLast and findLastIndex are ES2023 methods. Modern browsers support them broadly; feature checking is still easy.

These methods are newer ES2023 additions and are broadly available in modern browsers. When you support older environments, feature-check with typeof Array.prototype.findLast === "function" or use a build step/polyfill strategy chosen by your project.

some & every

BOOLEAN

Not every search needs the item or the index. Sometimes the question is yes/no: “is there at least one?” or “do all of them?”

some(callback) returns true as soon as one callback result is truthy.
every(callback) returns false as soon as one callback result is falsy.

Real-life analogyA school attendance register

A teacher can stop reading once one student is absent. To say everyone is present, every name must pass the check. One question needs one yes; the other needs no no answers.

In real life: Is anyone absent?: In JavaScript: students.some(student => student.absent)
In real life: Is everyone present?: In JavaScript: students.every(student => student.present)
In real life: Stop as soon as the answer is known: In JavaScript: Both methods short-circuit

Where the analogy stops: A register can be incomplete. JavaScript only answers for items in the array.

some and everyPop out in the code editor (opens in a new tab)JavaScript

1const scores = [84, 91, 77];2const hasPerfect = scores.some((score) => score === 100);3const allPassing = scores.every((score) => score >= 60);4 5const none = [];6console.log(hasPerfect);7console.log(allPassing);8console.log(none.some(Boolean));9console.log(none.every(Boolean));

Outputbooleans

some perfect?false

all passing?true

[].some(Boolean)false

[].every(Boolean)true

Try it yourself

some asks at least one; every asks all.

The scores have no perfect score (false) and all pass (true). On an empty array, some is false and every is true.

some stops at the first true callback result. every stops at the first false callback result.

The empty-array results feel strange at first. [].some(Boolean) is false because there is no passing item. [].every(Boolean) is true because there is no failing item. Mathematicians call that vacuous truth; in plain English, “all items pass” is not contradicted by any item when the list is empty.

Which method answers this question?

INTERACTIVE

Array search methods at a glance
Method	Returns	Best for	Stops early?
`indexOf(value)`	First index, or `-1`	Exact value search with strict equality-style matching	No callback
`lastIndexOf(value)`	Last index, or `-1`	Exact value search from the right	No callback
`includes(value)`	Boolean	Exact membership, including `NaN`	No callback
`find(callback)`	Item, or `undefined`	First item that passes a test	Stops at first true
`findIndex(callback)`	Index, or `-1`	Position of first item that passes	Stops at first true
`findLast(callback)`	Item, or `undefined`	Last item that passes	Searches right to left
`findLastIndex(callback)`	Index, or `-1`	Position of last item that passes	Searches right to left
`some(callback)`	Boolean	At least one item passes	Stops at first true
`every(callback)`	Boolean	All items pass	Stops at first false

Sort the questions by the kind of answer they need. This is the most practical skill: before typing a method name, decide whether you need an exact value, a first match, a last match, or only a boolean.

Does roles contain the exact string admin?
Give me the first product with price > 100.
Where is the first product with price > 100?
Show the most recent log entry whose level is error.
What position holds the most recent error log?
Is any product out of stock?
Did every score pass?
Where is the exact string draft in statuses?

Try it yourself

0 of 8 correct

Sort by the kind of answer you need. Each card's explanation names a good method.

Choose a category for every card. You can change an answer at any time; Reset clears them all.

Where you’ll use this

Array search methods show up anywhere a page holds a list of real data. A shopping cart checks whether an item is already present before adding another row. A settings page finds the first invalid field. A dashboard looks for the latest error. A permissions check asks whether a user has one required role or every required role.

Practical pattern

Start the variable name with the question you are asking: has or is often pairs with some, all with every, first with find, and last with findLast.

These methods do not mutate the array. They inspect it and return an answer. Later lessons cover methods that produce transformed arrays, sort arrays, or copy arrays safely.

Common misconceptions

“indexOf is a safe boolean check.”

No. indexOf returns a number. Index 0 is falsy and -1 is truthy, so if (arr.indexOf(x)) is wrong in both directions. Use includes or compare with !== -1.

“find returns all matches.”

find returns the first matching item. Use filter when you need all matches; that is the headline contrast with the next lesson.

“Object literals with the same properties are equal.”

Arrays compare objects by reference for exact searches. Search for the saved object reference, or use find(obj => obj.id === 1) when you mean “same id.”

“every on an empty array should be false.”

It is true. every looks for a counterexample. An empty array has no item that fails the test.

“findLast is a different kind of callback.”

It uses the same callback idea as find; only the direction changes. It starts at the final index and moves left.

Practice: search arrays on purpose

5 EXERCISES

Exercise 1 · Warm-upPredict the NaN search

Predict both lines before you run the code.

Starter codePop out in the code editor (opens in a new tab)JavaScript

const values = [NaN, "NaN", NaN];
console.log(values.indexOf(NaN));
console.log(values.includes(NaN));

Exercise 2 · PracticeFind the first out-of-stock product

Which product name prints?

Starter codePop out in the code editor (opens in a new tab)JavaScript

const products = [
  { name: "Tea", inStock: true },
  { name: "Tent", inStock: false },
  { name: "Torch", inStock: true },
];
const match = products.find((product) => !product.inStock);
console.log(match.name);

Solution

One way to solve itPop out in the code editor (opens in a new tab)JavaScript

const products = [
  { name: "Tea", inStock: true },
  { name: "Tent", inStock: false },
  { name: "Torch", inStock: true },
];
const match = products.find((product) => !product.inStock);
console.log(match.name);

find tests Tea first, then Tent. Tent is the first product where !product.inStock is true, so the printed name is Tent.

Exercise 3 · PracticeCheck that every score passes

What boolean does the program print?

Starter codePop out in the code editor (opens in a new tab)JavaScript

const scores = [72, 88, 61];
console.log(scores.every((score) => score >= 60));

Solution

One way to solve itPop out in the code editor (opens in a new tab)JavaScript

const scores = [72, 88, 61];
console.log(scores.every((score) => score >= 60));

All three scores are at least 60, so every returns true.

Exercise 4 · ChallengeFind the last error in a log

Which message prints?

Starter codePop out in the code editor (opens in a new tab)JavaScript

const logs = [
  { level: "info", message: "ready" },
  { level: "error", message: "timeout" },
  { level: "error", message: "retry failed" },
];
const latest = logs.findLast((entry) => entry.level === "error");
console.log(latest.message);

Solution

One way to solve itPop out in the code editor (opens in a new tab)JavaScript

const logs = [
  { level: "info", message: "ready" },
  { level: "error", message: "timeout" },
  { level: "error", message: "retry failed" },
];
const latest = logs.findLast((entry) => entry.level === "error");
console.log(latest.message);

Searching from the right finds the final error object first, so the message is retry failed.

Exercise 5 · ChallengeFix the indexOf truthiness bug

The code should print allowed, because admin is present at index 0. Replace the condition with a safe one.

Starter codePop out in the code editor (opens in a new tab)JavaScript

const roles = ["admin", "editor"];

if (roles.indexOf("admin")) {
  console.log("allowed");
}

Solution

One way to solve itPop out in the code editor (opens in a new tab)JavaScript

const roles = ["admin", "editor"];
if (roles.indexOf("admin") !== -1) {
  console.log("allowed");
}

The fixed condition treats the return value correctly. includes is even clearer when you only need a boolean.

Quiz: check your understanding

7 QUESTIONS

Try each answer before reading the explanations. Many wrong answers name a real bug.

Lesson quiz · 7 questionsScore: first tries count

Question 1 of 7What do indexOf and lastIndexOf print?
Read the code, then predictPop out in the code editor (opens in a new tab)JavaScript
```
const letters = ["a", "b", "a"];
console.log(letters.indexOf("a"));
console.log(letters.lastIndexOf("a"));
```
Choose an answer to see the explanation.
Question 2 of 7Which method should check whether an array contains NaN?
Choose an answer to see the explanation.
Question 3 of 7What does find print for prices?
Read the code, then predictPop out in the code editor (opens in a new tab)JavaScript
```
const products = [{ price: 10 }, { price: 30 }, { price: 50 }];
console.log(products.find((product) => product.price > 20).price);
```
Choose an answer to see the explanation.
Question 4 of 7Which method returns -1 when no callback match is found?
Choose an answer to see the explanation.
Question 5 of 7What do findLast and findLastIndex print?
Read the code, then predictPop out in the code editor (opens in a new tab)JavaScript
```
const logs = ["error", "warn", "error"];
console.log(logs.findLast((level) => level === "error"));
console.log(logs.findLastIndex((level) => level === "error"));
```
Choose an answer to see the explanation.
Question 6 of 7What do some and every print for an empty array?
Read the code, then predictPop out in the code editor (opens in a new tab)JavaScript
```
console.log([].some(Boolean));
console.log([].every(Boolean));
```
Choose an answer to see the explanation.
Question 7 of 7What is the bug in if (items.indexOf("apple"))?
Choose an answer to see the explanation.

Key takeaways

indexOf and lastIndexOf return indexes or -1; includes returns a boolean.
includes(NaN) works, while indexOf(NaN) does not.
Objects are compared by reference, so use callback methods when you mean “same property value.”
find and findIndex stop at the first callback match; findLast and findLastIndex search from the right.
some asks “at least one?” and every asks “all?”; both short-circuit.
Never write if (arr.indexOf(x)). Use includes or compare the index to -1.

Remember the one-liner.
Array search methods either compare an exact value, run a callback until a match is known, or return a yes/no answer.

Up next: map, filter & reduce.

CompleteFrontend Clear concepts. Working examples.

Searching arrays

What searching an array means

indexOf, lastIndexOf & includes

find & findIndex

findLast & findLastIndex

some & every

Which method answers this question?

Where you’ll use this

Common misconceptions

“indexOf is a safe boolean check.”

“find returns all matches.”

“Object literals with the same properties are equal.”

“every on an empty array should be false.”

“findLast is a different kind of callback.”

Practice: search arrays on purpose

Quiz: check your understanding

Key takeaways

Tuto

Hi, I'm Tuto

Give feedback