JavaScriptで部分文字列を探す方法

2024-08-20

JavaScript, jQuery, および String で部分文字列が含まれているかチェックする方法

JavaScript でのチェック

includes() メソッド

最も一般的な方法は、includes() メソッドを使用することです。このメソッドは、指定された部分文字列が文字列内に存在する場合に true、そうでない場合に false を返します。

const str = "Hello, world!";
const substr = "world";

if (str.includes(substr)) {
  console.log("部分文字列が含まれています");
} else {
  console.log("部分文字列が含まれていません");
}

indexOf() メソッド

もう一つの方法は、indexOf() メソッドを使用することです。このメソッドは、部分文字列が見つかった場合にそのインデックスを返し、見つからない場合は -1 を返します。

const str = "Hello, world!";
const substr = "world";

if (str.indexOf(substr) !== -1) {
  console.log("部分文字列が含まれています");
} else {
  console.log("部分文字列が含まれていません");
}

jQuery でのチェック

jQuery は主に DOM 操作用ライブラリであり、直接的な文字列操作機能は提供していません。そのため、JavaScript の方法を使用します。

const str = "Hello, world!";
const substr = "world";

if (str.includes(substr)) {
  // jQuery での処理を行う場合はこちら
  console.log("部分文字列が含まれています");
} else {
  // jQuery での処理を行う場合はこちら
  console.log("部分文字列が含まれていません");
}

重要なポイント

大文字小文字を区別するかどうかを考慮してください。必要に応じて、文字列をすべて小文字または大文字に変換してから比較することができます。
indexOf() メソッドは、部分文字列の位置を取得する必要がある場合に使用できます。
includes() メソッドは、より簡潔で読みやすいコードになります。

例
大文字小文字を無視する比較

const str = "Hello, World!";
const substr = "world";

if (str.toLowerCase().includes(substr.toLowerCase())) {
  console.log("部分文字列が含まれています (大文字小文字無視)");
} else {
  console.log("部分文字列が含まれていません (大文字小文字無視)");
}

JavaScript で部分文字列が含まれているかチェックするコード例の詳細解説

コード例1: includes() メソッドを用いたケース

const str = "Hello, world!";
const substr = "world";

if (str.includes(substr)) {
  console.log("部分文字列が含まれています");
} else {
  console.log("部分文字列が含まれていません");
}

if (str.includes(substr)) { ... }: includes() の戻り値が true の場合、if 文内の処理を実行します。
str.includes(substr): str の中に substr が含まれているか調べます。含まれていれば true、含まれていなければ false を返します。
const substr = "world";: 探したい部分文字列を substr 変数に代入しています。
const str = "Hello, world!";: 調べたい文字列を str 変数に代入しています。

const str = "Hello, world!";
const substr = "world";

if (str.indexOf(substr) !== -1) {
  console.log("部分文字列が含まれています");
} else {
  console.log("部分文字列が含まれていません");
}

if (str.indexOf(substr) !== -1) { ... }: indexOf() の戻り値が -1 でない（つまり、部分文字列が見つかった）場合、if 文内の処理を実行します。
str.indexOf(substr): str の中で substr が最初に現れる位置のインデックスを返します。見つからない場合は -1 を返します。

コード例3: 正規表現を用いたケース (より高度な例)

const str = "Hello, world!";
const substr = "world";

if (str.match(substr)) {
  console.log("部分文字列が含まれています");
} else {
  console.log("部分文字列が含まれていません");
}

if (str.match(substr)) { ... }: match() の戻り値が null でない（つまり、一致する部分が見つかった）場合、if 文内の処理を実行します。
str.match(substr): str の中で substr と一致する部分があるか正規表現で検索します。一致する部分があれば配列を返し、なければ null を返します。

それぞれのメソッドの特性

正規表現: より複雑なパターンマッチングが必要な場合に強力なツールとなる。
indexOf(): 部分文字列の位置を知りたい場合や、より柔軟な検索が必要な場合に適している。
includes(): シンプルで直感的に使える。部分文字列が含まれているかどうかの真偽値だけが必要な場合に適している。

JavaScript で部分文字列が含まれているかチェックする方法は、主に includes()、indexOf()、正規表現の match() の3つが挙げられます。どのメソッドを使うかは、求める情報やコードの複雑さによって使い分けることができます。

大文字小文字の区別
上記の例では大文字小文字を区別していますが、toLowerCase() や toUpperCase() を使って文字列をすべて小文字または大文字に変換することで、大文字小文字を無視した比較を行うことができます。

例

複数の部分文字列を同時に検索する方法
大文字小文字を無視した検索を行う方法
正規表現を使ってより複雑なパターンマッチングを行う方法
特定の文字列が含まれる要素をすべて探し出す方法

JavaScript で部分文字列を探す代替方法

JavaScript で部分文字列が含まれているかチェックする方法は、これまでにご紹介した includes()、indexOf()、正規表現の match() 以外にも、いくつかの方法があります。それぞれの特徴や使いどころを解説します。

search() メソッド

使いどころ
より柔軟なパターンマッチングが必要な場合。例えば、大文字小文字を区別せずに検索したり、特定の文字列パターンを検索したりする場合に便利です。
特徴
正規表現を使って部分文字列を検索します。indexOf() と似ていますが、正規表現のパターンマッチングが可能という点が異なります。

const str = "Hello, world!";
const substr = /world/i; // i オプションで大文字小文字を区別しない

if (str.search(substr) !== -1) {
  console.log("部分文字列が含まれています");
}

正規表現の test() メソッド

使いどころ
正規表現を使って厳密なパターンマッチングを行いたい場合。
特徴
正規表現オブジェクトのメソッドで、文字列が正規表現にマッチするかを判定します。

const str = "Hello, world!";
const regex = /world/;

if (regex.test(str)) {
  console.log("部分文字列が含まれています");
}

for ループによる手動検索

使いどころ
非常にシンプルな処理で部分文字列を検索したい場合。ただし、パフォーマンスは他のメソッドに劣る可能性があります。
特徴
文字列を一つずつ比較することで部分文字列を検索します。

const str = "Hello, world!";
const substr = "world";

for (let i = 0; i < str.length - substr.length + 1; i++) {
  let match = true;
  for (let j = 0; j < substr.length; j++) {
    if (str[i + j] !== substr[j]) {
      match = false;
      break;
    }
  }
  if (match) {
    console.log("部分文字列が見つかりました");
    break;
  }
}

どの方法を選ぶべきか？

学習目的や特殊な処理
for ループによる手動検索
柔軟なパターンマッチング
search()、正規表現の test()
部分文字列の位置を知りたい
indexOf()
シンプルで高速な検索
includes()

一般的には、includes() や indexOf() が最もシンプルで使いやすいでしょう。しかし、より高度な検索が必要な場合は、正規表現を使った search() や test() が有効です。

JavaScript で部分文字列を探す方法は、様々なものが存在します。それぞれの方法の特徴を理解し、状況に合わせて適切な方法を選択することで、より効率的で柔軟なコードを書くことができます。

可変長文字列
Unicode のような可変長文字列を扱う場合は、文字数を正確にカウントする必要があります。
可読性
includes() はシンプルで読みやすいですが、正規表現を使った方法は、複雑なパターンを表現できる一方で、可読性が低下する可能性があります。
パフォーマンス
多くの場合、includes() が最も高速です。しかし、大規模な文字列や複雑なパターンマッチングでは、他の方法の方が適している場合があります。

javascript jquery string