Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
JSにおける正規表現
Search
ls_pr
March 11, 2021
0
98
JSにおける正規表現
ls_pr
March 11, 2021
Tweet
Share
More Decks by ls_pr
See All by ls_pr
戦場で生き抜く 炎上案件の耐え方
ls_pr
0
170
自作PCのすすめ
ls_pr
0
100
ツボを押さえたWFの作り方
ls_pr
0
94
Linuxのちょこっと調べ
ls_pr
0
93
色々な色の話~今日から使える簡単配色テクニック3つ~
ls_pr
0
210
ゼロから始めるフロントエンドモジュール開発についてあれこれ
ls_pr
0
83
ejsのすすめ
ls_pr
0
130
Vue.jsの機能を使って色々作ってみた
ls_pr
0
370
NuxtではじめるVue.js
ls_pr
0
260
Featured
See All Featured
StorybookのUI Testing Handbookを読んだ
zakiyama
28
5.5k
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
Building Applications with DynamoDB
mza
93
6.2k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
46
2.4k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
59k
Code Reviewing Like a Champion
maltzj
521
39k
Six Lessons from altMBA
skipperchong
27
3.6k
Unsuck your backbone
ammeep
669
57k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
120k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
4
440
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Transcript
JSにおける正規表現 中村 祐太
目次/概要 1. 正規表現とは 2. JSの主な正規表現パターン 3. 正規表現オブジェクトの生成 4. 動作オプションの設定 個人的に疑問の多かった正規表現を、ざっくりと勉強した結果の発表。
正規表現の基礎の基礎を説明。 具体的な応用・活用等には踏み込まない。
1. 正規表現(Regular Expression)とは • 文字列をパターン化して表現する仕組み • 条件に合う文字列を検索し、処理を行える ・文字列が条件と適合するか「テスト」する ・条件に合う文字列を「取得」する ・〃指定した区切り文字で「分割」する
・〃新しい文字列に「置換」する → test() → match(),exec() → split() → replace() 目的の処理 併用するメソッド
1. 正規表現(Regular Expression)とは 「文字列をパターン化」? 郵便番号 0~9の数字3桁 + “-” + 0~9の数字4桁
携帯電話番号 0 + 7~9のどれか1つ + 0 + “-” + 0~9の数字4桁 + “-” + 0~9の数字4桁 000-0000 080-1234-5678
2. JSの主な正規表現パターン 基本形 量指定 位置指定 文字セット ABC [ABC] [^ABC] [A-Z]
A|B|C X* X? X+ X{n} X{n,} X{m, n} ^ $ . \w \W \d \D \n \r \t \s \S \~
2. JSの主な正規表現パターン 郵便番号 携帯電話番号 0~9の数字3桁 + “-” + 0~9の数字4桁 0
+ 7~9のどれか1つ + 0 + “-” + 0~9の数字4桁 + “-” + 0~9の数字4桁 ^[0-9]{3}-[0-9]{4}$ または ^\d{3}-\d{4}$ ^0[789]0-[0-9]{4}-[0-9]{4}$ または ^0[789]0-\d{4}-\d{4}$ ^ :文字列の先頭を指定 $ :文字列の末尾を指定 [0-9] :0~9の数字 {n} :直前に指定した文字とn回一致 \d :数字を示す([0-9と同意])
3. 正規表現オブジェクトの生成 方法① コンストラクターを使用 方法② 正規表現リテラルを使用 正規表現は文字列として指定するため、バックスラッシュ(\)の挙動に注意 (※JSの文字列において、 “\”は意味を持った予約文字) 正規表現パターンそのものにスラッシュ(/)を使用する場合は、エスケープ処理を行う
(※正規表現において、 “/”は意味を持った予約文字)
3. 正規表現オブジェクトの生成 余談 「RegExpオブジェクト」と簡単に書きましたが、 肝心の”RegExp”の読み方はハッキリしていません。 最後の”p”の発音が特に困るようで、 最早”p”は無視して「れげっくす」「れじぇっくす」と読んだり、 割り切ってフルネームで「レギュラーエクスプレッション」と読んだり、 全てを諦めて「正規表現」と読んでしまう事もあるようです。 今回の件に限らず、読み方が今一つハッキリしないプログラミング用語を、
他の方はどう読んでいるのか気になったりもします。
4. オプション(フラグ)の設定 「g」「i」「m」「u」等のオプションを付け加えることで、 パターンに応じた検索の挙動を制御出来る。 フラグ フラグ名 効果 g Global 初めの1件のみでなく、文字列全体を検索対象にする
i Ignorecase 大文字/小文字の違いを無視する m Multiline 「^」「$」が「行頭」「行末」を示すようになる u Unicode サロゲートペア文字(※)が認識可能になる ※サロゲートペア文字: 本来は1文字を2バイトで表現するUTF-8が、扱える文字数の拡張のため4バイトで表現している文字。 主要なオプションは以下↓