入力欄でひらがなやカタカタ・漢字が含まれているかチェックしたい・・・
そのような場合に役立つチェック方法とコード例についてまとめました。
ひらがなをチェックする方法
初めは文字列にひらがなが含まれるか調べる方法
そのためにはUTF8のひらがなの範囲を知る必要があります。
その範囲は記号なども含めると次の表の通り
| 0x3000 ~ 0x301C | 全角スペース、句読点などの記号 |
| 0x3041 ~ 0x3093 | ひらがな本体 |
| 0x309B ~ 0x309E | 濁点、半濁点、「ゝ」、「ゞ」 |
ここではひらがな自体に加えてスペースや濁点なども一部とみなします。
そして次が上の表を元に作った正規表現
|
1 |
/[\u{3000}-\u{301C}\u{3041}-\u{3093}\u{309B}-\u{309E}]/mu |
この正規表現を使えば文字列がひらがなを含むかの判定が可能です。
例えば次がそのコード例
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
var regexp = /[\u{3000}-\u{301C}\u{3041}-\u{3093}\u{309B}-\u{309E}]/mu; var kanzi = '漢字'; console.log(regexp.test(kanzi)); /// => false var hiragana = 'ひらがな'; console.log(regexp.test(hiragana)); /// => true var katakana = 'カタカナ'; console.log(regexp.test(katakana)); /// => false var hankaku = 'hankaku'; console.log(regexp.test(hankaku)); /// => false var all = '亜あアA'; console.log(regexp.test(all)); /// => true |
コメントに書いたのがコンソールへの実行結果です。
ちなみにtestメソッドは正規表現がマッチすれば真偽値を返すメソッドです。
その使い方については正規表現のテストができるメソッドまとめでも紹介しました。
上で挙げた正規表現だと「ひらがな」さえ含まれていればマッチします。
もし「ひらがな」のみマッチさせたいなら次の正規表現を使えばOK
|
1 |
/^[\u{3000}-\u{301C}\u{3041}-\u{3093}\u{309B}-\u{309E}]+$/mu |
フォーム入力欄でひらがなだけ許可したいときとかに役立つかもしれません。
カタカナをチェックする方法
お次はカタカナが含まれるかどうかをチェックする方法
こちらもひらがなを同じように正規表現で判定できます。
まずUTF8でのカタカナの範囲は次の通り
| 0x3000 ~ 0x301C | 全角スペース、句読点などの記号 |
| 0x30A1 ~ 0x30F6 | カタカナ本体 |
| 0x30FB ~ 0x30FE | 「・」、「ー」、「ヽ」、「ヾ」 |
スペースや記号もカタカナの一部です。
そして上の表を元に作ったのが次の正規表現
|
1 |
/[\u{3000}-\u{301C}\u{30A1}-\u{30F6}\u{30FB}-\u{30FE}]/mu |
これを使うことで次のようにカタカナが含まれるかの判定ができます。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
var regexp = /[\u{3000}-\u{301C}\u{30A1}-\u{30F6}\u{30FB}-\u{30FE}]/mu; var kanzi = '漢字'; console.log(regexp.test(kanzi)); /// => false var hiragana = 'ひらがな'; console.log(regexp.test(hiragana)); /// => false var katakana = 'カタカナ'; console.log(regexp.test(katakana)); /// => true var hankaku = 'hankaku'; console.log(regexp.test(hankaku)); /// => false var all = '亜あアA'; console.log(regexp.test(all)); /// => true |
ちなみに半角カナ（例えば ァ とか ｻ ）は含まないので注意
ひらがなと同様にカタカナのみにマッチする正規表現も作れます。
|
1 |
/^[\u{3000}-\u{301C}\u{30A1}-\u{30F6}\u{30FB}-\u{30FE}]+$/mu |
カタカナだけ入力できる名前欄を作りたい、などの場合に使えそうです。
漢字をチェックする方法
最後は漢字が文字列に含まれるか判定する方法
今までは次のような正規表現で判定してました。
|
1 |
[一-龠] |
でもこれはシステムによっては動かないこともあるので使わない方が無難
あと正規表現中に漢字が含まれるのってなんか違和感があるんですよね・・・
そこでいい方法がないか探してたらQiitaの次ページに書いてました。
PHPで漢字判定をする正規表現が載っています。
このページを元にJavaScriptで使える形に直してみました。
それが次の正規表現
|
1 |
/([\u{3005}\u{3007}\u{303b}\u{3400}-\u{9FFF}\u{F900}-\u{FAFF}\u{20000}-\u{2FFFF}][\u{E0100}-\u{E01EF}\u{FE00}-\u{FE02}]?)/mu |
異体字にも対応できるみたいです。
これを使えば次のコード例みたいに漢字が含まれるかの判定が可能
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
var regexp = /([\u{3005}\u{3007}\u{303b}\u{3400}-\u{9FFF}\u{F900}-\u{FAFF}\u{20000}-\u{2FFFF}][\u{E0100}-\u{E01EF}\u{FE00}-\u{FE02}]?)/mu; var kanzi = '漢字'; console.log(regexp.test(kanzi)); /// => true var hiragana = 'ひらがな'; console.log(regexp.test(hiragana)); /// => false var katakana = 'カタカナ'; console.log(regexp.test(katakana)); /// => false var hankaku = 'hankaku'; console.log(regexp.test(hankaku)); /// => false var all = '亜あアA'; console.log(regexp.test(all)); /// => true |
実行結果はコメントの中に書いた通り
確かに漢字のみの kanzi と漢字を含む all の場合で true になってます。
ちなみに漢字のみにマッチさせるなら次の正規表現を使えばOK
|
1 |
/^([\u{3005}\u{3007}\u{303b}\u{3400}-\u{9FFF}\u{F900}-\u{FAFF}\u{20000}-\u{2FFFF}][\u{E0100}-\u{E01EF}\u{FE00}-\u{FE02}]?)+$/mu |
まあでも漢字だけ判定したい場合はそうそうないとは思います。
ここまでのまとめ
ということで文字列でひらがな・カタカナ・漢字のチェックに使える正規表現まとめ
- ひらがなが含まれる文字列にマッチ
1/[\u{3000}-\u{301C}\u{3041}-\u{3093}\u{309B}-\u{309E}]/mu
- ひらがなのみの文字列にマッチ
1/^[\u{3000}-\u{301C}\u{3041}-\u{3093}\u{309B}-\u{309E}]+$/mu - カタカナが含まれる文字列にマッチ
1/[\u{3000}-\u{301C}\u{30A1}-\u{30F6}\u{30FB}-\u{30FE}]/mu - カタカナだけの文字列にマッチ
1/^[\u{3000}-\u{301C}\u{30A1}-\u{30F6}\u{30FB}-\u{30FE}]+$/mu - 漢字が含まれる文字列にマッチ
1/([\u{3005}\u{3007}\u{303b}\u{3400}-\u{9FFF}\u{F900}-\u{FAFF}\u{20000}-\u{2FFFF}][\u{E0100}-\u{E01EF}\u{FE00}-\u{FE02}]?)/mu - 漢字だけの文字列にマッチ
1/^([\u{3005}\u{3007}\u{303b}\u{3400}-\u{9FFF}\u{F900}-\u{FAFF}\u{20000}-\u{2FFFF}][\u{E0100}-\u{E01EF}\u{FE00}-\u{FE02}]?)+$/mu
以上JavaScriptでひらがなやカタカナ、漢字をチェックする方法についてでした。
フォーム入力欄の文字制限に使えると思います。
