JavaScriptで部分一致する方法を現役エンジニアが解説【初心者向け】

JavaScriptで部分一致する方法について解説します。実際のコードをもとに解説していきますので、理解を深めていきましょう。

また、入門向けのJavaSriptを学習できるサイトも紹介しているので、合わせてご覧ください。

 

そもそもJavaScriptについてよく分からないという方は、JavaScriptとは何なのかについて解説した記事を読むとさらに理解が深まります。

なお本記事は、TechAcademyのオンラインブートキャンプJavaScript/jQuery講座の内容をもとにしています。

 

 

 

正規表現とは

正規表現とは、様々なパターンの文字列を短くまとめて表現する方法です。例えば以下のような正規表現を書くと3桁+4桁の全ての文字列を網羅できます。

/d{3}-d{4}/

この表現によって、000-0000から999-9999の全てを表現することができます。

JavaScriptでは、matchやtestメソッドを利用してフォームの内容に間違いがないかを検査のするといった方法で使用されます。

JavaScriptで部分一致する「indexOf」

正規表現以外にも、文字列の検索をする方法があります。

indexOfメソッドは、文字列に対して使用して第１引数に与えた文字が初めてマッチしたインデックスを返します。もしマッチする文字がなければ、-1を返します。
第2引数で、検索を開始する位置を指定できます。設定しない場合は0が代入されます。

書き方は以下の通りです。

var str = "abcde"
str.indexOf("e") // => 4
str.indexOf("h") // => -1
str.indexOf("c",2) // => 2
str.indexOf("c",5) // => -1

 

[PR] フロントエンドで副業する学習方法を動画で公開中

実際に書いてみよう

それでは実際に書いてみましょう。

様々なパターンのマッチングをみて、動作を確認しましょう。

var str = "Hello World"
str.indexOf("Hello") // => 0
str.indexOf("Helloo") // => -1
str.indexOf("World",0) // => 6
str.indexOf("World",6) // => 6
str.indexOf("World",7) // => -1
str.indexOf("",0) // => 0
str.indexOf("",5) // => 5
str.indexOf("",15) // => 11

 

以上で解説を終わります。

 

筆者プロフィール

メンター金成さん。 2014年より、某物流会社のシステム開発担当として入社。 未経験ながら、社内システム保守～新規受注システム開発まで携わり、JavaScript　Ruby on Rails　PostgreSQLなどの経験を積む。 現在も、開発案件に携わりながら、日々勉強中。

 

 

TechAcademyでは、初心者でもJavaScript・jQueryを使ったWebサービス公開を習得できるオンラインブートキャンプJavaScript/jQuery講座を開催しています。

挫折しない学習方法を知れる説明動画や、現役エンジニアとのビデオ通話とチャットサポート、学習用カリキュラムを体験できる無料体験も実施しているので、ぜひ参加してみてください。