カテゴリ: JavaScript 更新日: 2025/11/15

JavaScriptの文字列に特定の文字が含まれるか判定する方法(includes, indexOf)

JavaScriptの文字列に特定の文字が含まれるか判定する方法(includes, indexOf)
JavaScriptの文字列に特定の文字が含まれるか判定する方法(includes, indexOf)

先生と生徒の会話形式で理解しよう

生徒

「先生、JavaScriptで文字列の中に特定の文字が含まれているかどうかを調べる方法ってありますか?」

先生

「うん、JavaScriptではincludes()メソッドやindexOf()メソッドを使うことで、簡単に文字列の中に特定の文字が含まれているかを判定できます。」

生徒

「名前が似ているけど、どう違うんですか?」

先生

「どちらも似た目的で使えるけど、使い方や返ってくる結果が少し違うんだ。ひとつずつ見ていこう。」

1. includesメソッドとは?

1. includesメソッドとは?
1. includesメソッドとは?

includes()メソッドは、指定した文字列が対象の文字列の中に含まれているかを確認するためのメソッドです。結果としてtrue(含まれている)またはfalse(含まれていない)を返します。

たとえば、メールアドレスの中に「@」があるかを確認したり、ユーザー名の中に禁止ワードが含まれていないかチェックしたいときに便利です。


const text = "JavaScriptを学ぼう!";
console.log(text.includes("Java"));  // true
console.log(text.includes("Python")); // false

true
false

includes()メソッドは、大文字と小文字を区別します。つまり「Java」と「java」は違う文字列として扱われます。


const message = "Hello World";
console.log(message.includes("world")); // false(小文字なので一致しない)

false

もし大文字・小文字を区別せずに調べたい場合は、両方を同じケース(大文字または小文字)に変換してから調べましょう。


const message = "Hello World";
console.log(message.toLowerCase().includes("world")); // true

true

2. indexOfメソッドとは?

2. indexOfメソッドとは?
2. indexOfメソッドとは?

indexOf()メソッドは、指定した文字列が最初に現れる位置(インデックス番号)を返すメソッドです。もし見つからなければ-1を返します。

このメソッドは、特定の単語が「どこに」あるのかを知りたいときにも使えます。


const text = "JavaScriptを使って学ぶプログラミング";
console.log(text.indexOf("JavaScript")); // 0(先頭にある)
console.log(text.indexOf("プログラミング")); // 13(13文字目にある)
console.log(text.indexOf("Python")); // -1(含まれていない)

0
13
-1

indexOf()は、結果が-1でなければ含まれていると判断できます。


const text = "JavaScript入門";
if (text.indexOf("Script") !== -1) {
  console.log("含まれています!");
}

含まれています!

3. includesとindexOfの違いを比較しよう

3. includesとindexOfの違いを比較しよう
3. includesとindexOfの違いを比較しよう

includes()はシンプルに「含まれているかどうか」をtruefalseで返すのに対し、indexOf()は「どの位置にあるか」を数値で返します。

メソッド名 返り値 使い方の目的
includes() true / false 文字列が含まれているかを判定
indexOf() 位置(数値)または -1 どこにあるかを知りたいとき

たとえば「検索キーワードが文章のどこに出てくるか」を調べたいならindexOf()を使い、単純に「含まれているかだけをチェックしたい」場合はincludes()が便利です。

4. 部分一致のチェックや応用例

4. 部分一致のチェックや応用例
4. 部分一致のチェックや応用例

これらのメソッドを使うと、フォーム入力のチェックやデータ検索など、実践的な場面で役立ちます。

たとえば、メールアドレスに「@」が含まれているかを確認する例です。


const email = "example@gmail.com";
if (email.includes("@")) {
  console.log("正しいメールアドレスの形式です。");
} else {
  console.log("メールアドレスに@が含まれていません。");
}

正しいメールアドレスの形式です。

また、禁止ワードを含むコメントを判定したい場合にも使えます。


const comment = "このサイトは最高!";
if (comment.indexOf("最悪") !== -1) {
  console.log("不適切なコメントです。");
} else {
  console.log("コメントを受け付けました。");
}

コメントを受け付けました。

このように、includes()indexOf()はどちらも文字列のチェックに欠かせない基本メソッドです。特にWeb開発や入力チェックのような場面では頻繁に登場します。

カテゴリの一覧へ
新着記事
New1
TypeScript
TypeScriptとWebpack・Babelで型定義を使いこなす!初心者向け設定ガイド
New2
JavaScript
JavaScriptの配列コピーを簡単に!スプレッド構文で安全に複製する方法
New3
JavaScript
JavaScriptの配列を逆順にする方法(reverseメソッド活用)
New4
JavaScript
JavaScriptの配列の並べ替え(sortメソッド)の基本とカスタマイズ
人気記事
No.1
Java&Spring記事人気No1
JavaScript
JavaScriptのインストール方法まとめ!Windows・Mac・Linux別にステップ解説
No.2
Java&Spring記事人気No2
TypeScript
TypeScriptの型定義ファイル管理を徹底解説!読み込み順序とDefinitelyTypedの仕組み
No.3
Java&Spring記事人気No3
TypeScript
TypeScriptで型定義を拡張する方法を徹底解説!モジュール拡張とDefinitelyTypedの使い方
No.4
Java&Spring記事人気No4
JavaScript
JavaScriptプログラムの実行方法まとめ!ブラウザ・Node.js・コンソールの使い方
No.5
Java&Spring記事人気No5
TypeScript
TypeScriptの始め方:開発環境の構築手順【初心者向け】
No.6
Java&Spring記事人気No6
JavaScript
JavaScriptでフォームの値を取得する方法を徹底解説!valueプロパティの使い道
No.7
Java&Spring記事人気No7
TypeScript
TypeScriptで使える基本の型一覧(string, number, booleanなど)
No.8
Java&Spring記事人気No8
TypeScript
TypeScriptで型定義を参照する方法!triple-slash directives(三斜線ディレクティブ)を徹底解説