VIDEO LESSON

JavaScriptのArray.prototype.some()の使い方：引数・戻り値・実例と注意点の解説動画

再生時間 8:09動画を別のタブで開く ↗

動画の字幕・文字起こしを読む

再生中の字幕を濃い黒で表示し、一番上に追従します。字幕の行を選ぶと、その位置から再生できます。

0:00こんにちは。
0:01今回はサムを紹介します。
0:03これは、配列の中に、決めた条件を満たす要素が一つでもあるかどうかを調べるメソッドです。
0:10一つでも条件を満たせばトゥルー、一つもなければフォルスが返ります。
0:16たとえば、在庫がゼロの商品があるかどうか、エラーが一件でも含まれているかどうか、
0:21といった存在チェックの場面で役立ちます。
0:26この動画では、書き方と引数、戻り値、記事の基本例、コールバックの引数、未成年がいるかの実例、
0:34よく似たエブリーとの違い、そして空配列や非同期判定の注意点まで、実行結果と一緒に学びます。
0:42一つでもあるか、という言葉が鍵になるメソッドです。
0:46まず動作環境を確認します。
0:48記事の互換性情報では、クロームでは一以降、エッジでは十二以降、ファイアーフォックスでは一・五以降、
0:54サファリでは三以降で使えます。
1:00ノード・ジェイエスではゼロ・一〇・ゼロ以降に対応しています。
1:05これらの数値はエムディーエヌの互換性データに基づく目安です。
1:10サムは古くからある基本的な機能で、現在の主要な環境では広く使えます。
1:17追加の読み込みは不要で、配列に最初から関数として備わっていることを、実機で確認済みです。
1:24対応開始の版は、推奨版という意味ではない点にも注意しましょう。
1:30前回学んだエブリーと対応環境は同じで、セットで覚えやすいメソッドでもあります。
1:37書き方を確認します。
1:39対象の配列に続けてサムと書き、カッコの中に、条件を判定する関数を渡します。
1:45リファレンス名にあるプロトタイプは、実際の呼び出しで毎回書く必要はありません。
1:52この判定する関数をコールバックと呼び、要素ごとに自動で呼び出されます。
1:58第二引数として、判定の中で使うディスを指定する値も渡せますが、通常は省略します。
2:05戻り値は、一つでも条件を満たす要素があればトゥルー、なければフォルスです。
2:12配列そのものや該当する要素が返るわけではなく、あるかないかだけが返る点が特徴です。
2:19まずは、この基本の形を押さえましょう。
2:22記事の基本例を見ます。
2:24三、ゼロ、八という、三つの商品の在庫数が入った配列があります。
2:29この配列にサムを呼び、ゼロと等しいかどうかを判定する処理を渡します。
2:35実行するとトゥルーが表示され、記事の期待出力と一致し、ノードの実機結果とも一致しました。
2:42二番目に在庫ゼロの商品があるため、在庫切れが一件でもある、という結果です。
2:48もし在庫が三、五、八のようにゼロが一つもなければ、結果はフォルスに変わることも実機で確認しています。
2:57どの商品かまで知りたい場合は、要素そのものを返すファインドへの切り替えが記事でも勧められています。
3:05コールバックが受け取る引数を詳しく見ます。
3:09第一引数は今判定している要素の値、第二引数はゼロ始まりの位置、第三引数は対象の配列そのものです。
3:17スライドの例では、エーとビーの配列で、値と位置と長さを表示しながら、あえて常にフォルスを返して最後まで進む様子を実機で確認しました。
3:29必要な引数だけを受け取ればよく、多くの場合は値だけを使うのが一般的です。
3:36判定の中でトゥルー相当の値を返すかどうかで結果が決まるため、リターンし忘れると、
3:42該当があってもフォルスになる点にも注意してください。
3:48引数の順番は、値、位置、配列、と決まっています。
3:52実例として、未成年の有無の確認を見ます。
3:55二十歳、二十五歳、十九歳の三人について、十八歳未満の人がいるかどうかをサムで判定します。
4:02実行するとフォルスになり、未成年は一人もいないことが分かります。
4:07次に、二人目を十七歳に変えた配列で同じ判定をすると、今度はトゥルーになります。
4:14どちらも実機で確認しました。
4:16このようにサムは、条件に当てはまる人がいるか、異常な値が混ざっているか、
4:20といった存在の確認に向いています。
4:25エラーの有無、未対応の項目の有無、在庫切れの有無など、一件でもあれば対応が必要な場面で、
4:29そのまま使える形です。
4:34記事の境界例で、空配列の扱いを確かめます。
4:37要素が一つもない配列にサムを呼ぶと、条件を満たす要素が存在しないため、結果はフォルスになります。
4:45スライドの一行目が記事の例で、実機でもフォルスでした。
4:49これは前回のエブリーと対照的です。
4:52エブリーは空配列でトゥルーでしたが、サムは空配列でフォルスになります。
4:57あわせてスライドの二行目では、一、三、五という奇数だけの配列で偶数があるかを調べ、
5:03該当なしのためフォルスになることも確認しました。
5:08空の場合と該当なしの場合、どちらもフォルスになる、とセットで覚えておきましょう。
5:14よく似たエブリーとの違いを整理します。
5:17サムは、一つでも条件を満たす要素があればトゥルーになります。
5:22一方エブリーは、全ての要素が条件を満たすときにトゥルーになります。
5:27スライドの例では、二、三、四という配列で、偶数かどうかを判定しています。
5:32偶数が一つでもあるためサムはトゥルーですが、三という奇数が混ざるためエブリーはフォルスになり、
5:37どちらも実機で確認しました。
5:41該当があるかを確認したいならサム、全員が満たすかを確認したいならエブリー、
5:45と問いの立て方で選んでください。
5:49空配列の結果も、サムはフォルス、エブリーはトゥルーと正反対なので、あわせて覚えると混乱しにくくなります。
5:57注意点の第一は、判定が途中で終わることです。
6:01サムは、条件を満たす要素が見つかった時点で、残りの要素を判定せずにトゥルーを返します。
6:08スライドの例では、五、十二、八、三十のうち、二番目の十二が十以上のため、
6:14コールバックは二回だけ呼ばれて終わり、八と三十は判定されませんでした。
6:19実機でも、結果はトゥルー、回数は二と確認しました。
6:24これは無駄な処理を省く効率のよい仕様ですが、全ての要素に必ず処理を実行したい場合は、
6:29サムではなくフォーイーチなどを選んでください。
6:34途中で終わる前提を理解しておくことが大切です。
6:38記事が注意する仕様を確認します。
6:40非同期関数、つまりアシンク関数を判定に渡すと、その関数は結果ではなくプロミスという値をすぐ返します。
6:48プロミスはトゥルー相当の値として扱われるため、条件が実際には成り立たなくても、
6:52サムはトゥルーを返してしまいます。
6:56スライドの例では、十より大きい要素がない配列でもトゥルーになり、実機で確認しました。
7:02非同期の判定を待ちたい場合は、サムでは対応できないため、別の書き方を検討してください。
7:09あわせて、空きのある配列では空き位置でコールバックが呼ばれない点も、エブリーと同じ注意点として覚えておきましょう。
7:17まとめです。
7:18サムは、配列の中に条件を満たす要素が一つでもあるかどうかを判定し、トゥルーかフォルスを返すメソッドです。
7:27ポイントは三つです。
7:28まず、コールバックは値と位置と配列を受け取り、要素ごとに判定すること。
7:34次に、条件を満たす要素が見つかれば、その時点でトゥルーとなり判定が終わること。
7:41そして、空配列ではフォルスになり、非同期関数を渡しても結果を待たないことです。
7:47どの要素が該当するかまで必要なときはファインドに切り替えてください。
7:53まずは記事の基本例と境界例を実行し、結果を予測してから確かめてみてください。
7:59お疲れさまでした。
8:01一つでもか、全てか、と問いを言葉で区別できるようになれば、エブリーとの使い分けも自然に身につきます。

日本語字幕をダウンロード（WebVTT）

この動画で学べること

Array.prototype.some()で条件を満たす要素が1つでもあるか調べる方法を解説。引数と戻り値、実行結果付きのコード、間違えやすい点、ブラウザー・Node.js対応を確認できます。

解説記事・サンプルコードを読む：JavaScriptのArray.prototype.some()の使い方：引数・戻り値・実例と注意点 →