「正規表現」の基本的な使い方をJavaScriptで理解する
書籍の中から有用な技術情報をピックアップして紹介する本シリーズ。今回は、秀和システム発行の書籍『JavaScript Web開発パーフェクトマスター（2015年6月27日発行）』からの抜粋です。 ご注意：本稿は、著者及び出版社の許可を得て、そのまま転載したものです。このため用字用語の統一ルールなどは＠ITのそれとは一致しません。あらかじめご了承ください。 プログラムを作成するうえで、特定の文字列の中から指定したパターンに合致する部分があるかを調べたい場合があります。このような場合に利用するのが正規表現です。 正規表現はあいまいな文字列パターンを指定することで、条件にマッチする文字列を見付け出せるのが最大の特徴です。文字列が含む「特定の規則に則った箇所」を見付けて、それに見合う文字列を取り出すことができるのですね。 正規表現って何のためのもの？ 正規表現は、基本的に文字列を検索するために使う
正規表現を複数回実行する際の注意点 - Qiita
javascriptで正規表現を複数回実行する際の注意点 以下のコードは"hoge"という文字列が含まれているか正規表現で検索し、結果を表示するコードです。 var example = "hoge"; var regexp = /hoge/g; regexp.test(example); // true regexp.test(example); // false regexp.test(example); // true regexp.test(example); // false ... 一度目の実行ではtrueが返ってきますが、二度目の実行ではfalseが返ってきます。 以降は交互に結果が変わります。不思議ですね。 私はループ内で正規表現を実行する際に、この挙動につまづきました。 一体何が起きているのでしょうか？ var examples = ["hoge", "hoge", "ho
運用型広告の運用者がおさえておきたい正規表現、基本の「き」｜アナグラム株式会社
Google アナリティクス、Google タグマネージャやYahoo!タグマネージャーに代表されるタグマネジメントツールなど、これらを利用したことがある方なら1度は正規表現という単語を見たり耳にしたことがあるかと思います。 IT用語辞典 e-Wordsによると、正規表現とは次のように記されています。 正規表現とは、文字列のパターンを表現する表記法。文字列の検索・置換を行うときに利用される。 通常の文字と、メタキャラクタと呼ばれる特別な意味を持った記号を組み合わせて表記される。例えば「^」という文字は「行頭」、「.」は「任意の1文字」、「+」という文字は「直前の要素の1回以上の繰り返し」を意味する。 正規表現を使えば、文字列を直接指定せず、「特徴」（パターン）を指定することができるため、表記の揺れを吸収して検索を行ったり、複数の異なる文字列を一括して置換したりすることができる。 引用：正規
phiary
phi I'm a Game Programmer and Frontend Engineer passionate about programming education. Math / C / C++ / C# / JavaScript / HTML5 / CSS3 / Python 未だに form の validation って, とりあえずなんでも受け付けてサーバー側で してエラー返ってきたらヘッダーなりダイアログなりでエラーメッセージを表示するなんてのをよく見ます. 某大手サイトなんかはエラーがあるとリロードしちゃったりするし... ユーザーさんからすると入力した段階で何かしら間違いがあったらすぐに教えて欲しいですよね. 実はこの辺って HTML5 からクライアントサイドでもある程度チェックできるように整備されています. なのでライブラリを使わなくてもある程度サーバーに送る前に
Webデザイナーに最低限知っておいてほしい、検索と置換(正規表現) - kojika17
置換前の文字と検索、置換の対応 特定の文字からHTMLを作成 (.*)と$による呼び出しを覚えれば、様々なことに応用ができます。 下記の文字から、HTMLのリストを作成してみましょう。 Google https://www.google.co.jp/ Yahoo! http://www.yahoo.co.jp/ Bing https://www.bing.com/ Yandex https://www.yandex.com/ 百度 http://www.baidu.com/ 用意した文字は「タイトル」「スペース1つ」「URL」というルールになっています。タイトルとURLを(.*)に置き換えて検索し、li要素とa要素に置き換えます。 例 置換前の文字 Google https://www.google.co.jp/ Yahoo! http://www.yahoo.co.jp/ Bing ht
HTMLのpattern属性とJavaScript正規表現のunicodeオプション - Hatena Developer Blog
こんにちは、Webアプリケーションエンジニアのid:nanto_viです。みなさんHTMLのフォーム検証機能は使っていますか? 近年は各Webブラウザの対応も進み、お手軽にフォームの利便性を高められるようになっています。 そんなフォーム検証機能のひとつがinput要素のpattern属性です。pattern属性の値にJavaScriptの正規表現パターンを指定することで、ユーザーの入力が意図しないものであった場合、フォーム送信ができなくなります。下図は5桁の数字の入力が求められるところに3桁しか入力せずフォーム送信しようとしたところです。ブラウザに組み込みのエラー表示が出現し、またそのメッセージにtitle属性の値が使われていることを確認できるでしょう。(pattern属性を指定する際には、title属性に書式の説明を記述することが推奨されています。) <input type="text"
正規表現ジェネレーターコマンド『rgxg』を使ってみる | 俺的備忘録 〜なんかいろいろ〜
諸事情あって正規表現について調べていたところ、どうやら正規表現を作成してくれる『rgxg』というコマンドがあるようだ。 早速、インストールして使ってみよう。 なお、検証したOSはUbuntu 14.04 LTSを用いている。 1.インストール まずはインストールから。 以下のコマンドでインストール出来る。 sudo apt-get install rgxg これでインストールが出来た。 2.実行 さて、それでは実際にコマンドを実行してみよう。 詳細な使い方については、manで見てもらうとして、ここではいくつかの例を抜粋して紹介する。 このrgxgコマンドでは、基本的には以下のようにサブコマンドを指定して正規表現を生成する。 rgxg [alternation,cidr,escape,range] 正規表現にしたい内容 blacknon@BS-PUB-UBUNTU-01:~$ rgxg Us
初心者歓迎！手と目で覚える正規表現入門・その１「さまざまな形式の電話番号を検索しよう」 - Qiita
はじめに Qiitaをご覧になっているエンジニアのみなさん、正規表現は使いこなせてますか？ 正規表現が使えるととっても便利ですよね！ あれ？そちらの方、「ぼく、正規表現ようわからへん・・・」って小さくなってませんか？？ 大丈夫です！そんなあなたのために、この記事を書きました。 知識ゼロからでも正規表現を学べるようにやさしく説明しているので、とりあえずこの記事を最後まで読んでみてください。 今は \d{2,5}[-(]\d{1,4}[-)]\d{4} が謎の呪文にしか見えなくても、最後まで読めばきっと意味がわかるようになっているはずです！ 対象となる読者 本記事は正規表現の予備知識が全くない「正規表現初心者」を対象としています。 正規表現は便利だってよく聞くけど、意味不明な呪文にしか見えなくてなんか怖い 正規表現を勉強しようと何度か頑張ったけど、結局よくわからなくて実務で活用できていない と
なるべく短い正規表現で住所を「都道府県/市区町村/それ以降」に分けるエクストリームスポーツ - Qiita
rex = /ごにょごにょ/ p "東京都文京区後楽１丁目３−６１".match(rex).captures #=> ["東京都", "文京区", "後楽１丁目３−６１"] みたいなやつ。なるべく短く。 実用性？ そんなもの、うちにはないよ。 TL;DR 「読むのめんどくさい」という人用に最初に最終結果を置いておきます (...??[都道府県])((?:旭川|伊達|石狩|盛岡|奥州|田村|南相馬|那須塩原|東村山|武蔵村山|羽村|十日町|上越|富山|野々市|大町|蒲郡|四日市|姫路|大和郡山|廿日市|下松|岩国|田川|大村)市|.+?郡(?:玉村|大町|.+?)[町村]|.+?市.+?区|.+?[市区町村])(.+) あまり厳密ではないのでちゃんとしたとこでは使わないほうがいいです 住所データを用意する 郵便局からデータをダウンロードしておく。一ヶ月毎に更新されている。 → 郵便番号データ
正規表現入門講座 ＨＴＭＬタグの削除
★ 正規表現で、簡単に文章を検索・置換していきましょう めんどくさい作業も一発変換 作業効率アップ間違いなし★ ＨＴＭＬタグの削除 <("[^"]*"|'[^']*'|[^'">])*> 解説 htmlタグ、 <p class="bk1"><a href="index.html">TOP</a></p> <p class="bk2"><a href="page0101.html">特殊文字</a></p> <p class="bk3"><a href="page0201.html">数字の検索</a></p> <!--///////////////* ページタイトル ここから *///////////////--> <div id="pagetitle"> <h3>正規表現とは？</h3> 例えば、このサイトのＨＴＭＬタグですが、ここから本文だけ取り出したい、 そんな時に使用する正規表
99%のEmailアドレスにマッチする正規表現公開される | ソフトアンテナ
一見Emailアドレスにマッチする正規表現を組み立てるのは簡単そうに思えますが、RFC 5322に厳密に準拠した正規表現を創りだそうとするととんでも無い努力が必要となるようです。 「Email Address Regular Expression That 99.9% Works」は、様々なプログラミング言語ごとに、Emailアドレスに99%マッチする正規表現を掲載したサイトで、例えばPerl 5.10より前のバージョンのPerl用として、掲載されている長大な正規表現を見れば、その難易度の高さを確認することができます。 正規表現にはなんの解説もなくどのような意図をもって作られたのか説明はありません(よって99%マッチするかどうかは本当のところは不明)。ちなみに日本語で読める貴重な情報「Perlメモ」では、「perl5.6.0以前の perl ではメールアドレスの正規表現を正確に記述すること
JavaScriptによる正規表現の可視化ツール「Regulex」 | ソフトアンテナ
正規表現は様々なプログラミング言語やツールで利用できる、文字列の検索や置換に不可欠の存在といっても過言ではないかもしれません。 「Regulex」はその正規表現を可視化して分かりやすくグラフとして表示してくれるサービスです。 文字列で正規表現を入力すると対応したグラフが表示されるので、複雑な正規表現も直感的に理解できます(?)。 例1 例えば「(a|b\d+)*c」をビジュアライズすると以下のようなグラフが作られます。 グループがあってその中でaまたはbと数字の繰り返しがきて、最後にcがくる…というような正規表現が、グラフ化されました。 例2 もう少し簡単な例「abc\d+」を考えると次のようになります。 abcがきて、最後に数字の繰り返しが1回以上くる…。ということが直感的に理解できます。 まとめ 作成した正規表現グラフはイメージとして出力したり、サイトに埋め込んだりもできます(Java
正規表現を解析して可視化してくれるサイトが凄すぎる件
ある正規表現に対して、特定の文字列がマッチするかどうかをチェックするツールやサイトは沢山ありますが、正規表現そのものが何を意味しているのか、どんな文字列を期待しているのかを解析・解読・説明してくれるツールやサイトってなかなか見ない気がします。 他人の書いた正規表現を見て、「ん？」ってなったことはありませんか？ 例えばこれ。 1 ^[a-zA-Z0-9-_.]@([a-zA-Z0-9_-]+\.)+[a-zA-Z]{2,4}$ これくらいなら分かりますが、複雑になってくるとつらい… いつかはマスターしたいけど…今は楽したい。 そう思ってググってみると…ありました！ それがこちら。 Regexper http://www.regexper.com/ 正規表現を入力して Display をクリックすると、その正規表現が表す内容を図にして表示してくれます。 例えば先程の正規表現は、当記事の一番上の
最強の正規表現の覚え方とは「CotEditor」かもしれない – 和洋風KAI
今の今まで、NSStringの潤沢かつ便利なメソッドの数々に甘えてしまったために、正規表現をいまさら勉強しているするぷ（ @isloop ）です。 こんな俺用メモなんかもつくってみたりしているのですが、やはりなんでもそうですが書かないと覚えないですね。 とはいえ、ちょっと効率のよい覚え方を編み出した気がします。 といってもCotEditorを使うだけなのですが。 CotEditorの素晴らしき検索・置換機能とハイライト機能。 プログラミング中に正規表現を試す場合は、どうしても処理を書かないといけません。さらに、そもそも正規表現が合っていないとキチンと出力されません。 正規表現がまだまだうろ覚えの僕は、なかなかスパーンと成功しないので書くたびイライラしていたのですが、プログラムに正規表現を走らせる前に、CotEditorに読み込ませたら、まるでアラサーの美人教師（赤眼鏡）の様に丁寧に添削して
モダンなインターフェースで正規表現が学べる『RegExr v2.0』 | 100SHIKI
よくあるツールではあるが、今風のインターフェースだったのでご紹介。 RegExr v2.0を使えば、さまざまな正規表現をブラウザ上で試すことができる。 ちゃんとリファレンスも付いているので、迷った時に参照してみるといいだろう。 また作った正規表現はコミュニティとシェアしたりお気に入りに入れることもできる。 そろそろ正規表現をマスターしたい・・・という人はいかがだろうか。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
まだ正規表現で消耗してるの？
「正規表現とg, iフラグ」 ～マンガでプログラミング用語解説
正規表現入門 星の高さを求めて
TEST CORDING » Sassの@functionの使い方まとめ – プログラマブルな処理は@function
IDEA * IDEA
