├── .github
    └── workflows
    │   └── deploy.yml
├── .gitignore
├── .vscode
    └── markdown.json.code-snippets
├── README.md
├── assets
    └── 06-04-13-57-28.png
├── deploy.sh
├── docs
    ├── .vuepress
    │   ├── components
    │   │   ├── Exercise.vue
    │   │   ├── Problem.vue
    │   │   └── SolutionLink.vue
    │   ├── config.js
    │   ├── public
    │   │   ├── favicon.png
    │   │   ├── images
    │   │   │   └── icons
    │   │   │   │   ├── android-chrome-192x192.png
    │   │   │   │   ├── android-chrome-384x384.png
    │   │   │   │   ├── apple-touch-icon.png
    │   │   │   │   ├── browserconfig.xml
    │   │   │   │   ├── favicon-16x16.png
    │   │   │   │   ├── favicon-32x32.png
    │   │   │   │   ├── favicon.ico
    │   │   │   │   ├── mstile-150x150.png
    │   │   │   │   └── safari-pinned-tab.svg
    │   │   ├── manifest.webmanifest
    │   │   └── pwaicon.png
    │   └── utils
    │   │   └── event.js
    ├── README.md
    ├── lesson
    │   ├── README.md
    │   ├── assertion.md
    │   ├── back_referencing.md
    │   ├── capturing_groups.md
    │   ├── character_ranges.md
    │   ├── conditionals.md
    │   ├── end.md
    │   ├── excluding_characters.md
    │   ├── greeding.md
    │   ├── introduction_and_abcs.md
    │   ├── kleene_operators.md
    │   ├── letters_and_digits.md
    │   ├── line_beginning_end.md
    │   ├── matching_characters.md
    │   ├── misc_meta_characters.md
    │   ├── more_groups.md
    │   ├── nested_groups.md
    │   ├── non_capture_group.md
    │   ├── optional_characters.md
    │   ├── repeating_characters.md
    │   ├── whitespaces.md
    │   ├── wildcards_dot.md
    │   └── xend.md
    ├── problem
    │   ├── complete.md
    │   ├── extracting_log_data.md
    │   ├── extracting_url_data.md
    │   ├── matching_decimal_numbers.md
    │   ├── matching_emails.md
    │   ├── matching_filenames.md
    │   ├── matching_html.md
    │   ├── matching_phone_numbers.md
    │   └── trimming_whitespace.md
    └── resources.md
├── package-lock.json
└── package.json


/.github/workflows/deploy.yml:
--------------------------------------------------------------------------------
 1 | name: GitHub Pages deploy
 2 | on:
 3 |   push:
 4 |     branches:
 5 |       - master
 6 | jobs:
 7 |   checkout-and-deploy:
 8 |     runs-on: ubuntu-latest
 9 |     steps:
10 |     - name: Checkout  # Checkout项目
11 |       uses: actions/checkout@master
12 |     - name: Set up Node.js  # Nodejs版本
13 |       uses: actions/setup-node@master
14 |       with:
15 |         node-version: 12.13.0
16 |     - name: Install and Build
17 |       run: |
18 |         npm install
19 |         npm run docs:build
20 |     - name: Deploy to GitHub Pages
21 |       uses: JamesIves/github-pages-deploy-action@4.1.3
22 |       with:
23 |         branch: gh-pages
24 |         folder: docs/.vuepress/dist
25 | 


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
  1 | .DS_Store
  2 | 
  3 | # Logs
  4 | logs
  5 | *.log
  6 | npm-debug.log*
  7 | yarn-debug.log*
  8 | yarn-error.log*
  9 | lerna-debug.log*
 10 | .pnpm-debug.log*
 11 | 
 12 | # Diagnostic reports (https://nodejs.org/api/report.html)
 13 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
 14 | 
 15 | # Runtime data
 16 | pids
 17 | *.pid
 18 | *.seed
 19 | *.pid.lock
 20 | 
 21 | # Directory for instrumented libs generated by jscoverage/JSCover
 22 | lib-cov
 23 | 
 24 | # Coverage directory used by tools like istanbul
 25 | coverage
 26 | *.lcov
 27 | 
 28 | # nyc test coverage
 29 | .nyc_output
 30 | 
 31 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
 32 | .grunt
 33 | 
 34 | # Bower dependency directory (https://bower.io/)
 35 | bower_components
 36 | 
 37 | # node-waf configuration
 38 | .lock-wscript
 39 | 
 40 | # Compiled binary addons (https://nodejs.org/api/addons.html)
 41 | build/Release
 42 | 
 43 | # Dependency directories
 44 | node_modules/
 45 | jspm_packages/
 46 | 
 47 | # Snowpack dependency directory (https://snowpack.dev/)
 48 | web_modules/
 49 | 
 50 | # TypeScript cache
 51 | *.tsbuildinfo
 52 | 
 53 | # Optional npm cache directory
 54 | .npm
 55 | 
 56 | # Optional eslint cache
 57 | .eslintcache
 58 | 
 59 | # Microbundle cache
 60 | .rpt2_cache/
 61 | .rts2_cache_cjs/
 62 | .rts2_cache_es/
 63 | .rts2_cache_umd/
 64 | 
 65 | # Optional REPL history
 66 | .node_repl_history
 67 | 
 68 | # Output of 'npm pack'
 69 | *.tgz
 70 | 
 71 | # Yarn Integrity file
 72 | .yarn-integrity
 73 | 
 74 | # dotenv environment variables file
 75 | .env
 76 | .env.test
 77 | .env.production
 78 | 
 79 | # parcel-bundler cache (https://parceljs.org/)
 80 | .cache
 81 | .parcel-cache
 82 | 
 83 | # Next.js build output
 84 | .next
 85 | out
 86 | 
 87 | # Nuxt.js build / generate output
 88 | .nuxt
 89 | dist
 90 | 
 91 | # Gatsby files
 92 | .cache/
 93 | # Comment in the public line in if your project uses Gatsby and not Next.js
 94 | # https://nextjs.org/blog/next-9-1#public-directory-support
 95 | # public
 96 | 
 97 | # vuepress build output
 98 | .vuepress/dist
 99 | 
100 | # Serverless directories
101 | .serverless/
102 | 
103 | # FuseBox cache
104 | .fusebox/
105 | 
106 | # DynamoDB Local files
107 | .dynamodb/
108 | 
109 | # TernJS port file
110 | .tern-port
111 | 
112 | # Stores VSCode versions used for testing VSCode extensions
113 | .vscode-test
114 | 
115 | # yarn v2
116 | .yarn/cache
117 | .yarn/unplugged
118 | .yarn/build-state.yml
119 | .yarn/install-state.gz
120 | .pnp.*
121 | docs/.vuepress/components/tmp.js
122 | 


--------------------------------------------------------------------------------
/.vscode/markdown.json.code-snippets:
--------------------------------------------------------------------------------
 1 | {
 2 | 	// Place your regexone-cn 工作区 snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and 
 3 | 	// description. Add comma separated ids of the languages where the snippet is applicable in the scope field. If scope 
 4 | 	// is left empty or omitted, the snippet gets applied to all languages. The prefix is what is 
 5 | 	// used to trigger the snippet and the body will be expanded and inserted. Possible variables are: 
 6 | 	// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. 
 7 | 	// Placeholders with the same ids are connected.
 8 | 	// Example:
 9 | 	// "Print to console": {
10 | 	// 	"scope": "javascript,typescript",
11 | 	// 	"prefix": "log",
12 | 	// 	"body": [
13 | 	// 		"console.log('$1');",
14 | 	// 		"$2"
15 | 	// 	],
16 | 	// 	"description": "Log output to console"
17 | 	// }
18 | 	"Exercise": {
19 | 		"scope": "markdown",
20 | 		"prefix": "exercise",
21 | 		"body": [
22 | 			"<Exercise", 
23 | 			"  title=\"练习 $1：$2\"",
24 | 			"  :data='[$3]'",
25 | 		  ">$5</Exercise>"
26 | 		],
27 | 		"description": "Exercise component"
28 | 	}
29 | }


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # RegexOne 中文版
 2 | 
 3 | [https://regexone.com](https://regexone.com) 中文版，通过简单的交互式练习来学习正则表达式。
 4 | 
 5 | [在线阅读](https://imageslr.github.io/regexone-cn)
 6 | 
 7 | <img widtg="650px" src="./assets/06-04-13-57-28.png" />
 8 | 
 9 | **翻译约定：**
10 | * You -> 您
11 | * 专业术语，需要在括号中补充对应的英文单词
12 | * 全部使用半角引号 " / '
13 | 
14 | **贡献指南：**
15 | * 项目采用 [VuePress](https://vuepress.vuejs.org/) 开发，请先熟悉相关文档
16 | * 安装依赖：`npm install`
17 | * 运行项目：`npm run docs:dev`
18 | * 添加小节：在 `docs/lesson` 目录下新建文件；在 `docs/.vuepress/config.js` 中补充 `sidebar` 链接


--------------------------------------------------------------------------------
/assets/06-04-13-57-28.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/imageslr/regexone-cn/4003b55fe3370d6c151360833b54271def13518b/assets/06-04-13-57-28.png


--------------------------------------------------------------------------------
/deploy.sh:
--------------------------------------------------------------------------------
 1 | #!/usr/bin/env sh
 2 | 
 3 | # 确保脚本抛出遇到的错误
 4 | set -e
 5 | 
 6 | # 生成静态文件
 7 | npm run docs:build
 8 | 
 9 | # 进入生成的文件夹
10 | cd docs/.vuepress/dist
11 | 
12 | # 如果是发布到自定义域名
13 | # echo 'www.example.com' > CNAME
14 | 
15 | git init
16 | git add -A
17 | git commit -m 'deploy'
18 | 
19 | # 如果发布到 https://<USERNAME>.github.io
20 | # git push -f git@github.com:<USERNAME>/<USERNAME>.github.io.git master
21 | 
22 | # 如果发布到 https://<USERNAME>.github.io/<REPO>
23 | git push -f git@github.com:imageslr/regexone-cn.git master:gh-pages
24 | 
25 | cd -


--------------------------------------------------------------------------------
/docs/.vuepress/components/Exercise.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 |   <div class="exercise">
  3 |     <div
  4 |       class="title"
  5 |       v-text="title"
  6 |     />
  7 |     <div class="table-container">
  8 |       <table class="tasks_table">
  9 |         <tbody>
 10 |           <tr class="problem_header">
 11 |             <td class="task">Task</td>
 12 |             <td class="text">Text</td>
 13 |             <td
 14 |               v-if="hasGroup"
 15 |               class="groups"
 16 |             >Capture Groups</td>
 17 |             <td class="result">Result</td>
 18 |           </tr>
 19 |           <Problem
 20 |             v-for="(item, index) in data"
 21 |             :key="index"
 22 |             :data="item"
 23 |             :hasGroup="hasGroup"
 24 |             ref="problems"
 25 |           />
 26 |         </tbody>
 27 |       </table>
 28 |     </div>
 29 |     <div class="input_and_continue">
 30 |       <input
 31 |         class="exercise_input_field"
 32 |         type="text"
 33 |         autocapitalize="off"
 34 |         autocomplete="off"
 35 |         autocorrect="off"
 36 |         spellcheck="false"
 37 |         placeholder="Type your pattern"
 38 |         v-model="input"
 39 |       >
 40 |       <button
 41 |         v-if="noNext"
 42 |         class="continue"
 43 |         :class="{ disabled }"
 44 |         :disabled="disabled"
 45 |       >Continue ›</button>
 46 |       <button
 47 |         v-else
 48 |         class="continue"
 49 |         :class="{ disabled }"
 50 |         :disabled="disabled"
 51 |         @click="$router.push(nextLink)"
 52 |       >Continue ›</button>
 53 |     </div>
 54 |     <div
 55 |       class="solution"
 56 |       v-show="showAnswer"
 57 |     >
 58 |       <slot></slot>
 59 |     </div>
 60 |     <div class="solution_hint">
 61 |       解决上述任务以继续下一个问题，或者查看<a
 62 |         class="show_solution_button"
 63 |         @click="showAnswer = !showAnswer"
 64 |       >答案</a>。
 65 |     </div>
 66 |   </div>
 67 | </template>
 68 | 
 69 | <script>
 70 | export default {
 71 |   editorInputTimeoutTimer: null,
 72 |   editorLastInput: null,
 73 | 
 74 |   props: {
 75 |     data: Array,
 76 |     title: String,
 77 |     solution: String,
 78 |     noNext: {
 79 |       type: Boolean,
 80 |       default: false
 81 |     },
 82 |     nextUrl: String,
 83 |   },
 84 |   data() {
 85 |     return {
 86 |       showAnswer: false,
 87 |       input: "",
 88 |       disabled: true,
 89 |     };
 90 |   },
 91 |   computed: {
 92 |     nextLink() {
 93 |       return this.nextUrl || getDefauleNextUrl(this.$site, this.$page);
 94 |     },
 95 |     hasGroup() {
 96 |       return this.data.some((item) => !!item.captureData);
 97 |     },
 98 |   },
 99 |   watch: {
100 |     input() {
101 |       this.update();
102 |     },
103 |   },
104 |   mounted() {
105 |     this.$on("set-input", (v) => (this.input = v));
106 |   },
107 |   methods: {
108 |     update() {
109 |       null != this.editorInputTimeoutTimer &&
110 |         clearTimeout(this.editorInputTimeoutTimer);
111 |       this.editorInputTimeoutTimer = setTimeout(() => {
112 |         this.updateFromInput();
113 |         this.editorInputTimeoutTimer = null;
114 |       }, 64);
115 |     },
116 |     updateFromInput() {
117 |       var { input } = this.$data;
118 |       if (input != this.editorLastInput) {
119 |         var pattern = this.recurseCompletePattern(
120 |           input,
121 |           0,
122 |           input.length,
123 |           null
124 |         )[1];
125 |         var verify = true;
126 |         this.$refs.problems.forEach(
127 |           (k) => (verify = k.verifyInput(input, pattern) && verify)
128 |         );
129 |         verify ? (this.disabled = false) : (this.disabled = true);
130 |         this.editorLastInput = input;
131 |       }
132 |     },
133 |     recurseCompletePattern(
134 |       a /* input */,
135 |       c /* i */,
136 |       b /* input.length */,
137 |       d /* appendix */
138 |     ) {
139 |       for (var g = "", k = b, e = c; e <= b; e++) {
140 |         var f = "";
141 |         0 < e && (f = a.charAt(e - 1));
142 |         var h = a.charAt(e);
143 |         if (e == b) {
144 |           null != d && (g += d);
145 |           break;
146 |         }
147 |         if (
148 |           (")" == d && "}" == h && "\\" != f) ||
149 |           (")" == d && "]" == h && "\\" != f) ||
150 |           ("]" == d && ")" == h && "\\" != f) ||
151 |           ("]" == d && "}" == h && "\\" != f) ||
152 |           ("}" == d && "]" == h && "\\" != f) ||
153 |           ("}" == d && ")" == h && "\\" != f)
154 |         ) {
155 |           g += d;
156 |           k = e;
157 |           break;
158 |         } else if (h == d && e < b) {
159 |           g += h;
160 |           k = e + 1;
161 |           break;
162 |         } else if ("(" == h && "\\" != f)
163 |           (f = this.recurseCompletePattern(a, e + 1, b, ")")),
164 |             (g += h + f[1]),
165 |             (e += f[0]);
166 |         else if ("[" == h && "\\" != f)
167 |           (f = this.recurseCompletePattern(a, e + 1, b, "]")),
168 |             (g += h + f[1]),
169 |             (e += f[0]);
170 |         else if ("{" == h && "\\" != f)
171 |           (f = this.recurseCompletePattern(a, e + 1, b, "}")),
172 |             (g += h + f[1]),
173 |             (e += f[0]);
174 |         else if (e < b) g += h;
175 |         else break;
176 |       }
177 |       return [k - c, g];
178 |     },
179 |   },
180 | };
181 | 
182 | function getDefauleNextUrl(site, page) {
183 |   const { sidebar } = site.themeConfig;
184 |   const { regularPath } = page;
185 |   let currentPath = regularPath.match(/^(.*).html$/)[1];
186 |   let nextPath = null;
187 |   sidebar.some((group) => {
188 |     return group.children.some((link, i) => {
189 |       if (link == currentPath) {
190 |         if (group.children[i + 1]) {
191 |           nextPath = group.children[i + 1] + ".html";
192 |         } else {
193 |           nextPath = "/" // 没有下一个链接，就跳回主页
194 |         }
195 |         return true;
196 |       }
197 |       return false;
198 |     });
199 |   });
200 |   return nextPath;
201 | }
202 | </script>
203 | 
204 | <style lang="scss">
205 | .exercise {
206 |   margin: 0.75em auto 0 auto;
207 |   padding: 1em 26px;
208 |   font-size: 1.125em;
209 |   overflow-x: auto;
210 |   border: 1px solid #eaecef;
211 |   border-radius: 0.15em 0.15em 0.15em 0.15em;
212 | }
213 | 
214 | .title {
215 |   padding-bottom: 0.5em;
216 |   font-size: 0.9em;
217 |   // text-transform: capitalize;
218 |   color: #757575;
219 | }
220 | 
221 | .table-container {
222 |   width: 100%;
223 |   overflow-x: auto;
224 | 
225 |   .tasks_table {
226 |     min-width: 100%;
227 |     display: table;
228 | 
229 |     .problem_header {
230 |       border: none;
231 | 
232 |       td {
233 |         padding: 0.25em 0;
234 |         font: bold 0.9em "Ruda", "Segoe UI", "Calibri", "Trebuchet MS",
235 |           Helvetica, Verdana, sans-serif;
236 |         color: #444;
237 |         border: none;
238 |         border-bottom: 1px solid #dcdcdc;
239 | 
240 |         &.task {
241 |           padding-right: 1.5em;
242 |           text-align: center;
243 |         }
244 | 
245 |         &.result {
246 |           width: 4em;
247 |           text-align: center;
248 |         }
249 |       }
250 |     }
251 | 
252 |     tr {
253 |       background-color: transparent;
254 |       border: none;
255 |     }
256 |   }
257 | }
258 | 
259 | .input_and_continue {
260 |   border: 1px solid #e6e5dc;
261 |   border-radius: 0.15em 0.15em 0.15em 0.15em;
262 | 
263 |   &::before,
264 |   &::after {
265 |     display: block;
266 |     content: " ";
267 |     clear: both;
268 |   }
269 | 
270 |   .exercise_input_field {
271 |     float: left;
272 |     width: 75%;
273 |     height: 2em;
274 |     font-size: 1.125em;
275 |     font-family: monospace;
276 |     padding: 0 15px;
277 |     border: 0;
278 |     box-sizing: border-box;
279 |   }
280 | 
281 |   .continue {
282 |     float: left;
283 |     width: 25%;
284 |     height: 2em;
285 |     padding: 0;
286 |     text-align: center;
287 |     font-size: 1.125em;
288 |     border: 0;
289 |     background: #42b983;
290 |     color: #fff;
291 |     transition: background-color 225ms;
292 |     box-sizing: border-box;
293 |     cursor: pointer;
294 |     border-radius: 0 0.15em 0.15em 0;
295 | 
296 |     &.disabled {
297 |       background: #c9c9c9;
298 |       color: #f9f9f9;
299 |       transition: background-color 225ms;
300 |     }
301 |   }
302 | 
303 |   @media (max-width: 768px) {
304 |     .exercise_input_field {
305 |       width: 100%;
306 |     }
307 | 
308 |     .continue {
309 |       width: 100%;
310 |     }
311 |   }
312 | }
313 | 
314 | .solution {
315 |   margin: 1em 0 0 0;
316 |   padding: 0.75em;
317 |   font-size: 0.9em;
318 |   border-radius: 0.25em 0.25em 0.25em 0.25em;
319 |   background-color: #f5f5f5;
320 | 
321 |   > * {
322 |     margin-top: 0.75em;
323 |     margin-bottom: 0.75em;
324 | 
325 |     &:first-child {
326 |       margin-top: 0;
327 |     }
328 |     &:last-child {
329 |       margin-bottom: 0;
330 |     }
331 |   }
332 | }
333 | 
334 | .solution_hint {
335 |   padding-top: 0.75em;
336 |   font-size: 0.875em;
337 |   font-style: italic;
338 |   color: #888;
339 | 
340 |   .show_solution_button {
341 |     cursor: pointer;
342 |   }
343 | }
344 | </style>


--------------------------------------------------------------------------------
/docs/.vuepress/components/Problem.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 |   <tr class="problem">
  3 |     <td
  4 |       class="task"
  5 |       v-text="type"
  6 |     />
  7 |     <td
  8 |       class="text"
  9 |       v-html="textHtml"
 10 |     />
 11 |     <td
 12 |       v-if="hasGroup"
 13 |       class="groups"
 14 |     >
 15 |       <span
 16 |         v-for="(item, i) in captureData && captureData.results"
 17 |         :key="item"
 18 |         class="group"
 19 |         :class="{succeeded: groupSucceed[i], error: groupError[i]}"
 20 |         v-text="item"
 21 |       />
 22 |     </td>
 23 |     <td
 24 |       class="result"
 25 |       :class="{ succeed: status, failed: !status }"
 26 |       v-text="result"
 27 |     />
 28 |   </tr>
 29 | </template>
 30 | 
 31 | <script>
 32 | import _ from "lodash";
 33 | export default {
 34 |   props: {
 35 |     data: Object,
 36 |     hasGroup: Boolean,
 37 |   },
 38 |   data() {
 39 |     return {
 40 |       result: "",
 41 |       textHtml: this.escapeHtml(this.data.text),
 42 |       groupSucceed: [],
 43 |       groupError: [],
 44 |       status: false, // succeed or failed
 45 |     };
 46 |   },
 47 |   computed: {
 48 |     type() {
 49 |       return this.data.type;
 50 |     },
 51 |     text() {
 52 |       return this.data.text;
 53 |     },
 54 |     captureData() {
 55 |       return this.data.captureData;
 56 |     },
 57 |     isNonCaptureGroup() {
 58 |       return this.data.captureData && this.data.captureData.nonCapture;
 59 |     },
 60 |   },
 61 |   methods: {
 62 |     clearResult() {
 63 |       this.textHtml = this.escapeHtml(this.data.text);
 64 |       this.clearNonTextResult();
 65 |     },
 66 |     clearNonTextResult() {
 67 |       this.result = "";
 68 |       this.groupSucceed = [];
 69 |       this.groupError = [];
 70 |     },
 71 |     verifyInput(input, pattern) {
 72 |       try {
 73 |         if (0 == input.length) return this.clearResult(), false;
 74 |         var res1 = null,
 75 |           res2 = null;
 76 | 
 77 |         try {
 78 |           res1 = this.text.match(RegExp(input, ""));
 79 |         } catch (_) {}
 80 |         try {
 81 |           res2 = this.text.match(new RegExp(pattern, ""));
 82 |         } catch (_) {}
 83 | 
 84 |         if ("match" == this.type || "capture" == this.type) {
 85 |           if (null != res2) {
 86 |             var html =
 87 |               this.escapeHtml(this.text.substring(0, res2.index)) +
 88 |               "<span class='match_succeeded'>" +
 89 |               this.escapeHtml(res2[0]) +
 90 |               "</span>" +
 91 |               this.escapeHtml(
 92 |                 this.text.substring(
 93 |                   res2.index + res2[0].length,
 94 |                   this.text.length
 95 |                 )
 96 |               );
 97 |             this.textHtml = html;
 98 |           }
 99 |           if (null != res1) {
100 |             if (this.captureData) {
101 |               var matched = res1.slice(1, res1.length),
102 |                 inter = _.intersection(matched, this.captureData.results),
103 |                 diff = _.difference(this.captureData.results, inter);
104 |               this.captureData.results.forEach((c, i) => {
105 |                 -1 != _.indexOf(inter, c)
106 |                   ? this.markGroupMatched(i)
107 |                   : -1 != _.indexOf(diff, c) && this.markGroupMissed(i);
108 |               });
109 |               if (this.isNonCaptureGroup) {
110 |                 return 0 == inter.length
111 |                   ? this.markSucceeded()
112 |                   : this.markFailed();
113 |               } else {
114 |                 return 0 == diff.length
115 |                   ? this.markSucceeded()
116 |                   : this.markFailed();
117 |               }
118 |             }
119 |             return this.markSucceeded();
120 |           }
121 |           null != res2 ? this.clearNonTextResult() : this.clearResult();
122 |           return this.markFailed();
123 |         }
124 |         if ("skip" == this.type) {
125 |           if (null == res1) return this.clearResult(), true;
126 |           var html =
127 |             this.escapeHtml(this.text.substring(0, res1.index)) +
128 |             "<span class='match_failed'>" +
129 |             this.escapeHtml(res1[0]) +
130 |             "</span>" +
131 |             this.escapeHtml(
132 |               this.text.substring(res1.index + res1[0].length, this.text.length)
133 |             );
134 |           this.textHtml = html;
135 |           return this.markFailed();
136 |         }
137 |         alert("Invalid type");
138 |       } catch (_) {
139 |         console.log(_);
140 |       }
141 |       return false;
142 |     },
143 |     markSucceeded() {
144 |       this.result = "Success";
145 |       this.status = true;
146 |       return true;
147 |     },
148 |     markFailed() {
149 |       this.result = "Failed";
150 |       this.status = false;
151 |       return false;
152 |     },
153 |     markGroupMatched(i) {
154 |       if (this.isNonCaptureGroup) {
155 |         this.$set(this.groupError, i, true);
156 |       } else {
157 |         this.$set(this.groupSucceed, i, true);
158 |       }
159 |     },
160 |     markGroupMissed(i) {
161 |       if (this.isNonCaptureGroup) {
162 |         this.$set(this.groupError, i, false);
163 |       } else {
164 |         this.$set(this.groupSucceed, i, false);
165 |       }
166 |     },
167 |     escapeHtml(s) {
168 |       return s
169 |         .replace(/&/g, "&amp;")
170 |         .replace(/</g, "&lt;")
171 |         .replace(/>/g, "&gt;")
172 |         .replace(/"/g, "&quot;")
173 |         .replace(/'/g, "&#039;");
174 |     },
175 |   },
176 | };
177 | </script>
178 | 
179 | <style lang="scss">
180 | .problem {
181 |   td {
182 |     border: none;
183 |     padding: 0.5em 0 0 0;
184 |     font-size: 0.9375em;
185 | 
186 |     &.task {
187 |       width: 1em;
188 |       padding-right: 1.5em;
189 |       vertical-align: top;
190 |       text-align: center;
191 |       text-transform: capitalize;
192 |     }
193 | 
194 |     &.text {
195 |       padding-right: 0.5em;
196 |       white-space: pre;
197 |       vertical-align: top;
198 |       color: black;
199 | 
200 |       .match_succeeded {
201 |         color: #42b983;
202 |       }
203 | 
204 |       .match_failed {
205 |         color: #f66;
206 |       }
207 |     }
208 | 
209 |     &.groups {
210 |       width: 10em;
211 |       font-size: 0.825em;
212 |       padding-right: 0.5em;
213 | 
214 |       .group {
215 |         display: inline-block;
216 |         padding: 0.25em 0.5em;
217 |         background: #f5f5f5;
218 |         border-radius: 0.25em 0.25em 0.25em 0.25em;
219 |         transition: background-color 225ms, color 225ms;
220 |         white-space: nowrap;
221 |         margin-top: 0.25em;
222 |         margin-right: 0.25em;
223 | 
224 |         &.succeeded {
225 |           background: #42b983;
226 |           color: white;
227 |           transition: background-color 225ms, color 225ms;
228 |         }
229 | 
230 |         &.error {
231 |           background: #f66;
232 |           color: white;
233 |           transition: background-color 225ms, color 225ms;
234 |         }
235 |       }
236 |     }
237 | 
238 |     &.result {
239 |       vertical-align: top;
240 |       text-align: center;
241 |       opacity: 0;
242 |       transition: opacity 225ms;
243 | 
244 |       &.succeed {
245 |         color: #42b983;
246 |         opacity: 1;
247 |         transition: opacity 225ms;
248 |       }
249 | 
250 |       &.failed {
251 |         color: #f66;
252 |         opacity: 1;
253 |         transition: opacity 225ms;
254 |       }
255 |     }
256 |   }
257 | }
258 | </style>
259 | 


--------------------------------------------------------------------------------
/docs/.vuepress/components/SolutionLink.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |   <a
 3 |     class="editor_val"
 4 |     @click='click()'
 5 |   >{{ text }}</a>
 6 | </template>
 7 | 
 8 | <script>
 9 | export default {
10 |   props: {
11 |     text: String
12 |   },
13 |   methods: {
14 |     click () {
15 |       this.$parent.$emit("set-input", this.text)
16 |     }
17 |   }
18 | }
19 | </script>
20 | 
21 | <style scoped>
22 | .editor_val {
23 |   cursor: pointer;
24 | }
25 | </style>


--------------------------------------------------------------------------------
/docs/.vuepress/config.js:
--------------------------------------------------------------------------------
  1 | const { removePlugin, PLUGINS } = require('@vuepress/markdown')
  2 | 
  3 | module.exports = {
  4 |   base: "/regexone-cn/",
  5 | 
  6 |   title: "RegexOne 中文 - 通过简单的交互式练习来学习正则表达式",
  7 |   description: "通过简单的交互式练习来学习正则表达式｜regexone.com 中文翻译",
  8 |   head: [
  9 |     ['link', { rel: 'icon', href: '/favicon.png' }],
 10 |     ['link', { rel: 'manifest', href: '/manifest.webmanifest' }],
 11 |     ['meta', { name: 'theme-color', content: '#3eaf7c' }],
 12 |     ['meta', { name: 'apple-mobile-web-app-capable', content: 'yes' }],
 13 |     ['meta', { name: 'apple-mobile-web-app-status-bar-style', content: 'default' }],
 14 |     ['link', { rel: 'apple-touch-icon', href: `/images/icons/apple-touch-icon.png` }],
 15 |     ['link', { rel: 'mask-icon', href: '/images/icons/safari-pinned-tab.svg', color: '#3eaf7c' }],
 16 |     ['meta', { name: 'msapplication-TileColor', content: '#3eaf7c' }],
 17 |     ['meta', { name: 'msapplication-TileImage', content: '/images/icons/mstile-150x150.png' }],
 18 |     ['meta', { name: 'application-name', content: 'RegexOne' }],
 19 |     ['meta', { name: 'apple-mobile-web-app-title', content: 'RegexOne' }],
 20 |     [
 21 |       "link",
 22 |       { rel: "shortcut icon", type: "image/x-icon", href: `/favicon.png` },
 23 |     ],
 24 |     ...googleAnalytics(),
 25 |   ],
 26 | 
 27 |   themeConfig: {
 28 |     repo: "imageslr/regexone-cn",
 29 |     editLinkText: "编辑此页面",
 30 | 
 31 |     nav: [
 32 |       { text: "课程", link: "/lesson/introduction_and_abcs" },
 33 |       { text: "问题", link: "/problem/matching_decimal_numbers" },
 34 |       { text: "资源", link: "/resources"},
 35 |       { text: "RegexOne 官方网站", link: "https://regexone.com" },
 36 |     ],
 37 | 
 38 |     sidebar: [
 39 |       {
 40 |         title: "课程",
 41 |         // collapsable: false,
 42 |         children: [
 43 |           "/lesson/introduction_and_abcs",
 44 |           "/lesson/letters_and_digits",
 45 |           "/lesson/wildcards_dot",
 46 |           "/lesson/matching_characters",
 47 |           "/lesson/excluding_characters",
 48 |           "/lesson/character_ranges",
 49 |           "/lesson/repeating_characters",
 50 |           "/lesson/kleene_operators",
 51 |           "/lesson/optional_characters",
 52 |           "/lesson/whitespaces",
 53 |           "/lesson/line_beginning_end",
 54 |           "/lesson/capturing_groups",
 55 |           "/lesson/nested_groups",
 56 |           "/lesson/more_groups",
 57 |           "/lesson/conditionals",
 58 |           "/lesson/misc_meta_characters",
 59 |           "/lesson/end"
 60 |         ],
 61 |       },
 62 |       {
 63 |         title: "问题",
 64 |         // collapsable: false,
 65 |         children: [
 66 |           "/problem/matching_decimal_numbers",
 67 |           "/problem/matching_phone_numbers",
 68 |           "/problem/matching_emails",
 69 |           "/problem/matching_html",
 70 |           "/problem/matching_filenames",
 71 |           "/problem/trimming_whitespace",
 72 |           "/problem/extracting_log_data",
 73 |           "/problem/extracting_url_data",
 74 |           "/problem/complete",
 75 |         ],
 76 |       },
 77 |       {
 78 |         title: "进阶课程",
 79 |         children: [
 80 |           "/lesson/back_referencing",
 81 |           "/lesson/assertion",
 82 |           "/lesson/non_capture_group",
 83 |           "/lesson/greeding",
 84 |           "/lesson/xend"
 85 |         ]
 86 |       },
 87 |       '/resources'
 88 |     ],
 89 |   },
 90 | 
 91 |   chainMarkdown (config) {
 92 |     removePlugin(config, PLUGINS.EMOJI)
 93 |   },
 94 | 
 95 |   plugins: {
 96 |     '@vuepress/pwa': {
 97 |       serviceWorker: true,
 98 |       updatePopup: true
 99 |     }
100 |   }
101 | };
102 | 
103 | function googleAnalytics() {
104 |   return process.env.NODE_ENV === "development"
105 |     ? []
106 |     : [
107 |         [
108 |           "script",
109 |           {
110 |             async: true,
111 |             src: "https://www.googletagmanager.com/gtag/js?id=G-CK9QTEBZD3",
112 |           },
113 |         ],
114 |         [
115 |           "script",
116 |           {},
117 |           `
118 |         window.dataLayer = window.dataLayer || [];
119 |         function gtag(){dataLayer.push(arguments);}
120 |         gtag('js', new Date());
121 |         gtag('config', 'G-CK9QTEBZD3');`,
122 |         ],
123 |       ];
124 | }
125 | 


--------------------------------------------------------------------------------
/docs/.vuepress/public/favicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/imageslr/regexone-cn/4003b55fe3370d6c151360833b54271def13518b/docs/.vuepress/public/favicon.png


--------------------------------------------------------------------------------
/docs/.vuepress/public/images/icons/android-chrome-192x192.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/imageslr/regexone-cn/4003b55fe3370d6c151360833b54271def13518b/docs/.vuepress/public/images/icons/android-chrome-192x192.png


--------------------------------------------------------------------------------
/docs/.vuepress/public/images/icons/android-chrome-384x384.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/imageslr/regexone-cn/4003b55fe3370d6c151360833b54271def13518b/docs/.vuepress/public/images/icons/android-chrome-384x384.png


--------------------------------------------------------------------------------
/docs/.vuepress/public/images/icons/apple-touch-icon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/imageslr/regexone-cn/4003b55fe3370d6c151360833b54271def13518b/docs/.vuepress/public/images/icons/apple-touch-icon.png


--------------------------------------------------------------------------------
/docs/.vuepress/public/images/icons/browserconfig.xml:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" encoding="utf-8"?>
 2 | <browserconfig>
 3 |     <msapplication>
 4 |         <tile>
 5 |             <square150x150logo src="/images/icons/mstile-150x150.png"/>
 6 |             <TileColor>#da532c</TileColor>
 7 |         </tile>
 8 |     </msapplication>
 9 | </browserconfig>
10 | 


--------------------------------------------------------------------------------
/docs/.vuepress/public/images/icons/favicon-16x16.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/imageslr/regexone-cn/4003b55fe3370d6c151360833b54271def13518b/docs/.vuepress/public/images/icons/favicon-16x16.png


--------------------------------------------------------------------------------
/docs/.vuepress/public/images/icons/favicon-32x32.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/imageslr/regexone-cn/4003b55fe3370d6c151360833b54271def13518b/docs/.vuepress/public/images/icons/favicon-32x32.png


--------------------------------------------------------------------------------
/docs/.vuepress/public/images/icons/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/imageslr/regexone-cn/4003b55fe3370d6c151360833b54271def13518b/docs/.vuepress/public/images/icons/favicon.ico


--------------------------------------------------------------------------------
/docs/.vuepress/public/images/icons/mstile-150x150.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/imageslr/regexone-cn/4003b55fe3370d6c151360833b54271def13518b/docs/.vuepress/public/images/icons/mstile-150x150.png


--------------------------------------------------------------------------------
/docs/.vuepress/public/images/icons/safari-pinned-tab.svg:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0" standalone="no"?>
 2 | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
 3 |  "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
 4 | <svg version="1.0" xmlns="http://www.w3.org/2000/svg"
 5 |  width="384.000000pt" height="384.000000pt" viewBox="0 0 384.000000 384.000000"
 6 |  preserveAspectRatio="xMidYMid meet">
 7 | <metadata>
 8 | Created by potrace 1.14, written by Peter Selinger 2001-2017
 9 | </metadata>
10 | <g transform="translate(0.000000,384.000000) scale(0.100000,-0.100000)"
11 | fill="#000000" stroke="none">
12 | <path d="M294 3831 c-87 -21 -182 -91 -233 -169 -65 -101 -61 10 -61 -1732 0
13 | -1290 3 -1596 14 -1642 25 -107 104 -201 216 -256 l55 -27 1605 -3 c1105 -2
14 | 1621 1 1656 8 81 17 175 83 223 156 22 34 46 74 53 90 18 40 25 3175 8 3276
15 | -20 117 -99 216 -220 276 l-55 27 -1615 2 c-888 0 -1629 -2 -1646 -6z"/>
16 | </g>
17 | </svg>
18 | 


--------------------------------------------------------------------------------
/docs/.vuepress/public/manifest.webmanifest:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "RegexOne",
 3 |   "short_name": "RegexOne",
 4 |   "description": "通过简单的交互式练习来学习正则表达式",
 5 |   "start_url": "/index.html",
 6 |   "display": "standalone",
 7 |   "background_color": "#fff",
 8 |   "theme_color": "#3eaf7c",
 9 |   "icons": [
10 |     {
11 |       "src": "/regexone-cn/images/icons/android-chrome-192x192.png",
12 |       "sizes": "192x192",
13 |       "type": "image/png"
14 |     },
15 |     {
16 |       "src": "/regexone-cn/images/icons/android-chrome-384x384.png",
17 |       "sizes": "384x384",
18 |       "type": "image/png"
19 |     }
20 |   ]
21 | }


--------------------------------------------------------------------------------
/docs/.vuepress/public/pwaicon.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/imageslr/regexone-cn/4003b55fe3370d6c151360833b54271def13518b/docs/.vuepress/public/pwaicon.png


--------------------------------------------------------------------------------
/docs/.vuepress/utils/event.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue'
2 | export default new Vue();


--------------------------------------------------------------------------------
/docs/README.md:
--------------------------------------------------------------------------------
 1 | ---
 2 | home: true
 3 | heroText: RegexOne 中文
 4 | tagline: 通过简单的交互式练习来学习正则表达式
 5 | actionText: 开始阅读 →
 6 | actionLink: /lesson/introduction_and_abcs
 7 | ---
 8 | 
 9 | <Exercise 
10 |   style="max-width: 750px"
11 |   title="练习 1：匹配字符"
12 |   :data='[{type: "match", text: "abcdefg"}, {type: "match", text: "abcde"}, {type: "match", text: "abc"}]'
13 |   nextUrl="/lesson/introduction_and_abcs.html"
14 | >输入前三个字符 <SolutionLink text="abc" />。</Exercise>
15 | <div class="footer" style="border-top:none"><a
16 |   href="https://regexone.com" target="_blank">regexone.com</a> 的中文翻译版本 (非官方), by <a href="https://github.com/imageslr" target="_blank">imageslr</a>, 2021.</div>


--------------------------------------------------------------------------------
/docs/lesson/README.md:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/imageslr/regexone-cn/4003b55fe3370d6c151360833b54271def13518b/docs/lesson/README.md


--------------------------------------------------------------------------------
/docs/lesson/assertion.md:
--------------------------------------------------------------------------------
 1 | # 课程 A2：零宽断言
 2 | 
 3 | 零宽断言用于指定要匹配的内容的**前缀或后缀应该满足的约束条件**，匹配到的内容并**不包含**这些前缀 / 后缀。“零宽”的含义是**没有宽度、只匹配位置、不匹配内容**；“断言”用来声明一个应该为真的事实，只有断言为真时正则表达式才会匹配。
 4 | 
 5 | 下面是正则表达式中的四种零宽断言：
 6 | 
 7 | | 语法 | 作用 | 名称 |
 8 | |-----|-----|-----|
 9 | | `(?=exp)` | 指定后缀 | 零宽度正预测先行断言 <br/> zero-width positive lookahead assertion |
10 | | `(?<=exp)` | 指定前缀 | 零宽度正回顾后发断言<br/> zero-width positive lookbehind assertion |
11 | | `(?!exp)` | 指定后缀*不能是* | 零宽度负预测先行断言<br/>zero-width negative lookahead assertion |
12 | | `(?<!exp)` | 指定前缀*不能是* | 零宽度负回顾后发断言<br/>zero-width negative lookbehind assertion |
13 | 
14 | 例如，模式 `\w+(?=ing)` 会匹配所有以 `ing` 结尾的单词，模式 `(?<=un)\w+` 会匹配所有以 `un` 开头的单词。注意：**断言左右两侧的括号是必须的**。
15 | 
16 | 上面这四个语法可以这样理解：
17 | * `=` 表示“是”、`!` 表示“不是”
18 | * `<` 是一个向左的箭头，表示表达式的左面，也就是前缀
19 | 
20 | 我们不需要记住每个语法的具体名称，只要知道怎么用就可以。请尝试完成下面的练习。
21 | 
22 | <Exercise
23 |   title='练习 A2-1：匹配后缀是 "ly" 的单词'
24 |   :data='[
25 |     {type: "skip", text: "sad"},
26 |     {type: "match", text: "slightly"},
27 |     {type: "match", text: "hardly"},
28 |     {type: "match", text: "perfectly"},
29 |     {type: "match", text: "suddenly"}
30 |   ]'
31 |   :noNext="true"
32 | >
33 | 
34 | 最简单的方法是使用模式 <SolutionLink text="\w+ly" />来匹配所有以 `ly` 结尾的单词。我们也可以使用 <SolutionLink text="\w+(?=ly)" />，这个模式匹配的内容并不包含 `ly`。请注意对比这两个模式的匹配结果的区别。
35 | 
36 | </Exercise>
37 | 
38 | <Exercise
39 |   title='练习 A2-2：匹配前缀是 "un" 的单词'
40 |   :data='[
41 |     {type: "skip", text: "happy"},
42 |     {type: "match", text: "unfinished"},
43 |     {type: "match", text: "undoubted"},
44 |     {type: "match", text: "unused"},
45 |     {type: "match", text: "unhappy"}
46 |   ]'
47 |   :noNext="true"
48 | >
49 | 
50 | 可以使用模式 <SolutionLink text="un\w+" /> 或 <SolutionLink text="(?<=un)\w+" /> 来匹配所有以 `un` 开头的单词。请注意对比这两个模式的匹配结果的区别。
51 | 
52 | </Exercise>
53 | 
54 | <Exercise
55 |   title='练习 A2-3：只匹配前两行的 "re"'
56 |   :data='[
57 |     {type: "match", text: "represents"},
58 |     {type: "match", text: "reclaim"},
59 |     {type: "skip", text: "regex"},
60 |     {type: "skip", text: "regular"},
61 |   ]'
62 |   :noNext="true"
63 | >
64 | 
65 | 可以使用模式 <SolutionLink text="re(?!g)" />，该模式限定了 `re` 右边不能是字符 `g`。
66 | 
67 | </Exercise>
68 | 
69 | <Exercise
70 |   title='练习 A2-4：只匹配第一行的 "happy"'
71 |   :data='[
72 |     {type: "match", text: "happy"},
73 |     {type: "skip", text: "unhappy"},
74 |   ]'
75 | >
76 | 
77 | 可以使用模式 <SolutionLink text="(?<!un)happy" />，该模式限定了 `happy` 左边不能是前缀 `un`。
78 | 
79 | </Exercise>
80 | 
81 | 
82 | 


--------------------------------------------------------------------------------
/docs/lesson/back_referencing.md:
--------------------------------------------------------------------------------
 1 | # 课程 A1：反向引用
 2 | 
 3 | ::: tip 说明
 4 | 进阶课程是译者针对 [regexone.com](https://regexone.com) 课程中没有涉及的内容所作的补充。
 5 | :::
 6 | 
 7 | **反向引用 (back referencing)**，或者回溯引用，是指通过 `\0`、`\1`、`\2` 这样的变量形式来引用模式中已经匹配到的部分。`\0` 表示整个模式匹配到的文本，`\1` 表示捕获的第一个组、`\2` 表示捕获的第二个组，以此类推。
 8 | > 在模式中，嵌套组按照**从左到右**的*左括号*出现的顺序定义，第一个捕获组是第一个括号里的内容，以此类推。捕获的结果也按照这个顺序排列。见[课程 12：嵌套组](nested_groups.html)
 9 | 
10 | 回溯引用在**替换字符串**时十分常用。比如在使用正则表达式搜索文本中的两个数字并交换它们的位置时，可以先使用模式 `(\d+)-(\d+)` 来搜索，再使用 `\2-\1` 来替换。下面是 JavaScript 中的代码示例：
11 | 
12 | ```js
13 | "123-456".replace(
14 |   /(\d+)-(\d+)/, // searchValue
15 |   "$2-$1" // replaceValue, $1、$2 等价于上文的 \1、\2
16 | ) 
17 | // Output => "456-123"
18 | ```
19 | 
20 | 或者，当我们需要在文本中**匹配两个连续的相同单词**时，也可以使用反向引用。下面是一段 JS 代码示例，用于删除字符串中的连续的重复单词：
21 | 
22 | ```js
23 | "hello hello world world".replace(
24 |   /(\w+) \1/g, // g 表示全局匹配，即匹配整个字符串中满足该模式的所有子串，而不仅是第一个
25 |   "$1"
26 | )
27 | // Output => "hello world"
28 | ```
29 | 
30 | 请尝试完成下面的练习：
31 | 
32 | <Exercise
33 |   title="练习 A1：匹配两个连续的相同单词"
34 |   :data='[
35 |     {type: "capture", text: "hello hello world", captureData: {results: ["hello hello"]}}
36 |   ]'
37 | >
38 | 
39 | 使用模式 <SolutionLink text="((\w+) \2)" />，其中 `\2` 表示从左到右第二个括号 `(\w+)` 捕获到的单词。
40 | 
41 | </Exercise>


--------------------------------------------------------------------------------
/docs/lesson/capturing_groups.md:
--------------------------------------------------------------------------------
 1 | # 课程 11：捕获组
 2 | 
 3 | 正则表达式不仅允许我们匹配文本，还允许我们提取信息以便进一步处理。这是通过定义**字符组 (groups of characters)** 并使用特殊的圆括号 **(** 和 **)** 元字符捕获它们来实现的。一对括号内的任何子模式 (subpattern) 都将被**捕获** (capture) 为一个组 (group)。实际上，它可以用来从各种数据中提取诸如电话号码或电子邮件之类的信息。
 4 | 
 5 | 例如，假设您有一个命令行工具来列出云中的所有图像文件，您可以使用 **`^(IMG\d+\.png)$`** 等模式来捕获和提取完整的文件名。但如果只想捕获不带扩展名的文件名，您可以使用模式 **`^(IMG\d+)\.png$`**，该模式只捕获句点之前的部分。
 6 | 
 7 | 尝试使用圆括号来编写一个正则表达式，匹配下面 PDF 文件的文件名 (不包括扩展名)。
 8 | 
 9 | <Exercise
10 |   title="练习 11：捕获组"
11 |   :data='[
12 |     {type: "capture", text: "file_record_transcript.pdf", captureData: {results: ["file_record_transcript"]}}, 
13 |     {type: "capture", text: "file_07241999.pdf", captureData: {results: ["file_07241999"]}}, 
14 |     {type: "skip", text: "testfile_fake.pdf.tmp"}]'
15 | >我们只想捕获以 "file" 开始并具有文件扩展名 ".pdf" 的行，因此我们可以编写一个简单的模式来捕获从开头的 "file" 到扩展名之间的所有内容，比如 <SolutionLink text="^(file.+)\.pdf$" />。</Exercise>


--------------------------------------------------------------------------------
/docs/lesson/character_ranges.md:
--------------------------------------------------------------------------------
 1 | # 课程 5：字符范围
 2 | 
 3 | 我们刚刚学习了如何创建一个匹配或排除特定字符的模式——但是如果我们想匹配一个连续范围内的字符呢？我们只能把它们全部列出来吗？
 4 | 
 5 | 幸运的是，在使用方括号表示法时，有一种速记方法，可以通过使用**破折号**来表示字符范围，从而匹配到**连续范围**内的字符。例如，模式 **`[0-6]`** 将只匹配从 0 到 6 的任意单个数字字符。同样的，**`[^n-p]`** 将只匹配字母 n 到 p **以外**的任何单个字符。
 6 | 
 7 | 同一组方括号中还可以使用多个字符范围，以及单个字符。例如字母数字 (alphanumeric) 元字符 `\w`，它相当于字符范围 **`[A-Za-z0-9_]`**，通常用于匹配英文文本中的字符。
 8 | 
 9 | 在下面的练习中，请注意所有匹配行和跳过行共有的模式，并使用方括号表示法来匹配或跳过每行中的每个字符。请注意，模式是**区分大小写**的，并且 **`a-z`** 与 **`A-Z`** 在匹配的字符方面是**不同**的（小写 vs 大写）。
10 | 
11 | <Exercise
12 |   title="练习 5：匹配字符范围"
13 |   :data='[{type: "match", text: "Ana"}, {type: "match", text: "Bob"}, {type: "match", text: "Cpc"}, {type: "skip", text: "aax"}, {type: "skip", text: "bby"}, {type: "skip", text: "ccz"}]'
14 | >从上到下，每个位置的字符都是连续的，因此可以使用 <SolutionLink text="[A-C][n-p][a-c]" /> 中的不同范围来只匹配前三行。</Exercise>


--------------------------------------------------------------------------------
/docs/lesson/conditionals.md:
--------------------------------------------------------------------------------
 1 | # 课程 14：条件
 2 | 
 3 | 正如我们前面提到的，更准确总是好的，这适用于编码、对话、以及正则表达式。例如，您不会写一份购物清单让别人**买更多的 .\*** (Buy more .\*)，因为您不知道您能得到什么。相反，您可以写**买更多的牛奶** (Buy more milk) 或**买更多的面包** (Buy more bread)。在正则表达式中，我们可以明确地定义这些条件 (conditionals)。
 4 | 
 5 | 我们可以使用 **`|` (逻辑或 locigal OR，也就是管道 pipe)** 来表示**可能的不同的字符集**，尤其是在使用组的时候。在上面的示例中，我们可以编写模式 `Buy more (milk|bread|juice)` 来匹配字符串 Buy more milk、Buy more bread 或 Buy more juice。
 6 | 
 7 | 与正常的组一样，您可以在条件 (condition) 中使用任何字符或元字符序列，例如，`([cb]ats*|[dh]ogs?)` 将要么匹配 cats 或 bats，要么匹配 dogs 或 hogs。编写具有许多条件的模式可能很难阅读，因此如果它们太复杂，您应该考虑将它们拆分为单独的模式。
 8 | 
 9 | 继续尝试写一个条件模式 (conditional pattern)，只匹配下面包含小动物的行。
10 | 
11 | <Exercise
12 |   title="练习 14：匹配条件文本"
13 |   :data='[{type: "match", text: "I love cats"}, {type: "match", text: "I love dogs"}, {type: "skip", text: "I love logs"}, {type: "skip", text: "I love cogs"}]'
14 | >通过使用逻辑或，我们可以使用表达式 <SolutionLink text="I love (cats|dogs)" /> 来匹配前两行。</Exercise>


--------------------------------------------------------------------------------
/docs/lesson/end.md:
--------------------------------------------------------------------------------
 1 | # 课程 X：无限与超越！
 2 | 
 3 | 恭喜你完成了所有课程！我们希望它们能让你对正则表达式有更多的经验。
 4 | 
 5 | 正则表达式中还有一些我们还没有研究过的主题，比如反向引用、贪婪表达式与非贪婪表达式、posix 表示法等等。我们将在[以后的课程](back_referencing.html)中详细描述这些内容。
 6 | 
 7 | 这里是一些有用的正则表达式学习资源：
 8 | * [正则表达式 30 分钟入门](https://deerchao.cn/tutorials/regex/regex.htm)
 9 | * [正则表达式状态图可视化工具](https://regexper.com/)
10 | * [在线正则表达式测试工具](https://deerchao.cn/tools/wegester/)
11 | 
12 | 如果您对如何改进网站有任何疑问或建议，请随时通过 [Github Issue](https://github.com/imageslr/regexone-cn/issues) 或电子邮件 ([elonzzz@163.com](mailto://elonzzz@163.com)) 联系！
13 | 
14 | 现在，请继续练习后续的问题，学习如何将正则表达式应用到实际场景中。
15 | 


--------------------------------------------------------------------------------
/docs/lesson/excluding_characters.md:
--------------------------------------------------------------------------------
 1 | # 课程 4：排除特定字符
 2 | 
 3 | 在某些情况下，我们可能不想匹配某些特定的字符，例如，我们可能只想匹配**不是**来自区号 650 的电话号码。
 4 | 
 5 | 为了表示这一点，我们使用**方括号**和 **`^`** (hat) 组成的表达式来**排除特定字符**。例如，模式 `[^abc]` 将匹配**除了**字母 a、b 或 c 以外的任意**单个**字符。
 6 | 
 7 | 在下面的字符串中，尝试写一个只匹配动物 (猪 hog、狗 dog，而不是沼泽 bog) 的模式。请注意，我们也可以使用上一课的技巧来编写模式，因为它们实际上是同一问题的两个方面。在编写模式时，您可以自己决定使用哪种方式更容易编写和理解。
 8 | 
 9 | <Exercise 
10 |   title="练习 4：排除字符"
11 |   :data='[{type: "match", text: "hog"}, {type: "match", text: "dog"}, {type: "skip", text: "bog"}]'
12 | >匹配以 "og" 结尾但不是 "bog" 的最简单的方法是表达式 <SolutionLink text=[^b]og />。或者，您也可以使用上一课学到的知识，使用 <SolutionLink text="[hd]og" /> 来只匹配 "hog" 和 "dog"。注意，后者是一个更严格的表达式，因为它限制了可以匹配的字符串。</Exercise>


--------------------------------------------------------------------------------
/docs/lesson/greeding.md:
--------------------------------------------------------------------------------
 1 | # 课程 A4：贪婪 vs 懒惰
 2 | 
 3 | 当正则表达式中包含 `*`、`+`、`?` 等表示重复的元字符时，默认会匹配**尽可能多**的字符，这被称为**贪婪匹配**。例如给定字符串 `abcab`，模式 `a.*b` 会匹配最长的以 `a` 开始、以 `b` 结束的字符串，也就是匹配到整个字符串而不是 `ab`。
 4 | 
 5 | 与贪婪匹配相反的是**非贪婪匹配**，或者称为**懒惰匹配**，也就是匹配**尽可能少**的字符。语法是在上述元字符后面加上一个**问号 `?`**。在上面的例子中，模式 `a.*?b` 将匹配到 `ab`。
 6 | 
 7 | 所有表示重复的元字符都可以转化为懒惰匹配模式：
 8 | * `*?`：重复任意次，但尽可能少重复
 9 | * `+?`：重复 1 次或更多次，但尽可能少重复
10 | * `??`：重复 0 次或 1 次，但尽可能少重复
11 | * `{n,m}?`：重复 n 到 m 次，但尽可能少重复
12 | * `{n,}?`：重复 n 次或更多次，但尽可能少重复
13 | 
14 | 在下面的练习中，请尝试修改模式 `(\d+)0*$`，使其捕获不包含 `0` 的数字前缀。
15 | 
16 | <Exercise
17 |   title="练习 A4：懒惰匹配"
18 |   :data='[
19 |     {type: "capture", text: "123000", captureData: {results: ["123"]}},
20 |     {type: "capture", text: "1010", captureData: {results: ["101"]}},
21 |     {type: "capture", text: "789", captureData: {results: ["789"]}},
22 |   ]'
23 | >
24 | 
25 | 默认情况下，正则表达式是贪婪匹配，所以 <SolutionLink text="\d+" /> 总是尽可能多地向后匹配，将后面的 `0` 也包含进来。将模式改为非贪婪匹配：<SolutionLink text="(\d+?)0*$" />，就可以让 `\d+` 尽可能少匹配，让 `0*` 尽可能多匹配。
26 | 
27 | </Exercise>


--------------------------------------------------------------------------------
/docs/lesson/introduction_and_abcs.md:
--------------------------------------------------------------------------------
 1 | # 课程 1：简介和字母 ABCs
 2 | 
 3 | **正则表达式 (regular expressions)** 是一个非常有用的工具，可以从诸如代码、日志文件、电子表格或文档等文本中提取信息。虽然规范的语言背后有许多理论，但后续的课程和例子将探索正则表达式的更实际的用法，以便您能够尽快使用这个工具。
 4 | 
 5 | 在使用正则表达式时要认识到的第一件事是：**所有东西本质上都是字符**，我们正在编写模式 (pattern) 来匹配特定的字符序列(也称为字符串)。大多数模式使用普通的 ASCII 字符，包括字母、数字、标点符号和键盘上的其他符号，如 %#$@!，但是也可以使用 unicode 字符来匹配任何类型的国际文本。
 6 | 
 7 | 下面是几行文本，当您在输入框中输入模式时，请注意每行的匹配字符是如何变化的。要继续下一课，您需要使用每个课程中介绍的新的语法 (syntax) 和概念，写出能够匹配给定的每行文本的模式。
 8 | 
 9 | 请尝试写一个能够匹配下面三行的模式，**很简单，找出每行的共同字母。**
10 | 
11 | <Exercise 
12 |   title="练习 1：匹配字母"
13 |   :data='[{type: "match", text: "abcdefg"}, {type: "match", text: "abcde"}, {type: "match", text: "abc"}]'
14 | >输入前三个字符 <SolutionLink text="abc" />。</Exercise>


--------------------------------------------------------------------------------
/docs/lesson/kleene_operators.md:
--------------------------------------------------------------------------------
 1 | # 课程 7：Kleene 操作符
 2 | 
 3 | 正则表达式中一个强大的概念是能够匹配任意数量的字符。例如，假设您编写了一个表单，其中有一个以美元为单位的捐赠字段。一个富有的用户可能会顺道来，想捐 25000 美元，而一个普通用户可能想捐 25 美元。
 4 | 
 5 | 表达这种模式的一种方法是使用**克莱尼星号 (Kleene Star)** 和**克莱尼加号 (Kleene Plus)**，分别表示 **0 个或更多个**、**1 个或更多个**它所跟随的字符 (或组)。例如，为了匹配上面的捐赠金额，我们可以使用模式 **`\d*`** 来匹配任意数量的数字，但是更严格的正则表达式是 **`\d+`**，它确保输入的字符串至少有一个数字。
 6 | 
 7 | 这些量词 (quantifiers) 可以与任意字符或特殊的元字符一起使用，例如 **`a+`** (一个或多个 a)、**`[abc]+`** (一个或多个字符 a、b 或 c) 和 **`.*`** (零个或多个**任意**字符)。
 8 | 
 9 | 下面是几个简单的字符串，您可以使用星号和加号元字符来匹配它们。
10 | 
11 | <Exercise
12 |   title="练习 7：匹配重复字符"
13 |   :data='[{type: "match", text: "aaaabcc"}, {type: "match", text: "aabbbbc"}, {type: "match", text: "aacc"}, {type: "skip", text: "a"}]'
14 | >
15 | 要匹配的字符串中，有至少两个 'a'、0 个或多个 'b'、至少一个 'c'，因此可以使用表达式 <SolutionLink text="aa+b*c+" /> 来表示。
16 | 
17 | 或者，一个限制性更强的表达式是 <SolutionLink text="a{2,4}b{0,4}c{1,2}" />，它为每个字符的数量都设置了一个上限和下限。
18 | 
19 | </Exercise>


--------------------------------------------------------------------------------
/docs/lesson/letters_and_digits.md:
--------------------------------------------------------------------------------
 1 | # 课程 1½：数字 123s
 2 | 
 3 | 字符包括普通的字母，也包括数字。事实上，数字 0-9 也是字符，如果您查看 [ASCII表](https://en.wikipedia.org/wiki/ASCII#ASCII_printable_characters)，会发现它们是按顺序列出的。
 4 | 
 5 | 在整个课程中，我们将会学习正则表达式中的一系列特殊元字符 (metacharacter)，这些元字符可用于匹配特定类型的字符。比如，字符 `\d` 可以用来代替**从 0 到 9 的任意数字**。前面的斜杠与简单的 `d` 区分，表示它是元字符。
 6 | 
 7 | 下面是另外几行包含数字的文本。尝试编写模式来匹配下面字符串中的所有数字，并注意您的模式是如何匹配**字符串中的任意位置**的，而不仅仅是从第一个字符开始。我们将在后续的课程中学习如何控制它。
 8 | 
 9 | <Exercise 
10 |   title="练习 1½：匹配数字"
11 |   :data='[{type: "match", text: "abc123xyz"}, {type: "match", text: "define \"123\""}, {type: "match", text: "var g = 123;"}]'
12 | >输入所有行共有的数字 <SolutionLink text="123" />。</Exercise>


--------------------------------------------------------------------------------
/docs/lesson/line_beginning_end.md:
--------------------------------------------------------------------------------
 1 | # 课程 10：开始与结束
 2 | 
 3 | 到目前为止，我们编写的正则表达式会在所有文本中匹配部分片段。有时这是不符合预期的，例如，我们想要在日志文件中匹配单词 "success"。我们当然不希望该模式与 "Error: unsuccessful operation!" 匹配。这就是为什么**最好的做法是编写尽可能特定的正则表达式**，以确保在与真实文本匹配时不会出现误报。
 4 | 
 5 | 使模式更严格的一种方法是使用特殊的元字符 **`^` (hat)** 和 **`$` (美元符号)** 来描述一行的开始和结束。在上面的例子中，我们可以使用模式 **`^success`** 来**只**匹配以单词 "success" 开头的行，而不匹配 "Error: unsuccessful operation"。如果我们把 `^` 和 `$` 结合起来，就能实现一个匹配从开头到结尾一整行的模式。
 6 | 
 7 | 请注意，**`^`** 和方括号 **`[^...]`** 中用于排除字符的 hat 不同，这在读取正则表达式时容易混淆。
 8 | 
 9 | 尝试使用这些新的特殊字符来匹配下面的第一个字符串。
10 | 
11 | <Exercise
12 |   title="练习 10：匹配行"
13 |   :data='[{type: "match", text: "Mission: successful"}, {type: "skip", text: "Last Mission: unsuccessful"}, {type: "skip", text: "Next Mission: successful upon capture of target"}]'
14 | >表达式 "Mission:successful" 会匹配文本中的任何位置，因此我们需要在表达式 <SolutionLink text="^Mission: successful$" /> 中使用开始和结束锚点，以便只匹配以 "Mission" 开头并以 "successful" 结尾的完整字符串。</Exercise>


--------------------------------------------------------------------------------
/docs/lesson/matching_characters.md:
--------------------------------------------------------------------------------
 1 | # 课程 3：匹配特定字符
 2 | 
 3 | 上节课的点元字符非常强大，但有时**太**强大了。比如我们匹配电话号码时，并不希望将字母"(abc) def-ghij"视作一个有效的号码。
 4 | 
 5 | 有一种方法可以在正则表达式中**匹配特定字符**，方法是在**方括号 (square brackets)** 中定义它们。比如，模式 **`[abc]`** 将只匹配**单个**字母 a、b 或者 c，其他什么也不匹配。
 6 | 
 7 | 下面几行字符串中，我们只想匹配前三个而不匹配后三个。请注意，如果使用点元字符，我们就无法避免匹配后三个字符串。因此，必须使用上面的方法来明确声明要匹配的字母。
 8 | 
 9 | <Exercise 
10 |   title="练习 3：匹配特定字符"
11 |   :data='[{type: "match", text: "can"}, {type: "match", text: "man"}, {type: "match", text: "fan"}, {type: "skip", text: "dan"}, {type: "skip", text: "ran"}, {type: "skip", text: "pan"}]'
12 | >您可以使用表达式 <SolutionLink text="[cmf]an" /> 来只匹配 'can'、'man' 和 'fan'，而不匹配任何其他行。正如您将在下一课中看到的，您也可以使用逆表达式 (inverse expression) <SolutionLink text="[^drp]an" /> 来匹配任意以 'an' 结尾、但不以 'd'、'r' 或 'p' 开头的三个字母的单词。
13 | </Exercise>


--------------------------------------------------------------------------------
/docs/lesson/misc_meta_characters.md:
--------------------------------------------------------------------------------
 1 | # 课程 15：其他元字符
 2 | 
 3 | 这一小节将介绍一些其他的元字符，以及捕获组的结果。
 4 | 
 5 | 我们已经学习了最常见的元字符：数字 **`\d`**、空白符 **`\s`**、字母和数字 **`\w`**，但是正则表达式还提供了一种捕获每个元字符的相反集合的方法，即使用大写字母。例如，**`\D`** 表示任何**非数字**字符，**`\S`** 表示任何**非空白**字符，**`\W`** 表示任何**非字母或数字**字符 (如标点符号)。灵活使用这些元字符，会使编写正则表达式更容易
 6 | 
 7 | 此外，还有一个特殊的元字符 **`\b`**，它匹配单词和非单词字符之间的边界。它在捕获整个单词时最有用，例如模式 **`\w+\b`**。
 8 | 
 9 | 在这些课程中，我们不会详细探讨的一个概念是**反向引用 (back referencing)** (译者注：见[反向引用](back_referencing.html))，这主要是因为它在不同的实现里有所区别。但是，许多系统都允许您通过使用 **`\0`** (通常是完全匹配的文本)、**`\1`** (组 1)、**`\2`** (组 2) 等来引用捕获的组。这在某些情况下很有用，举个例子，当您需要使用正则表达式搜索文本中的两个数字并交换它们的位置时，可以先使用模式 `(\d+)-(\d+)` 来搜索，再使用 `\2-\1` 来替换。下面是一段 JavaScript 代码示例：
10 | 
11 | ```js
12 | "123-456".replace(
13 |   /(\d+)-(\d+)/, // searchValue
14 |   "$2-$1" // replaceValue, $1、$2 等价于上文的 \1、\2
15 | ) 
16 | // Output => "456-123"
17 | ```
18 | 
19 | 下面是一些不同的字符串，请尝试练习我们在前面的课程中学到的各种类型的元字符，并观察它们所匹配到的内容。
20 | 
21 | <Exercise
22 |   title="练习 15：匹配其他特殊字符"
23 |   :data='[{type: "match", text: "The quick brown fox jumps over the lazy dog."}, {type: "match", text: "There were 614 instances of students getting 90.0% or above."}, {type: "match", text: "The FCC had to censor the network for saying &$#*@!."}]'
24 | >
25 | 这节课的练习更像是一个沙盒，提供了一些示例文本。最简单的答案可以是 <SolutionLink text=".*" /> :) 
26 | 
27 | 译者注：试试看 <SolutionLink text="\w+\b" />，<SolutionLink text="[^\d\s\w]+" />
28 | 
29 | </Exercise>


--------------------------------------------------------------------------------
/docs/lesson/more_groups.md:
--------------------------------------------------------------------------------
 1 | # 课程 13：关于分组的更多内容
 2 | 
 3 | 正如您在前面的课程中看到的，所有的量词 (quantifiers) ——包括星号 **`*`**、加号 **`+`**、重复 **`{m，n}`** 和问号 **`?`** ——都可以在捕获组模式中使用。捕获组也是将量词应用于字符序列而不是单个字符的唯一方法。
 4 | 
 5 | 例如，如果我们知道一个电话号码可能包含区号，也可能不包含区号，那么正确的模式是测试整个数字组是否存在 **`(\d{3})?`**，而不是测试单个字符本身 (这是错误的)。
 6 | 
 7 | 根据您使用的正则表达式引擎，您还可以使用非捕获组 (non-capturing groups)，这将允许您匹配该组，但不会让它显示在结果中。
 8 | 
 9 | 下面是几种常见的显示器分辨率，请尝试捕获每个显示器的宽度和高度。
10 | 
11 | <Exercise
12 |   title="练习 13：匹配捕获组"
13 |   :data='[{type: "capture", text: "1280x720", captureData: {results: ["1280", "720"]}}, {type: "capture", text: "1920x1600", captureData: {results: ["1920", "1600"]}}, {type: "capture", text: "1024x768", captureData: {results: ["1024", "768"]}}]'
14 | >这个很简单，我们只需要捕获两组数字：<SolutionLink text="(\d+)x(\d+)" />。</Exercise>


--------------------------------------------------------------------------------
/docs/lesson/nested_groups.md:
--------------------------------------------------------------------------------
 1 | # 课程 12：嵌套组
 2 | 
 3 | 在处理复杂数据时，您经常会发现自己必须提取多层次的信息，这时就需要使用嵌套组 (nested groups)。通常，结果中的捕获组是按照它们被定义的顺序 (按开括号的顺序) 排列的。
 4 | 
 5 | 以上一课中 "捕获所有图像文件的文件名" 为例。如果每个图像文件的文件名中都有一个连续的图片编号，我们可以通过编写 **`^(IMG(\d+))\.png$`** 之类的表达式 (使用嵌套的括号来捕获数字)，使用同一个模式同时提取文件名和图片编号。
 6 | 
 7 | 在模式中，嵌套组按照从左到右的*左括号*出现的顺序定义，第一个捕获组是第一个括号里的内容，以此类推。捕获的结果也按照这个顺序排列。
 8 | 
 9 | 对于以下字符串，编写一个表达式，该表达式匹配**并捕获**完整日期和日期年份。
10 | 
11 | <Exercise
12 |   title="练习 12：匹配嵌套组"
13 |   :data='[{type: "capture", text: "Jan 1987", captureData: {results: ["Jan 1987", "1987"]}}, {type: "capture", text: "May 1969", captureData: {results: ["May 1969", "1969"]}}, {type: "capture", text: "Aug 2011", captureData: {results: ["Aug 2011", "2011"]}}]'
14 | >
15 | 这个表达式需要捕获两部分数据，即年份和整个日期。这需要使用嵌套的捕获组，如表达式 <SolutionLink text="(\w+ (\d+))" /> 所示。
16 | 
17 | 我们也可以使用 \s+ 来代替空格，以捕获月份和年份之间任意数量的空格。
18 | 
19 | </Exercise>


--------------------------------------------------------------------------------
/docs/lesson/non_capture_group.md:
--------------------------------------------------------------------------------
 1 | # 课程 A3：非捕获组
 2 | 
 3 | 在[课程 11：捕获组](capturing_groups.html)与[课程 A1：反向引用](back_referencing.html)中，我们已经学习到：一对括号内的任何子模式都将被捕获为一个组，每个组按照从左到右的左括号出现的顺序，编号从 `1` 开始递增。
 4 | 
 5 | 但是某些情况下，我们并不需要使用捕获组的内容，这个时候可以使用**非捕获组** (non-capturing groups)。非捕获组的语法是在捕获组的基础上，在左括号的右侧加上 `?:`，即 `(?:exp)`。使用非捕获组可以节省内存、提升效率。
 6 | 
 7 | 在下面这段 JavaScript 代码中，我们使用了非捕获组，反向引用 `$1` / `$2` 并没有与之对应的捕获组，在这里相当于**纯字符串**。
 8 | 
 9 | ```js
10 | "123-456".replace(
11 |   /(?:\d+)-(?:\d+)/, // searchValue
12 |   "$2-$1" // replaceValue, $1、$2 等价于反向引用 \1、\2
13 | ) 
14 | // Output => "$2-$1"
15 | ```
16 | 
17 | 请完成下面的练习，要求使用[条件语法](conditionals.html)匹配前两行的动物，但不能生成捕获组。
18 | 
19 | <Exercise
20 |   title="练习 A3：非捕获组"
21 |   :data='[
22 |     {type: "match", text: "I love cats", captureData: {results: ["cats"], nonCapture: true}}, 
23 |     {type: "match", text: "I love dogs", captureData: {results: ["dogs"], nonCapture: true}}, 
24 |     {type: "skip", text: "I love logs"}, 
25 |     {type: "skip", text: "I love cogs"}
26 |   ]'
27 | >
28 | 
29 | 如果使用模式 <SolutionLink text="I love (cats|dogs)" />，会同时捕获到 "cats"、"dogs"。改为 <SolutionLink text="I love (?:cats|dogs)" /> 就可以避免生成捕获组。
30 | 
31 | </Exercise>


--------------------------------------------------------------------------------
/docs/lesson/optional_characters.md:
--------------------------------------------------------------------------------
 1 | # 课程 8：可选字符
 2 | 
 3 | 正如您在上一课中看到的，Kleene star 和 plus 允许我们匹配一行中的重复字符。
 4 | 
 5 | 另一个在匹配和提取文本时非常常见的量词 (quantifier) 是 **`?`** (问号) 元字符，表示**可选性**。这个元字符允许您匹配前面的零个或一个字符或组。例如，模式 **`ab?c`** 将匹配字符串 "abc" 或 "ac"，因为 b 被认为是可选的。
 6 | 
 7 | 与点元字符类似，问号是一个特殊字符，您必须使用斜杠 **`\?`** 匹配字符串中的普通问号字符。
 8 | 
 9 | 在下面的字符串中，请注意找到的文件数是如何决定单词 "file" 的复数形式的。尝试编写一个模式，使用元字符 `?` 来匹配找到一个或多个文件的行。
10 | 
11 | <Exercise
12 |   title="练习 8：匹配可选字符"
13 |   :data='[{type: "match", text: "1 file found?"},{type: "match", text: "2 files found?"},{type: "match", text: "24 files found?"},{type: "skip", text: "No files found."},]'
14 | >
15 | 我们可以使用元字符 '\d' 来匹配文件的数量，并使用表达式 <SolutionLink text="\d+ files? found\?" /> 来匹配找到文件的所有行。
16 | 
17 | 请注意，第一个问号用于前面的 "s" 字符 (表示复数)，最后的问号必须转义以匹配文本。
18 | 
19 | </Exercise>


--------------------------------------------------------------------------------
/docs/lesson/repeating_characters.md:
--------------------------------------------------------------------------------
 1 | # 课程 6：匹配重复字符
 2 | 
 3 | *注意：有的正则表达式实现不支持下文重复语法的某些部分。*
 4 | 
 5 | 到目前为止，我们已经学习了如何指定要匹配的字符的范围，但是如何指定要匹配的字符的**重复次数**呢？一种方法是明确写出我们想要匹配多少个字符，例如 **`\d\d\d`**，它正好匹配三个数字。
 6 | 
 7 | 更方便的方法是使用**花括号**表示法指定每个字符的重复次数。例如，**`a{3}`** 将匹配字符 a 正好三次。某些正则表达式引擎甚至允许您指定重复次数的范围，例如，**`a{1,3}`** 将匹配字符 a 至多 3 次，至少 1 次。
 8 | 
 9 | 这个量词 (quantifier) 可以与任意字符或特殊的元字符一起使用，例如 **`w{3}`** (三个 w)、**`[wxy]{5}`** (五个字符，每个字符可以是 w、x 或 y) 和 **`.{2,6}`** (两到六个**任意**字符)。
10 | 
11 | ::: tip 译者注
12 | 花括号中的最大重复次数也可以省略：**`{n,}`** 表示重复至少 n 次，至多无限制。
13 | :::
14 | 
15 | 在下面的几行中，最后一个只有一个 z 的字符串并不是俚语 "wazzup" 的正确拼写。尝试使用上面的花括号符号来编写一个只匹配前两个拼写的模式。
16 | 
17 | <Exercise
18 |   title="练习 6：匹配重复字符"
19 |   :data='[{"type": "match", "text": "wazzzzzup"},{"type": "match", "text": "wazzzup"}, {"type": "skip", "text": "wazup"}]'
20 | >在我们必须匹配的前两行中有多个 'z'，因此表达式 <SolutionLink text="waz{3,5}up" /> 将匹配所有包含这些个 'z' 的字符串。</Exercise>
21 | 
22 | 进阶课程：[A4：贪婪 vs 懒惰](greeding.html)


--------------------------------------------------------------------------------
/docs/lesson/whitespaces.md:
--------------------------------------------------------------------------------
 1 | # 课程 9：空白字符
 2 | 
 3 | 在处理真实世界的输入时，例如日志文件或者用户输入，很难不遇到空白符 (whitespace)。我们使用它来格式化信息片段，使其更直观、易于阅读。但是一个空格却破坏了最简单的正则表达式。
 4 | 
 5 | 正则表达式中最常见的空白符的形式有**空格 (␣)**、**制表符 (\t)**、**换行 (\n)** 和**回车 (\r)** (在 Windows 环境中很有用)。这些特殊字符匹配的空白符各不相同，但特殊字符 **`\s`** 能够匹配上面的**任意**空白符，这在处理原始输入文本时非常有用。
 6 | 
 7 | 在下面的字符串中，您会发现每一行的内容都会在标号后面用一些空白符缩进 (**标号也是要匹配的文本的一部分**)。请尝试编写一个模式，该模式可以匹配在标号和内容之间包含空白字符的每一行。注意，空白字符和其他字符一样，也可以使用特殊的元字符，如星号和加号。
 8 | 
 9 | <Exercise
10 |   title="练习 9：匹配空白符"
11 |   :data='[{type: "match", text: "1.   abc"}, {type: "match", text: "2.	abc"}, {type: "match", text: "3.           abc"}, {type: "skip", text: "4.abc"}]'
12 | >
13 | 我们要匹配的是标号和 "abc" 之间有空格的行，也就是前三行。我们可以使用表达式 <SolutionLink text="\d\.\s+abc" /> 来匹配数字、实际句点 (必须转义)、一个或多个空白符，然后匹配文本。
14 | 
15 | 如果我们用 `*` 代替 `+`，我们也会匹配到第四行，但实际上我们想跳过它。
16 | 
17 | </Exercise>


--------------------------------------------------------------------------------
/docs/lesson/wildcards_dot.md:
--------------------------------------------------------------------------------
 1 | # 课程 2：点 Dot
 2 | 
 3 | 在一些纸牌游戏中，小丑是一个百搭牌 (wildcard)，可以代表桥牌中的任意一张牌。在使用正则表达式的时候，我们经常需要匹配一串不知道具体内容的、但是共享相同模式或结构的文本，例如电话号码或邮政编码。
 4 | 
 5 | 类似于纸牌游戏，正则表达式中也有**通配符 (wildcard)** 的概念，由元字符 `.` (点) 来表示，可以**匹配任意单个字符** (字母、数字、空格等等)。您可能会注意到，这包含了句点字符的匹配。因此，如果想专门匹配一个句点，我们需要使用斜杠来转义，也就是 `\.`。 
 6 | 
 7 | 下面是一些字符不同但长度相同的字符串。尝试编写一个可以匹配前三个字符串、但不能匹配最后一个 (要跳过的) 的模式。您可能会发现必须转义元字符 `.` 以匹配某些行中的句点。
 8 | 
 9 | <Exercise 
10 |   title="练习 2：使用通配符"
11 |   :data='[{type: "match", text: "cat."}, {type: "match", text: "896."}, {type: "match", text: "?=+."}, {type: "skip", text: "abc1"}]'
12 | >您可以使用 <SolutionLink text="...\." /> 来匹配前三个 (通配) 字符，同时转义最后一个通配符元字符来匹配到句点。这保证了它不会匹配到第四行的 '1'。</Exercise>


--------------------------------------------------------------------------------
/docs/lesson/xend.md:
--------------------------------------------------------------------------------
 1 | # 课程 AX：无限与超越！
 2 | 
 3 | 恭喜你完成了所有进阶课程！
 4 | 
 5 | 如果您对如何改进网站有任何疑问或建议，或者需要补充其他有关正则表达式的内容，请随时通过 [Github Issue](https://github.com/imageslr/regexone-cn/issues) 或电子邮件 ([elonzzz@163.com](mailto://elonzzz@163.com)) 联系！
 6 | 
 7 | 我的个人博客：[http://imageslr.com](http://imageslr.com)  
 8 | 我的 Github 主页：[https://github.com/imageslr](https://github.com/imageslr)
 9 | 
10 | 最后，希望这些课程对你有所帮助！


--------------------------------------------------------------------------------
/docs/problem/complete.md:
--------------------------------------------------------------------------------
 1 | # 问题 X：无限与超越！
 2 | 
 3 | 恭喜你解决了所有的问题！要了解如何在一些常用编程语言中使用正则表达式，请继续阅读下列文章。我们希望您可以开始在日常工作中应用正则表达式！
 4 | * [C#](https://regexone.com/references/csharp)
 5 | * [JavaScript](https://regexone.com/references/javascript)
 6 | * [Java](https://regexone.com/references/java)
 7 | * [PHP](https://regexone.com/references/php)
 8 | * [Python](https://regexone.com/references/python)
 9 | 
10 | 如果您对如何改进网站有任何疑问或建议，请随时通过 [Github Issue](https://github.com/imageslr/regexone-cn/issues) 或电子邮件 ([elonzzz@163.com](mailto://elonzzz@163.com)) 联系！


--------------------------------------------------------------------------------
/docs/problem/extracting_log_data.md:
--------------------------------------------------------------------------------
 1 | # 问题 7：从日志文件中提取信息
 2 | 
 3 | 在本例中，我们的目标是使用目前所学的任何正则表达式技术，从 Android adb 调试会话的实际输出日志中**提取文件名、方法名、堆栈跟踪行的行号**。它们在日志中的格式为：
 4 | ```
 5 | at package.class.methodname(filename:linenumber)
 6 | ```
 7 | 
 8 | <Exercise
 9 |   title="练习 7：从日志条目中提取数据"
10 |   :data='[
11 |     {type: "skip", text: "W/dalvikvm( 1553): threadid=1: uncaught exception"},
12 |     {type: "skip", text: "E/( 1553): FATAL EXCEPTION: main"},
13 |     {type: "skip", text: "E/( 1553): java.lang.StringIndexOutOfBoundsException"},
14 |     {type: "capture", text: "E/( 1553):   at widget.List.makeView(ListView.java:1727)", captureData: {results: ["makeView", "ListView.java", "1727"]}},
15 |     {type: "capture", text: "E/( 1553):   at widget.List.fillDown(ListView.java:652)", captureData: {results: ["fillDown","ListView.java", "652"]}},
16 |     {type: "capture", text: "E/( 1553):   at widget.List.fillFrom(ListView.java:709)", captureData: {results: ["fillFrom", "ListView.java", "709"]}},
17 |   ]'
18 | >我们只想捕获方法名、文件名和行号，这可以使用表达式 <SolutionLink text="(\w+)\(([\w\.]+):(\d+)\)" /> 来实现，其中第一个捕获组是方法名，之后是转义的括号、文件名、冒号，最后是行号。
19 | 
20 | 译者注：试试 <SolutionLink text="at \w*\.\w*\.([\w\.]+)" />、<SolutionLink text="\(([\w\.]+)" />、<SolutionLink text=":(\d+)" />
21 | 
22 | </Exercise>


--------------------------------------------------------------------------------
/docs/problem/extracting_url_data.md:
--------------------------------------------------------------------------------
 1 | # 问题 8：从 URL 中解析和提取数据
 2 | 
 3 | 在网络上处理文件和资源时，我们经常会遇到可以直接解析和使用的 URIs 和 URLs。大多数标准库都提供了用来解析和构造这类标识符的类，但是如果您需要在日志文件或更大的文本语料库中匹配它们，那么使用正则表达式可以很容易地从它们的结构化形式中提取信息。
 4 | 
 5 | URIs (统一资源标识符，Uniform Resource Identifiers)，是资源的一种表示方法，通常包括 <span style="color: #45aa2a;">scheme</span> ([方案名](https://zh.wikipedia.org/wiki/%E7%B5%B1%E4%B8%80%E8%B3%87%E6%BA%90%E6%A8%99%E8%AA%8C%E7%AC%A6%E6%96%B9%E6%A1%88))，<span style="color: #0073e6;">host</span> (主机名)，<span style="color: #bf00ff;">port</span> (端口，可选的) 和 <span style="color: #ff5000;">resource path</span> (资源路径)，如下所示：
 6 | 
 7 | <span style="color: #45aa2a;">http</span>://<span style="color: #0073e6;">regexone.com</span><span style="color: #bf00ff;">:80</span>/<span style="color: #ff5000;">page</span>
 8 | 
 9 | Scheme 描述了用于通信的协议 (protocol)，host 和 port 描述了资源的来源，path 描述了资源所在的位置。
10 | 
11 | 在下面的练习中，尝试提取出的所有资源的协议、主机和端口。
12 | 
13 | <Exercise
14 |   title="练习 8：从 URL 中提取数据"
15 |   :data='[
16 |     {type: "capture", text: "ftp://file_server.com:21/top_secret/life_changing_plans.pdf", captureData: {results: ["ftp", "file_server.com", "21"]}},
17 |     {type: "capture", text: "https://regexone.com/lesson/introduction#section", captureData: {results: ["https", "regexone.com"]}},
18 |     {type: "capture", text: "file://localhost:4040/zip_file", captureData: {results: ["file", "localhost", "4040"]}},
19 |     {type: "capture", text: "https://s3cur3-server.com:9999/", captureData: {results: ["https", "s3cur3-server.com", "9999"]}},
20 |     {type: "capture", text: "market://search/angry%20birds", captureData: {results: ["market", "search"]}},
21 |   ]'
22 | >
23 | 
24 | 我们必须分别匹配这三个部分：
25 | 
26 | * 列表中的协议都是字母组成的，所以可以使用 <SolutionLink text="(\w+)://" /> 匹配
27 | * 主机名可以包含非字母数字字符，如破折号或句点，因此可以使用 <SolutionLink text="://([\w\-\.]+)" /> 匹配；也可以使用 <SolutionLink text="://([^/:]+)" /> 匹配 
28 | * 端口是 URI 的可选部分，前面有冒号，可以使用 <SolutionLink text="(:(\d+))" /> 匹配
29 | 
30 | 最终的完整表达式为：<SolutionLink text="(\w+)://([\w\-\.]+)(:(\d+))?" />，或者 <SolutionLink text="(\w+)://([^/:]+)(:(\d+))?" />。
31 | 
32 | </Exercise>


--------------------------------------------------------------------------------
/docs/problem/matching_decimal_numbers.md:
--------------------------------------------------------------------------------
 1 | # 问题 1：匹配十进制数字
 2 | 
 3 | 乍一看，写一个正则表达式来匹配一个数字应该很容易吧？
 4 | 
 5 | 我们可以用特殊字符 **`\d`** 来匹配任何数字，唯一要做的就是匹配**小数点**。真的是这样吗？对于简单的数字来说，这没有问题，但是对于科学或金融数字来说，我们经常需要处理**正数和负数**、**有效数字**、**指数**，甚至不同的表示法 (比如用来分隔千和百万的逗号)。
 6 | 
 7 | 下面是您可能遇到的几种不同格式的数字。请注意您是如何匹配小数点本身的。如果无法顺利跳过最后一个数字，请观察该数字和其他数字的末尾的区别。
 8 | 
 9 | <Exercise
10 |   title="练习 1：匹配数字"
11 |   :data='[{type: "match", text: "3.14529"}, 
12 |   {type: "match", text: "-255.34"}, 
13 |   {type: "match", text: "128"}, 
14 |   {type: "match", text: "1.9e10"}, 
15 |   {type: "match", text: "123,340.00"}, 
16 |   {type: "skip", text: "720p"}]'
17 | >
18 | 
19 | 当我们考虑金融数字、指数等形式时，表达式可能相当复杂。
20 | 
21 | 对于上面的例子，表达式 <SolutionLink text="^-?\d+(,\d+)*(\.\d+(e\d+)?)?$" /> 可以匹配这样的字符串：以一个可选的负号开头、一位或几位数字、可选的逗号和更多位数字、可选的小数点与小数数字、可选的指数部分。
22 | 
23 | 这不是唯一的解决方案，比如表达式 <SolutionLink text="^-?((\d+,)+)?\d*\.?\d*(e\d+)?$" /> 也可以匹配这些数字。
24 | 
25 | (译者注) 让我们尝试一步步解决这个问题：
26 | 1. 匹配一个可能是负数的整数：<SolutionLink text="^-?\d+" />
27 | 2. 匹配小数：<SolutionLink text="^-?\d+(\.\d+)?" />
28 | 3. 整数部分可能使用了千位分隔符：<SolutionLink text="^-?\d+(,\d+)*(\.\d+)?" />
29 | 4. 匹配科学计数法：<SolutionLink text="^-?\d+(,\d+)*(\.\d+)?(e\d+)?$" />
30 | 
31 | 
32 | </Exercise>


--------------------------------------------------------------------------------
/docs/problem/matching_emails.md:
--------------------------------------------------------------------------------
 1 | # 问题 3：匹配邮箱
 2 | 
 3 | 正则表达式在验证 HTML 表单的输入时通常很有用。由于[规范](http://tools.ietf.org/html/rfc2822#section-3.4.1)的复杂性，电子邮件很难正确匹配，因此我建议使用内置语言或框架函数，而不是自己处理。但是，您依然可以使用我们迄今所学的知识，非常轻松地创建一个相当健壮的正则表达式，它能够匹配大量常见的电子邮件。
 4 | 
 5 | 需要注意的一点是，许多人使用一次性的 [加号地址](https://zh.wikipedia.org/wiki/%E9%9B%BB%E5%AD%90%E9%83%B5%E4%BB%B6%E5%9C%B0%E5%9D%80#%E5%AD%90%E5%9C%B0%E5%9D%80)(plus-addressing)，例如 "name+filter@gmail.com"，邮件还是会发送到 "name@gmail.com"，但是可以作一些过滤操作。此外，有些域名有不止一个部分，例如，您可以在 "hellokitty.hk.com" 注册域名，并使用一个形如 "ilove@hellokitty.hk.com" 的邮箱，因此在匹配电子邮件的域名部分时必须小心。
 6 | 
 7 | 下面是一些常见的电子邮箱，请尝试捕获电子邮件的名称，不包括筛选器 (+ 字符和之后) 和域 (@ 字符和之后) 部分。
 8 | 
 9 | <Exercise
10 |   title="练习 3：匹配邮箱"
11 |   :data='[
12 |     {type: "capture", text: "tom@hogwarts.com", captureData: {results: ["tom"]}},
13 |     {type: "capture", text: "tom.riddle@hogwarts.com", captureData: {results: ["tom.riddle"]}},
14 |     {type: "capture", text: "tom.riddle+regexone@hogwarts.com", captureData: {results: ["tom.riddle"]}},
15 |     {type: "capture", text: "tom@hogwarts.eu.com", captureData: {results: ["tom"]}},
16 |     {type: "capture", text: "potter@hogwarts.com", captureData: {results: ["potter"]}},
17 |     {type: "capture", text: "harry@hogwarts.com", captureData: {results: ["harry"]}},
18 |     {type: "capture", text: "hermione+regexone@hogwarts.com", captureData: {results: ["hermione"]}},
19 |   ]'
20 | >
21 | 要提取每封电子邮件的开头，我们可以使用一个简单的表达式 <SolutionLink text="^([\w\.]*)" />，它将匹配以字母数字字符 (包括句点) 开头的电子邮件，直到遇到 "@" 或 "+"。
22 | 
23 | 再次强调，您应该使用一个框架来匹配电子邮件！
24 | 
25 | </Exercise>


--------------------------------------------------------------------------------
/docs/problem/matching_filenames.md:
--------------------------------------------------------------------------------
 1 | # 问题 5：匹配特定文件名
 2 | 
 3 | 如果您经常使用 Linux 或命令行，往往会需要处理文件列表。大多数文件都由一个文件名和一个扩展名组成，但在 Linux 中，隐藏的文件没有文件名也是很常见的。
 4 | 
 5 | 在下面这个简单的示例中，请提取出图像文件的文件名和扩展名 （不包括当前正在编辑的图像的临时文件 `.tmp`）。图像文件定义为 **.jpg**、**.png** 和 **.gif**。
 6 | 
 7 | <Exercise
 8 |   title="练习 5：捕获文件名"
 9 |   :data='[
10 |     {type: "skip", text: ".bash_profile"},
11 |     {type: "skip", text: "workspace.doc"},
12 |     {type: "capture", text: "img0912.jpg", captureData: {results: ["img0912", "jpg"]}},
13 |     {type: "capture", text: "updated_img0912.png", captureData: {results: ["updated_img0912", "png"]}},
14 |     {type: "skip", text: "documentation.html"},
15 |     {type: "capture", text: "favicon.gif", captureData: {results: ["favicon", "gif"]}},
16 |     {type: "skip", text: "img0912.jpg.tmp"},
17 |     {type: "skip", text: "access.lock"},
18 |   ]'
19 | >我们只查找以 "jpg"、"png" 和 "gif" 扩展名结尾的图像文件，因此可以使用表达式 <SolutionLink text="(\w+)\.(jpg|png|gif)$" /> 捕获所有此类文件名。</Exercise>


--------------------------------------------------------------------------------
/docs/problem/matching_html.md:
--------------------------------------------------------------------------------
 1 | # 问题 4：匹配 HTML
 2 | 
 3 | 如果您正在寻找一种健壮的方法来解析 HTML，正则表达式通常不是好的解决方案，因为现在互联网上的 HTML 页面非常脆弱 —— 常见的错误如缺少结束标签、标签不匹配、属性引号没有关闭等，都会使一个非常好的正则表达式无法使用。相反，您可以使用像 [Beautiful Soup](http://www.crummy.com/software/BeautifulSoup/)、[html5lib](http://code.google.com/p/html5lib/) (都是 Python) 或 [phpQuery](http://code.google.com/p/phpquery/) (PHP) 这样的库，它们不仅可以解析 HTML，还可以让您快速、轻松地访问 DOM。
 4 | 
 5 | 尽管如此，您可能经常需要在编辑器中快速匹配标签和标签的内容。如果您可以保证输入规范，正则表达式就是一个很好的工具。
 6 | 
 7 | 继续为下面的示例编写正则表达式来捕获外层标签，请注意属性中的转义引号和嵌套的标签。
 8 | 
 9 | <Exercise
10 |   title="练习 4：匹配 HTML 标签"
11 |   :data="[
12 |     {type: 'capture', text:'<a>This is a link</a>',captureData:{results:['a']}},{type: 'capture', text:`<a href='https://regexone.com'>Link</a>`,captureData:{results:['a']}},{type: 'capture', text:`<div class='test_style'>Test</div>`,captureData:{results:['div']}},{type: 'capture', text:`<div>Hello <span>world</span></div>`,captureData:{results:['div']}}]">
13 | 
14 | 最佳做法是使用合适的库来解析 html，但如果只是查找简单地标签名，可以使用表达式 <SolutionLink text="<(\w+)" />。
15 | 
16 | 还可以使用表达式 <SolutionLink text=">([\w\s]*)<" /> 捕获标签内容，甚至可以捕获属性值 <SolutionLink text="='([\w://.]*)" />。
17 | 
18 | </Exercise>


--------------------------------------------------------------------------------
/docs/problem/matching_phone_numbers.md:
--------------------------------------------------------------------------------
 1 | # 问题 2：匹配电话号码
 2 | 
 3 | 验证电话号码是另一项棘手的任务。有的电话号码需要**区号**，有的国际号码还需要**前缀**，这都增加了正则表达式的复杂性。此外，人们输入电话号码时的偏好也不同 (例如，有些人会输入**破折号**或**空格**，而有些人不输入)。
 4 | 
 5 | 下面是一些真实场景下可能遇到的电话号码，请编写一个与号码匹配的正则表达式，并捕获正确的区号。
 6 | 
 7 | <Exercise
 8 |   title="练习 2：匹配电话号码"
 9 |   :data='[{
10 |     type: "capture", text: "415-555-1234", captureData: {results: ["415"]}},{
11 |     type: "capture", text: "650-555-2345", captureData: {results: ["650"]}},{
12 |     type: "capture", text: "(416)555-3456", captureData: {results: ["416"]}},{
13 |     type: "capture", text: "202 555 4567", captureData: {results: ["202"]}},{
14 |     type: "capture", text: "4035555678", captureData: {results: ["403"]}},{
15 |     type: "capture", text: "1 416 555 9292", captureData: {results: ["416"]}
16 |   }]'
17 | >
18 | 
19 | 观察可以发现，电话号码由 3、3、4 位数字组成，每部分之间可以用空格或破折号连接，前三位数字是区号。因此，为了获取电话号码的区号，最简单的方法是使用表达式 <SolutionLink text="(\d{3})" /> 捕获前三位数字。
20 | 
21 | 为了同时匹配到整个电话号码，我们可以使用表达式 <SolutionLink text="1?[\s-]?\(?(\d{3})\)?[\s-]?\d{3}[\s-]?\d{4}" />。解释如下：
22 | 1. 匹配可能存在的国家号：<SolutionLink text="1?[\s-]?" />
23 | 2. 匹配可能被括号包住的区号：<SolutionLink text="\(?(\d{3})\)?" />，注意这里外层的括号是转义后的字符，内层的括号表示捕获组
24 | 3. 匹配后续的 3 位、4 位号码：<SolutionLink text="[\s-]?\d{3}[\s-]?\d{4}" />
25 | 4. <SolutionLink text="[\s-]?" /> 表示可能通过破折号或空格连接，也可能没有连接符
26 | 
27 | </Exercise>


--------------------------------------------------------------------------------
/docs/problem/trimming_whitespace.md:
--------------------------------------------------------------------------------
 1 | # 问题 6：修剪掉行首和行尾的空白
 2 | 
 3 | 有时，您会发现自己的日志文件的**空格格式错误**，导致某些行缩进太多或者不够。解决这个问题的一种方法是使用编辑器的搜索功能，通过正则表达式来提取行中不包含额外空格的内容。
 4 | 
 5 | 我们之前已经看到了如何分别使用帽子符号 (hat) **`^`** 和美元符号 **`$`** 匹配一整行文本。当这两个符号与空格 **`\s`** 一起使用时，可以轻松跳过所有前面和后面的空格。
 6 | 
 7 | 写一个简单的正则表达式来捕获每一行的内容，不包含额外的空格。
 8 | 
 9 | <Exercise
10 |   title="练习 6：匹配行"
11 |   :data='[
12 |     {type: "capture", text: "			The quick brown fox...", captureData: {results: ["The quick brown fox..."]}},
13 |     {type: "capture", text: "   jumps over the lazy dog.", captureData: {results: ["jumps over the lazy dog."]}}
14 |   ]'
15 | >可以使用表达式 <SolutionLink text="^\s*(.*)\s*$" /> 跳过所有开始和结束的空格，只捕获内容。</Exercise>


--------------------------------------------------------------------------------
/docs/resources.md:
--------------------------------------------------------------------------------
1 | # 资源
2 | 
3 | 正则表达式在线测试：
4 | * <https://regex101.com>
5 | 
6 | 正则表达式可视化工具：
7 | * <https://regexper.com>
8 | * [https://jex.im/regulex](https://jex.im/regulex/#!flags=&re=%5E(a%7Cb)*%3F%24)
9 | * <https://blog.robertelder.org/regular-expression-visualizer>


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "regexone-cn",
 3 |   "version": "1.0.0",
 4 |   "description": "regexone.com 中文翻译",
 5 |   "scripts": {
 6 |     "docs:dev": "vuepress dev docs",
 7 |     "docs:build": "vuepress build docs"
 8 |   },
 9 |   "author": "imageslr",
10 |   "license": "MIT",
11 |   "devDependencies": {
12 |     "@vuepress/plugin-pwa": "^1.8.2",
13 |     "lodash": "^4.17.21",
14 |     "node-sass": "^6.0.0",
15 |     "sass-loader": "^10.0.1",
16 |     "vuepress": "^1.8.2"
17 |   }
18 | }
19 | 


--------------------------------------------------------------------------------