トップ 差分 一覧 Farm ソース 検索 ヘルプ RSS ログイン

JavaScript【正規表現】

正規表現

[JavaScript]
最終更新時間:2010年09月27日 11時24分30秒

文字列処理

 indexOf

indexOfを使うと文字列を検索できる。

例1
検索が引っかかった一番始めの位置を返す。(この場合は"b"で、"a"は0番目として考える。)

 <!DOCTYPE>
 <html>
 <head>
   <meta charset=utf-8>
   <title>例1</title>
 </head>
 <body>
 <script type="text/javascript">
 var aaa = "abcdef";
 var idx = aaa.indexOf("bcd");
 alert(idx);
 </script>
 </body>
 </html>
 結果:1
例2

一文字検索

 <!DOCTYPE>
 <html>
 <head>
   <meta charset=utf-8>
   <title>例2</title>
 </head>
 <body>
 <script type="text/javascript">
 var aaa = "abcdef";
 var idx = aaa.indexOf("c");
 alert(idx);
 </script>
 </body>
 </html>
 結果:2

 slice

sliceを使うとある文字列を抜き出すことができる。

例1

後ろの4という数字は4番目の一つ前までという意味

 <!DOCTYPE>
 <html>
 <head>
   <meta charset=utf-8>
   <title>例1</title>
 </head>
 <body>
 <script type="text/javascript">
 var aaa = "abcde";
 alert(aaa.slice(1, 4));
 </script>
 </body>
 </html>
 結果:bcd
例2

マイナスを使うと最後から数え始める

 <!DOCTYPE>
 <html>
 <head>
   <meta charset=utf-8>
   <title>例2</title>
 </head>
 <body>
 <script type="text/javascript">
 var aaa = "abcde";
 alert(aaa.slice(-3, 5));
 </script>
 </body>
 </html>

-1が"e"、-2が"d"、-3が"c"になる。

 結果:cde

 substring

substringはsliceと同じような効果。違いはマイナスを使ったときの処理。

例1
 <!DOCTYPE>
 <html>
 <head>
   <meta charset=utf-8>
   <title>例1</title>
 </head>
 <body>
 <script type="text/javascript">
 var aaa = "abcde";
 alert(aaa.substring(1, 4));
 </script>
 </body>
 </html>
 結果:bcd

※sliceの例1と変わらない結果になる

例2

substringでマイナスを使うと0に置き換わる。

 <!DOCTYPE>
 <html>
 <head>
   <meta charset=utf-8>
   <title>4.5.2</title>
 </head>
 <body>
 <script type="text/javascript">
 var aaa = "abcde";
 alert(aaa.substring(-3, 5));
 </script>
 </body>
 </html>
 結果:abcde

 charAt

一文字を抜き出す

 <!DOCTYPE>
 <html>
 <head>
   <meta charset=utf-8>
   <title>4.5.2</title>
 </head>
 <body>
 <script type="text/javascript">
 var aaa = "abcde";
 alert(aaa.charAt(1));
 </script>
 </body>
 </html>
 結果:b

 正規表現

JavaScriptで正規表現を使う場合はtestメソッドを使うとよい。

例1

testメソッドを使って正規表現をかけている

 <!DOCTYPE>
 <html>
 <head>
   <meta charset=utf-8>
   <title>例1</title>
 </head>
 <body>
 <script type="text/javascript">
 if (/bcd/.test("abcde")) {
   alert("マッチしました。");
 } else {
   alert("マッチしませんでした。");
 }
 </script>
 </body>
 </html>

戻り値はbooleanになる。

 結果:マッチしました

 match

正規表現に引っかかった値を取ってくる場合はmatchメソッドが使用できる

例1

aとcの間に任意の5文字がある文字列

 <!DOCTYPE>
 <html>
 <head>
   <meta chraset=utf-8>
   <title>例1</title>
 </head>
 <body>
 <script type="text/javascript">
 var str = "aabcbcacbuccb";
 var result = str.match(/a.{5}c/);
 alert(result[0]);
 </script>
 </body>
 </html>

結果は配列の0番目として代入される。

 結果:abcbcac

※正規表現に2つ以上が引っかかると一番始めに引っかかった文字列が出力される。

例2
正規表現の中に括弧を加えることによって、括弧の中の値を結果の配列にいれることができる

先ほどの例だと結果は配列だがresult[1]以降はundefになっている。
正規表現の括弧を使うとその括弧の値を配列に格納することができる。

 <!DOCTYPE>
 <html>
 <head>
   <meta chraset=utf-8>
   <title>例2</title>
 </head>
 <body>
 <script type="text/javascript">
 var str = "aabcbcacbuccb";
 var result = str.match(/a(.{5})c/);
 alert(result[0]);
 alert(result[1]);
 </script>
 </body>
 </html>

result[1]は括弧を使って正規表現をかけたためにでてきた。

  結果:abcbca
             bcbca

 replace

replaceメソッドを使うことにより、文字の置き換えをすることができる。

例1

 <!DOCTYPE>
 <html>
 <head>
   <meta charset=utf-8>
   <title>例1</title>
 </head>
 <body>
 <script type="text/javascript">
 var str = "abc123hij";
 var result = str.replace(/123/, "def");
 alert(result);
 </script>
 </body>
 </html>

 注意点

test, match, replaceの使用方法が若干ややこしいためまとめる。

test

 正規表現.test(文字列)
match
 文字列.match(正規表現)
replace
 文字列.replace(正規表現,置き換え後文字列)

 その他

その他、JavaScriptの正規表現で気になった点をまとめる。
基本的に他の言語と同じようなもん。

  • ドット(.)やアスタリスク(*)やプラス(+)やハテナ(?)などは基本的に他の言語と同じ
  • [abc]でa,b,cのどれか一文字があればよいということ
  • [^abc]でa,b,c以外が含まれていること
  • ^は先頭を$は一番最後を表す
  • ()は後で参照できるようすることができるが、(?:)を使うと後では使いませんよーという意味になる。

参考

http://www15.plala.or.jp/uhyo_/javascript/4_5.html