Loading...

JavaScript Array Search

stamps holds oak, then elm, then another oak. The drawer stays this size while you look a value up.

One question, not a tour

forEach already visited every song, and that call came back undefined. Here you name one stamp. The drawer does not grow or shrink.

Four shapes of answer

Pick the method from the kind of answer you need.

📊 What each lookup returns

Method The question What comes back A miss
indexOf first matching slot an index -1
lastIndexOf last matching slot an index -1
includes is the value stored true or false false
find item that passes a test the item undefined

Slot numbers come from indexOf and lastIndexOf. includes and find do not hand you a slot.

Front match

Ask where the first oak sits.

First oak

javascript 
let stamps = ["oak", "elm", "oak"];
let slot = stamps.indexOf("oak");
console.log(slot);

The log is 0. The second oak is left out of this result.

Missing pine

javascript 
let stamps = ["oak", "elm", "oak"];
let slot = stamps.indexOf("pine");
console.log(slot);
console.log(stamps.length);

pine is absent. The log is -1. Length stays 3, so a miss is not a deletion.

Last oak

javascript 
let stamps = ["oak", "elm", "oak"];
let slot = stamps.lastIndexOf("oak");
console.log(slot);

The log is 2. That slot is the later oak, not the one at the front.

Yes or no

javascript 
let stamps = ["oak", "elm", "oak"];
console.log(stamps.includes("elm"));
console.log(stamps.includes("pine"));

elm logs true. pine logs false, and false is not -1.

The stamp itself

javascript 
let stamps = ["oak", "elm", "oak"];
let hit = stamps.find(function (name) {
return name === "elm";
});
console.log(hit);
let miss = stamps.find(function (name) {
return name === "pine";
});
console.log(miss);

The first log is the string elm. The second log is undefined. A failed test is not a slot number.

Write the slot

Show the first oak slot as text. When the lookup is -1, show the word missing.

Page demo — slot or missing

html 
<!DOCTYPE html>
<html>
<head>
<title>array-search — page</title>
</head>
<body>
<p id="slot">…</p>
<script>
let stamps = ["oak", "elm", "oak"];
let slot = stamps.indexOf("oak");
let line = "missing";
if (slot !== -1) {
line = String(slot);
}
let box = document.getElementById("slot");
box.textContent = line;
</script>
</body>
</html>

The paragraph reads 0. Search for pine and refresh, and the paragraph reads missing.

Run the lookups

  1. Log the first oak slot and expect 0
  2. Log a pine lookup and expect -1 while length stays 3
  3. Log the last oak slot and expect 2
  4. Log whether elm is present and whether pine is present
  5. Find elm, then pine, and set the string beside undefined
  6. Read the paragraph, search for pine, and refresh

Easy to mix up

  • Treating -1 as a slot you can read
  • Reading true or false as if it were an index
  • Expecting find to hand back 1 for elm
  • Reaching for forEach when you only need a yes or no
  • Matching a different type or a different letter case
  • Writing if (slot) when 0 is a real hit

Keep these apart

  • First match or -1 comes from indexOf
  • Last match or -1 comes from lastIndexOf
  • Yes or no comes from includes
  • The stamp or undefined comes from find
  • A miss leaves length alone
  • Dates come next

🧠 Test Your Knowledge

Ready to Start

Test Your Knowledge

Challenge yourself with this interactive quiz and see how well you understand the topic

❓
8
Questions
🎯
70%
To Pass
♾️
∞
Time
🔄
∞
Attempts

📝 Instructions

  • Read each question carefully
  • Select the best answer for each question
  • You can retake the quiz as many times as you want
  • Your progress will be shown at the top
Topic 41 of 41
Javascript Tutorial