---
type: reference
language: javascript
slug: array/find
title: "Array.prototype.find()"
title_tag: "JavaScript find() の使い方 — 最初の1件を取り出す"
summary: >
  find() は条件に合う最初の要素を返します。見つからなければ undefined です。
  途中で止まること、空振りの扱い、findIndex や filter との違いを実行して確かめます。
description: >
  最初に見つかった要素を返し、無ければ undefined です。位置が要るときの findIndex、後ろから探す findLast、NaN が indexOf で見つからない理由まで扱います。
status: published
difficulty: 2
minutes: 7

versions:
  verified: "Node 22.22.3"
  since: "ES6"
  deprecated: null
  removed: null

sources:
  - title: "Array.prototype.find — ECMAScript® 2026 Language Specification"
    url: "https://tc39.es/ecma262/#sec-array.prototype.find"
  - title: "Array.prototype.find() — MDN"
    url: "https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/find"

terms: [コールバック関数, undefined, 短絡評価]

links:
  related:
    - javascript/reference/array/filter
    - javascript/errors/cannot-read-properties-of-undefined
    - javascript/reference/array/includes

content_updated_at: 2026-09-08
published_at: 2026-09-07
---

`find()` は、条件に合う[key:最初の1件]を返します。
見つからなければ `undefined` です。[bad:例外は投げません]。

```js run
const users = [
  { id: 1, name: 'あかり' },
  { id: 2, name: 'ゆうと' },
];

console.log(users.find(u => u.id === 2));
console.log(users.find(u => u.id === 9));
```
```output
{ id: 2, name: 'ゆうと' }
undefined
```

上のコードは書き換えて実行できます。`u.id === 9` を `u.id === 1` にしてみてください。

## 何が返るのか

| | 中身 |
|---|---|
| 戻り値 | 条件に合った[key:要素そのもの]（配列ではない） |
| 見つからないとき | `undefined`（`null` でも空配列でもない） |
| 元の配列 | [em:変わらない] |
| どこまで見るか | [em:見つかった時点で止まる] |

## 見つかったところで止まる

最後まで見ません。実際に数えて確かめます。

```js run
const nums = [1, 2, 3, 4, 5];
let calls = 0;

const found = nums.find((n) => {
  calls++;
  return n === 2;
});

console.log(found);
console.log('呼ばれた回数:', calls);
```
```output
2
呼ばれた回数: 2
```

[num:5]件あるのに[num:2]回しか呼ばれていません。これを[type:短絡評価]と呼びます。
**要素が多いほど効きます。**

## 空振りに必ず備える

`find()` を使うときに[key:いちばん多い事故]がこれです。

```js bad
const users = [{ id: 1, name: 'あかり' }];

const user = users.find(u => u.id === 2);

console.log(user.name);
```
```output
TypeError: Cannot read properties of undefined (reading 'name')
```

`undefined` にプロパティは無いので落ちます。
**見つからなかったときにどうするかを、その場で決めてください。**

```js run
const users = [{ id: 1, name: 'あかり' }];

const user = users.find(u => u.id === 2);

console.log(user?.name);
console.log(user?.name ?? '（未登録）');
console.log(user ? user.name : '見つかりません');
```
```output
undefined
（未登録）
見つかりません
```

詳しい直しかたは
[Cannot read properties of undefined](/ja/javascript/errors/cannot-read-properties-of-undefined/) にあります。

## 位置が欲しいときは findIndex

要素そのものではなく[key:何番目か]が欲しいときに使います。
見つからないときは `-1` です。

```js run
const fruits = ['りんご', 'みかん', 'ぶどう'];

console.log(fruits.findIndex(f => f === 'みかん'));
console.log(fruits.findIndex(f => f === 'かき'));
```
```output
1
-1
```

**`-1` は falsy ではありません。** `if (i)` で判定すると[bad:見つかったことになってしまいます]。

```js bad
const fruits = ['りんご', 'みかん'];

const i = fruits.findIndex(f => f === 'かき');

if (i) {
  console.log('見つかった扱いになる:', i);
}
```
```output
見つかった扱いになる: -1
```

`if (i !== -1)` と書いてください。
[dim:0 番目に見つかった場合も if (i) では falsy になるため、二重に間違えます。]

## 似ているものとの違い

```js run
const nums = [1, 2, 3, 2];

console.log(nums.find(n => n === 2));
console.log(nums.findIndex(n => n === 2));
console.log(nums.findLast(n => n === 2));
console.log(nums.filter(n => n === 2));
console.log(nums.includes(2));
console.log(nums.indexOf(2));
```
```output
2
1
2
[ 2, 2 ]
true
1
```

| | 何を返すか | 見つからないとき | 条件を書けるか |
|---|---|---|---|
| `find()` | 最初の[type:要素] | `undefined` | [em:書ける] |
| `findIndex()` | 最初の[type:位置] | `-1` | [em:書ける] |
| `findLast()` | 最後の[type:要素] | `undefined` | [em:書ける] |
| `filter()` | [type:配列]（全部） | [type:空配列] | [em:書ける] |
| `includes()` | [type:真偽値] | `false` | [bad:値の一致だけ] |
| `indexOf()` | 最初の[type:位置] | `-1` | [bad:値の一致だけ] |

「あるかどうか」だけ知りたいなら
[includes()](/ja/javascript/reference/array/includes/) のほうが意図が伝わります。
[filter()](/ja/javascript/reference/array/filter/) は[em:全部]要るときに使います。

## 穴のある配列でも呼ばれる

`map()` や `filter()` は[type:疎な配列]の穴を[bad:飛ばします]が、`find()` は[key:飛ばしません]。
穴を `undefined` として関数に渡します。

```js run
const sparse = [1, , 3];
let calls = 0;

sparse.find(() => { calls++; return false; });
console.log('find     :', calls);

calls = 0;
sparse.filter(() => { calls++; return false; });
console.log('filter   :', calls);
```
```output
find     : 3
filter   : 2
```

`find()` は[num:3]回、`filter()` は[num:2]回です。
**穴を「値が無い場所」と見るか「undefined がある場所」と見るかが違います。**

[dim:ふだん穴のある配列は作りませんが、length に代入したときなどにできます。]

## 後ろから探す

`findLast()` と `findLastIndex()` は、[key:末尾から]探します（ES2023）。

```js run
const nums = [1, 5, 3, 5, 2];

console.log(nums.find((n) => n === 5));
console.log(nums.findIndex((n) => n === 5));
console.log(nums.findLast((n) => n === 5));
console.log(nums.findLastIndex((n) => n === 5));
```
```output
5
1
5
3
```

値は同じでも、**見つかった位置が違います。**
「最後に更新されたもの」「いちばん新しい記録」を取りたいときに使います。

見つからないときの返り値は、前から探すときと同じです。

```js run
const nums = [1, 5, 3];

console.log(nums.findLast((n) => n === 9));
console.log(nums.findLastIndex((n) => n === 9));
```
```output
undefined
-1
```

[dim:Node 20 / Chrome 97 / Safari 15.4 より前の環境では使えません。]

## `NaN` は `indexOf()` で見つからない

```js run
const nums = [1, NaN, 3];

console.log(nums.indexOf(NaN));
console.log(nums.findIndex(Number.isNaN));
console.log(nums.includes(NaN));
```
```output
-1
1
true
```

`indexOf()` は `===` で比べるので、[bad:`NaN` を見つけられません]。
`findIndex()` に `Number.isNaN` を渡すか、あるかどうかだけなら `includes()` を使います。

→ [なぜ NaN === NaN は false なのか](/ja/javascript/why/nan-equality/)

## まとめ

- `find()` は[key:最初に見つかった要素]。無ければ `undefined`
- `findIndex()` は位置。無ければ[num:-1]
- **`undefined` は「無かった」とは限らない。** 位置が要るなら `findIndex()`
- 見つかった時点で[em:止まる]。全部見たいなら `filter()`
- 後ろから探すなら `findLast()` / `findLastIndex()`
- `NaN` を探すなら `indexOf()` ではなく `findIndex(Number.isNaN)`