Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

JavaScriptで特定の文字列が含まれているか調べるメソッドの使い方

More than 1 year has passed since last update.

JavaScriptでは特定の値が含まれているか調べる方法が複数あります。
用途によって使い分けられるのでまとめてみました。

String.prototype.indexOf()メソッド

呼び出すStringオブジェクトを引数の値で検索し、
指定された値が最初に現れた位置を返します。

使い方

test.js
let sample = 'abcdefg';
let result = sample.indexOf('c');
console.log(result);

実行結果

2

大文字と小文字は区別し、
値が見つからない場合は-1を返します。
なので…

test.js
let sample = 'ABCDEFG';
let result = sample.indexOf('c');
console.log(result);

実行結果

-1

検索し始める最初の位置を指定する事も出来ます。

test.js
let sample = 'abcdeabcde';
let result = sample.indexOf('cd', 5);
console.log(result);

実行結果

7

この場合、検索する位置を指定しなければ2が表示されますが、
検索する最初の位置を5番目に指定したので、
次のcdが当てはまる、7を取得することが出来ました。

String.prototype.includes()メソッド

選択した文字列を対象の文字列の中に見つけられるかどうかを判断し、
真偽値を返します。
見つかった場合はtrue、見つからなければfalseとなります。

使い方

test.js
let sample = 'abcdefg';
let result = sample.includes('c');
console.log(result);

実行結果

true

大文字と小文字も区別します。

test.js
let sample = 'ABCDEFG';
let result = sample.includes('c');
console.log(result);

実行結果

false

検索し始める最初の位置を指定する事も出来ます。

test.js
let sample = 'hello world';
let result = sample.includes('hello', 2);
console.log(result);

実行結果

false

検索する位置を指定しなければ文字列を見つけられるのでtrueが表示されます。
しかし今回、検索する最初の位置を2番目からに指定したので、
helloが見つからずにfalseを返しました。

String.prototype.search()メソッド

対象のStringオブジェクトが正規表現でマッチできるかどうかを判定します。
成功した場合は、マッチした箇所の位置を、
失敗の場合は-1を返します。

使い方

test.js
let sample = 'HELLO world';
let regex = /[a-z]/g;
let result = sample.search(regex);
console.log(result);

実行結果

6

失敗パターン

test.js
let sample = 'HELLO world';
let regex = /[0-9]/g;
let result = sample.search(regex);
console.log(result);

実行結果

-1

対象のStringオブジェクトの中に数字は存在しなかったので、
-1を返しました。

RegExp.prototype.test()メソッド

対象のStringオブジェクトが正規表現でマッチできるかどうかを判定します。
こちらは結果を真偽値で返します。

使い方

test.js
let sample = 'hello world';
let regex = /[a-z]/g;
let result = regex.test(sample);
console.log(result);

実行結果

true

String.prototype.match()メソッド

対象のStringオブジェクトが正規表現でマッチできるかどうかを判定します。
こちらは結果を配列で返し、
マッチが見つからない場合はnullをかえします。

使い方

test.js
let sample = 'HELLO world';
let regex = /[a-z]/g;
let result = sample.match(regex);
console.log(result);

実行結果

["w", "o", "r", "l", "d"]

指定する正規表現のgフラグの有無によって取れる内容が変わります。
今度はgフラグの無い場合を試してみます。

test.js
let sample = 'HELLO world';
let regex = /[a-z]/;
let result = sample.match(regex);
console.log(result);

実行結果

["w", index: 6, input: "HELLO world"]

このgフラグが存在しない場合は、
RegExp.prototype.exec()メソッドと同じ結果を返します。
ただ、一番最初に見つけたマッチだけが欲しい場合、
代わりにRegExp.prototype.exec()メソッドを使ったほうが良さそうです。

RegExp.prototype.exec()

match()と同じく、対象のStringオブジェクトが正規表現でマッチできるかどうかを判定します。
こちらは結果を配列で返し、
マッチが見つからない場合はnullをかえします。

使い方

test.js
let sample = 'HELLO world';
let regex = /[a-z]/;
let result = regex.exec(sample);
console.log(result);

実行結果

["w", index: 6, input: "HELLO world"]

まとめ

メソッドによって用途が異なる為、
使い分けが大切ですね。
何かあればご意見、ご指摘頂けますと嬉しいです。

参考

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/includes

shimajiri
株式会社LbercScripts代表。 某情報通信企業でのIT営業を経てプログラマーを志し、現在はプログラマーと代表を兼任。 自身の勉強&趣味でQiitaに記事を書いている。Python,Java,JavaScript,Perl,Ruby on Rails,PHPなど。最近は趣味でゲームを製作中。
https://ryota-shimajiri.github.io/portfolio/
lberc
ITで暮らしを豊かにするものを創造していく企業、エルバークグループです。ウェアラブルデバイスを制御するモバイルアプリやWebAPIの開発、サーバー構築、モバイルアプリの第三者検証業務を請け負っています。
https://www.lberc-g.jp/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away