JavaScriptで文字列を含むか検索する方法！メソッド3選！

JavaScriptで文字列に「指定した文字列」が含まれるか、文字列内を検索して確認する方法を書いています。
この記事では、下記のメソッドを使用して文字列に、検索文字列が含まれるか確認します。

includesメソッド

文字列からincludesメソッドを呼ぶことで、文字列の中に「指定した文字」が含まれるかを確認することができます。
検索する文字列はincludesメソッドに、引数として渡します。

例えば、下記のように使うことができます。

let text = '庭には二羽鶏がいる'

let result1 = text.includes('鶏')
let result2 = text.includes('りんご')

console.log(result1) // true
console.log(result2) // false

まず、text変数に文字列「庭には二羽鶏がいる」を代入しています。
次にtext変数の文字列からincludesメソッドを呼び出しています。

「text.includes('鶏')」とすることで、「鶏」が含まれているか確認しています。
結果がresult1変数に返ってきます。

その次に文字列に含まれない「りんご」を「text.includes('りんご')」として、含まれているか確認しています。
結果はresult2変数に返ります。

結果を確認すると、result1変数の場合は文字列に含まれたので、trueが返ってきました。
result2変数には文字列に含まれなかったので、falseが返ってきました。

このようにincludesメソッドは文字列に含まれるとtrue、含まれない場合はfalseを返します。

includesメソッドの引数と返り値

includesメソッドの引数と返り値をまとめました。

引数がひとつ

第1引数にひとつだけ引数を渡すと、渡した文字列で対象文字列を検索します。

'生麦生米生卵'.includes('卵') // true

引数がふたつ

引数をふたつ渡すことも可能です。
ふたつ渡す場合は、第1引数が検索文字列で第2引数が検索位置です。

'生麦生米生卵'.includes('麦', 2) // false
'生麦生米生卵'.includes('麦', 1) // true

文字列は0番目から数えます。
上記の場合は、最初は第2引数に「2」を指定しているので、2番目の「生」から文字列「麦」を探します。
そうすると、見つからないためfalseを返します。

次は第2引数に「1」を指定しているので、ちょうど「麦」になります。
見つかったため、結果はtrueです。

返り値

検索文字列が含まれていれば「true」含まれていない場合は「false」です。

searchメソッド

searchメソッドも文字列から呼び出します。
呼び出したsearchメソッドに正規表現を渡して、対象の文字列に存在するかどうか確認できます。
見つかった場合は文字列の位置が返ってきます。

例えば、下記のように使います。

const text = "テスト123987アイウエオ"
const result = text.search(/[0-9]{6}/g)
console.log(result) // 3

最初にtest変数に「テスト123987アイウエオ」という文字列を代入しました。
その次の行で、searchメソッドを使っています。

searchメソッドには「/[0-9]{6}/g」の正規表現を渡しています。
この正規表現は、文字列の中に数値が6個続く箇所を探しています。

result変数にはsearchメソッドの返り値を入れています。
返り値は文字列の中で、指定した正規表現のパターンが見つかった位置を返します。
文字列を0番目から数えると、3番目の位置に123987という正規表現にあうパターンがあるので、「3」がresult変数に格納されます。

もしも正規表現にあうパターンがなかった場合は、「-1」が返ってきます。

searchメソッドの引数と返り値

searchメソッドの引数と返り値をまとめました。

引数

正規表現を渡します。

console.log("私の電話番号は000-0000-0000です。".search(/[0-9]{3}-[0-9]{4}-[0-9]{4}/)) // 7
console.log("りんごは英語でapple".search(/[a-z]/g)) // 7

返り値

対象の文字列を渡した正規表現で検索して、正規表現にマッチした箇所の文字列の番号を渡します。
複数マッチした箇所があった場合は、最初のひとつが返ります。

マッチしない場合には-1が返ってきます。

indexOfメソッド

indexOfメソッドも文字列から呼び出します。
indexOfメソッドに渡した文字列から、対象の文字列を検索して、見つかった場合は文字列の位置を返します。

例えば、下記のように使います。

const text = "テスト123987アイウエオ"
const result = text.indexOf("123")
console.log(result) // 3

最初にtest変数に「テスト123987アイウエオ」という文字列を代入しました。
その次の行で、indexOfメソッドを使っています。

indexOfメソッドには「123」という文字列を渡しています。
引数で渡した文字列で、対象の文字列を探して、見つかった場合に文字列の位置を返します。

文字列の0番目から数えて、「123」は3番目にあるので「3」が返ってきます。
見つからなかった場合には「-1」になります。

indexOfメソッドの引数と返り値

indexOfメソッドの引数と返り値をまとめました。

引数をひとつ渡す

引数をひとつ渡すと、渡した引数で呼び出し元の文字列があるか検索します。
文字列がある場合には、文字列の位置を返します。
文字列がない場合には「-1」が返ってきます。

console.log("りんごはapple!".indexOf("pl")) // 6
console.log("りんごはapple!".indexOf("grape")) // -1

引数をふたつ渡す

引数をふたつ渡すこともできます。
第2引数の引数は、検索を始める位置です。渡した位置から文字列を検索します。

console.log("りんごはapple!".indexOf("p", 7)) // -1
console.log("りんごはapple!".indexOf("p", 2)) // 5

文字列「りんごはapple!」で第2引数に7を渡すと、検索文字列は「le!」のみなので「-1」が返ってきます。
次の行で、第2引数に2を渡しています。
検索文字列は「はapple!」になるので「5」が返ってきます。

返り値

検索した文字列が、はじめて出現した文字列の位置を返します。
見つからない場合には「-1」が返ってきます。