JavaScriptのindexOfの使い方！文字列の位置を検索

JavaScriptで文字列の中に、指定した文字列が最初に現れるインデックスを返すindexOfメソッドについて解説します。

indexOfメソッドを使うと、文字列の中に特定の文字列が含まれているかどうか、また、その文字列がどこにあるかを簡単に調べることができます。
文字列処理を行う際に、特定の文字列の位置を知りたい場合に便利です。

実際に動くサンプルを使って、以下の操作を解説します。

indexOfメソッドの基本的な使い方

indexOfメソッドは、文字列の中に指定した文字列が最初に現れるインデックスを返します。
もし指定した文字列が見つからない場合は、-1を返します。

基本的な構文は以下のとおりです。

string.indexOf(searchValue, fromIndex)

• searchValue: 検索する文字列。
  • 文字列（必須）。
• fromIndex: 検索を開始する位置。
  • 0以上の整数値（省略可能）。
  • デフォルトは0。

文字列の位置を調べる

const str = 'Hello World!';

console.log(str.indexOf('World')); // 結果：6
console.log(str.indexOf('world')); // 結果：-1

str文字列の中に’World’という文字列が最初に現れるインデックスをindexOfメソッドで調べています。
‘World’はstr文字列の6番目の文字から始まるため、indexOf('World')は「6」を返します。

一方、’world’（小文字）はstr文字列に含まれていないため、indexOf('world')は「-1」を返します（大文字小文字は区別されます）。

検索開始位置を指定する

indexOfメソッドの第2引数fromIndexを使うと、検索を開始する位置を指定できます。

const str = 'Hello World! Hello!';

console.log(str.indexOf('Hello', 7)); // 結果：13

この例では、str文字列の7番目の文字から’Hello’という文字列を検索しています。
2番目の’Hello’は13番目の文字から始まるため、indexOf('Hello', 7)は「13」を返します。

後ろから位置を取得するには？

文字列の後ろから検索したい場合は、lastIndexOfメソッドを使用します。
lastIndexOfメソッドは、文字列の中に指定した文字列が最後に現れるインデックスを返します。

const str = 'Hello World! Hello!';

console.log(str.lastIndexOf('Hello')); // 結果：13

str文字列の中に’Hello’という文字列が最後に現れるインデックスをlastIndexOfメソッドで調べています。
最後の’Hello’は13番目の文字から始まるため、lastIndexOf('Hello')は「13」を返します。

正規表現で検索するには？

文字列を正規表現で検索したい場合は、searchメソッドを使用します。
searchメソッドは、文字列の中に正規表現にマッチする文字列があるかどうかを調べ、マッチする文字列の開始位置を返します。

const str = 'Hello World!';

console.log(str.search(/World/)); // 結果：6

str文字列の中に’World’という文字列があるかどうかを正規表現を使って調べています。
‘World’はstr文字列の6番目の文字から始まるため、search(/World/)は「6」を返します。

indexOfメソッドを使うメリット

indexOfメソッドを使う主なメリットは以下のとおりです。

• 文字列の存在チェック: 文字列が特定の文字列を含むかどうかを簡単に判定できます。
• 文字列の位置特定: 文字列の中に特定の文字列がどこにあるかを調べることができます。
• 可読性の向上: indexOfメソッドを使うことで、文字列処理の意図が明確になり、コードの可読性が向上します。

JavaScriptのindexOfメソッドの使い方まとめ

今回はJavaScriptのindexOfメソッドの使い方について解説しました。
記事の内容をまとめます。