Skip to content

Commit 6b2a23d

Browse files
author
Gray
committed
Translate Part 3. 7.9 Quantifiers +, *, ? and {n}
1 parent d9a7cf1 commit 6b2a23d

File tree

5 files changed

+91
-91
lines changed

5 files changed

+91
-91
lines changed
Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11

2-
Solution:
2+
해답:
33

44
```js run
55
let regexp = /\.{3,}/g;
6-
alert( "Hello!... How goes?.....".match(regexp) ); // ..., .....
6+
alert( "안녕!... 어떻게 지내?.....".match(regexp) ); // ..., .....
77
```
88

9-
Please note that the dot is a special character, so we have to escape it and insert as `\.`.
9+
점이 특수 문자임에 유의합니다. 즉, `\.`과 같이 점 앞에 역슬래시를 추가하여 이스케이프 처리를 해주어야 합니다.
Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
1-
importance: 5
1+
중요도: 5
22

33
---
44

5-
# How to find an ellipsis "..." ?
5+
# 생략 부호 '...' 찾기
66

7-
Create a regexp to find ellipsis: 3 (or more?) dots in a row.
7+
생략 부호를 찾기 위한 정규 표현식을 작성하세요. 생략 부호는 한 행에 3개 이상의 점(dot)으로 구성되어 있습니다.
88

9-
Check it:
9+
직접 확인해 봅시다.
1010

1111
```js
12-
let regexp = /your regexp/g;
13-
alert( "Hello!... How goes?.....".match(regexp) ); // ..., .....
12+
let regexp = /정규 표현식을 작성할 곳/g;
13+
alert( "안녕!... 어떻게 지내?.....".match(regexp) ); // ..., .....
1414
```

9-regular-expressions/09-regexp-quantifiers/2-find-html-colors-6hex/solution.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
We need to look for `#` followed by 6 hexadecimal characters.
1+
문자 `#`과 16진수 문자 6개로 이루어진 문자열을 찾아야 합니다.
22

3-
A hexadecimal character can be described as `pattern:[0-9a-fA-F]`. Or if we use the `pattern:i` flag, then just `pattern:[0-9a-f]`.
3+
16진수 문자는 `pattern:[0-9a-fA-F]`로 나타낼 수 있습니다. 또는 표현식에 `pattern:i` 플래그를 추가하여, `pattern:[0-9a-f]`로만 16진수 문자를 표현하는 것도 가능합니다.
44

5-
Then we can look for 6 of them using the quantifier `pattern:{6}`.
5+
그다음으로는 해당 문자 6개가 필요하므로 수량자 `pattern:{6}`을 추가합니다.
66

7-
As a result, we have the regexp: `pattern:/#[a-f0-9]{6}/gi`.
7+
완성된 정규 표현식은 다음과 같습니다. `pattern:/#[a-f0-9]{6}/gi`
88

99
```js run
1010
let regexp = /#[a-f0-9]{6}/gi;
@@ -14,13 +14,13 @@ let str = "color:#121212; background-color:#AA00ef bad-colors:f#fddee #fd2"
1414
alert( str.match(regexp) ); // #121212,#AA00ef
1515
```
1616

17-
The problem is that it finds the color in longer sequences:
17+
이 정규 표현식은 더 긴 형태의 색상 문자열도 결과에 포함되는 문제가 있습니다.
1818

1919
```js run
2020
alert( "#12345678".match( /#[a-f0-9]{6}/gi ) ) // #123456
2121
```
2222

23-
To fix that, we can add `pattern:\b` to the end:
23+
이 문제의 해결을 위해, 표현식의 마지막에 `pattern:\b`를 추가합니다.
2424

2525
```js run
2626
// color
Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
1-
# Regexp for HTML colors
1+
# HTML 색상을 찾는 정규 표현식
22

3-
Create a regexp to search HTML-colors written as `#ABCDEF`: first `#` and then 6 hexadecimal characters.
3+
`#ABCDEF`와 같은 HTML 색상을 찾는 정규 표현식을 작성하세요. HTML 색상은 문자 `#`로 시작하여 연이은 6개의 16진수 문자들로 구성되어 있습니다.
44

5-
An example of use:
5+
사용 예시:
66

77
```js
8-
let regexp = /...your regexp.../
8+
let regexp = /정규 표현식을 작성할 곳/
99

1010
let str = "color:#121212; background-color:#AA00ef bad-colors:f#fddee #fd2 #12345678";
1111

1212
alert( str.match(regexp) ) // #121212,#AA00ef
1313
```
1414

15-
P.S. In this task we do not need other color formats like `#123` or `rgb(1,2,3)` etc.
15+
참고: 이 과제에서는 `#123` 또는 `rgb(1,2,3)` 등과 같은 HTML 색상의 다른 형식은 고려하지 않습니다.
Lines changed: 71 additions & 71 deletions
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,46 @@
1-
# Quantifiers +, *, ? and {n}
1+
# 수량자 +, *, ?, {n}
22

3-
Let's say we have a string like `+7(903)-123-45-67` and want to find all numbers in it. But unlike before, we are interested not in single digits, but full numbers: `7, 903, 123, 45, 67`.
3+
문자열 `+7(903)-123-45-67`에서 모든 숫자를 찾고 싶다고 가정해봅시다. 전처럼 한 자리짜리 숫자를 찾던 것과는 달리, `7, 903, 123, 45, 67`처럼 수 전부를 가져오려 합니다.
44

5-
A number is a sequence of 1 or more digits `pattern:\d`. To mark how many we need, we can append a *quantifier*.
5+
찾으려는 수는 `pattern:\d`가 한 개 이상 나열된(즉, 한 자릿수 이상인) 형태입니다. 표현식의 일치 횟수 지정을 위해 *수량자*를 사용할 수 있습니다.
66

7-
## Quantity {n}
7+
## 수량 {n}
88

9-
The simplest quantifier is a number in curly braces: `pattern:{n}`.
9+
`pattern:{n}`은 숫자를 중괄호로 감싼 매우 간결한 형태의 수량자입니다.
1010

11-
A quantifier is appended to a character (or a character class, or a `[...]` set etc) and specifies how many we need.
11+
문자(또는 문자 클래스나 `[...]` 문자 집합 등) 뒤에 덧붙여 몇 개를 찾고 싶은지를 표현합니다.
1212

13-
It has a few advanced forms, let's see examples:
13+
이 수량자는 몇 가지 고급 사용 형식을 지원합니다. 예시를 살펴봅시다.
1414

15-
The exact count: `pattern:{5}`
16-
: `pattern:\d{5}` denotes exactly 5 digits, the same as `pattern:\d\d\d\d\d`.
17-
18-
The example below looks for a 5-digit number:
15+
정확한 수 일치: `pattern:{5}`
16+
: `pattern:\d{5}`는 정확히 다섯 자리의 수를 나타내며, `pattern:\d\d\d\d\d`와 같은 의미를 가집니다.
1917

18+
다음은 다섯 자리 숫자를 찾는 예시입니다.
19+
2020
```js run
21-
alert( "I'm 12345 years old".match(/\d{5}/) ); // "12345"
21+
alert( "저는 12345살입니다.".match(/\d{5}/) ); // "12345"
2222
```
23+
24+
다섯 자리보다 자릿수가 더 큰 수를 찾는 것을 방지하기 위해 다음과 같이 `\b`를 덧붙일 수 있습니다. `pattern:\b\d{5}\b`
2325

24-
We can add `\b` to exclude longer numbers: `pattern:\b\d{5}\b`.
25-
26-
The range: `pattern:{3,5}`, match 3-5 times
27-
: To find numbers from 3 to 5 digits we can put the limits into curly braces: `pattern:\d{3,5}`
26+
주어진 범위 내의 수만큼 일치: `pattern:{3,5}`, 3~5회 일치
27+
: 3~5자리의 수를 찾기 위해, `pattern:\d{3,5}`와 같이 중괄호로 범위를 지정해줄 수 있습니다.
2828

2929
```js run
30-
alert( "I'm not 12, but 1234 years old".match(/\d{3,5}/) ); // "1234"
30+
alert( "저는 12살이 아니고 1234살입니다.".match(/\d{3,5}/) ); // "1234"
3131
```
32-
33-
We can omit the upper limit.
34-
35-
Then a regexp `pattern:\d{3,}` looks for sequences of digits of length `3` or more:
36-
32+
33+
범위 지정 시 최댓값을 생략하는 것도 가능합니다.
34+
35+
표현식 `pattern:\d{3,}``3`자릿수 이상의 수를 찾습니다.
36+
3737
```js run
38-
alert( "I'm not 12, but 345678 years old".match(/\d{3,}/) ); // "345678"
38+
alert( "저는 12살이 아니고 345678살입니다.".match(/\d{3,}/) ); // "345678"
3939
```
4040

41-
Let's return to the string `+7(903)-123-45-67`.
41+
이제 다시 `+7(903)-123-45-67` 문제로 돌아가 봅시다.
4242

43-
A number is a sequence of one or more digits in a row. So the regexp is `pattern:\d{1,}`:
43+
하나의 행 안에 한 자릿수 이상의 수들로 구성되어 있습니다. 즉, 이에 대한 정규 표현식은 `pattern:\d{1,}`입니다.
4444

4545
```js run
4646
let str = "+7(903)-123-45-67";
@@ -50,93 +50,93 @@ let numbers = str.match(/\d{1,}/g);
5050
alert(numbers); // 7,903,123,45,67
5151
```
5252

53-
## Shorthands
53+
## 축약 형태의 수량자
5454

55-
There are shorthands for most used quantifiers:
55+
즐겨 사용되는 수량자들의 축약 형태들입니다.
5656

5757
`pattern:+`
58-
: Means "one or more", the same as `pattern:{1,}`.
59-
60-
For instance, `pattern:\d+` looks for numbers:
58+
: '1회 이상' 일치를 의미하며, `pattern:{1,}`와 같습니다.
6159

60+
예를 들어, `pattern:\d+`는 한 자릿수 이상의 수를 찾습니다.
61+
6262
```js run
6363
let str = "+7(903)-123-45-67";
6464

6565
alert( str.match(/\d+/g) ); // 7,903,123,45,67
6666
```
6767

6868
`pattern:?`
69-
: Means "zero or one", the same as `pattern:{0,1}`. In other words, it makes the symbol optional.
70-
71-
For instance, the pattern `pattern:ou?r` looks for `match:o` followed by zero or one `match:u`, and then `match:r`.
72-
73-
So, `pattern:colou?r` finds both `match:color` and `match:colour`:
69+
: '0회 또는 1회' 일치를 의미하며, `pattern:{0,1}`와 같습니다. 즉, 일치하는 것을 선택 사항으로 설정합니다.
7470

71+
예를 들어, 표현식 `pattern:ou?r`는 `match:o`와, 그에 인접한 `match:u`는 한 번 나오거나 존재하지 않으며, 다음으로 `match:r`이 나오는 문자열을 찾습니다.
72+
73+
따라서, `pattern:colou?r`는 `match:color`와 `match:colour` 둘 모두를 찾습니다.
74+
7575
```js run
76-
let str = "Should I write color or colour?";
77-
76+
let str = "color와 colour 중에 어떤 것으로 써야 합니까?";
77+
7878
alert( str.match(/colou?r/g) ); // color, colour
7979
```
8080

8181
`pattern:*`
82-
: Means "zero or more", the same as `pattern:{0,}`. That is, the character may repeat any times or be absent.
83-
84-
For example, `pattern:\d0*` looks for a digit followed by any number of zeroes (may be many or none):
82+
: '0회 이상' 일치를 의미하며, `pattern:{0,}`와 같습니다. 즉, 몇 회든 일치할 수도 있고 또는 아예 일치하지 않을 수도 있습니다.
8583

84+
예를 들어, `pattern:\d0*`는 숫자 하나와, 그 다음으로 0이 여러 개 나오거나 아예 나오지 않는 형태를 찾습니다(0은 많을 수도 있고 아예 없을 수도 있습니다).
85+
8686
```js run
8787
alert( "100 10 1".match(/\d0*/g) ); // 100, 10, 1
8888
```
89-
90-
Compare it with `pattern:+` (one or more):
91-
89+
90+
수량자 `pattern:+`(1회 이상)와 비교해봅시다.
91+
9292
```js run
9393
alert( "100 10 1".match(/\d0+/g) ); // 100, 10
94-
// 1 not matched, as 0+ requires at least one zero
94+
// 1은 결과에 나오지 않습니다. 0+으로 인해 0이 적어도 한 개는 있어야 하기 때문입니다.
9595
```
9696

97-
## More examples
97+
## 추가 예시
9898

99-
Quantifiers are used very often. They serve as the main "building block" of complex regular expressions, so let's see more examples.
99+
수량자는 자주 사용됩니다. 수량자는 복잡한 정규 표현식을 구성하는 주요 ‘기본 요소’입니다. 예시를 더 살펴봅시다.
100100

101-
**Regexp for decimal fractions (a number with a floating point): `pattern:\d+\.\d+`**
101+
**부동 소수점이 있는 십진수에 대한 정규 표현식: `pattern:\d+\.\d+`**
102102

103-
In action:
103+
예시:
104104
```js run
105105
alert( "0 1 12.345 7890".match(/\d+\.\d+/g) ); // 12.345
106106
```
107107

108-
**Regexp for an "opening HTML-tag without attributes", such as `<span>` or `<p>`.**
109-
110-
1. The simplest one: `pattern:/<[a-z]+>/i`
111-
112-
```js run
113-
alert( "<body> ... </body>".match(/<[a-z]+>/gi) ); // <body>
114-
```
115-
116-
The regexp looks for character `pattern:'<'` followed by one or more Latin letters, and then `pattern:'>'`.
117-
118-
2. Improved: `pattern:/<[a-z][a-z0-9]*>/i`
108+
**'속성(attribute)이 없는 HTML 시작 태그'에 대한 정규 표현식(`<span>` 또는 `<p>`처럼 생긴 태그)**
119109

120-
According to the standard, HTML tag name may have a digit at any position except the first one, like `<h1>`.
110+
1. 가장 간단한 형태: `pattern:/<[a-z]+>/i`
111+
112+
```js run
113+
alert( "<body> ... </body>".match(/<[a-z]+>/gi) ); // <body>
114+
```
115+
116+
위의 정규 표현식은 문자 `pattern:'<'`와 그에 인접한 한 개 이상의 영문자와 `pattern:'>'`를 찾습니다.
121117

122-
```js run
123-
alert( "<h1>Hi!</h1>".match(/<[a-z][a-z0-9]*>/gi) ); // <h1>
124-
```
118+
2. 개선된 형태: `pattern:/<[a-z][a-z0-9]*>/i`
119+
120+
표준에 따르면 HTML 태그에는 첫 글자를 제외한 모든 곳에 숫자가 포함될 수 있습니다. `<h1>`과 같은 형태가 그렇습니다.
121+
122+
```js run
123+
alert( "<h1>안녕!</h1>".match(/<[a-z][a-z0-9]*>/gi) ); // <h1>
124+
```
125125

126-
**Regexp "opening or closing HTML-tag without attributes": `pattern:/<\/?[a-z][a-z0-9]*>/i`**
126+
**'속성이 없는 HTML 시작 태그 또는 종료 태그'에 대한 정규 표현식: `pattern:/<\/?[a-z][a-z0-9]*>/i`**
127127

128-
We added an optional slash `pattern:/?` near the beginning of the pattern. Had to escape it with a backslash, otherwise JavaScript would think it is the pattern end.
128+
표현식의 앞 부분에 `pattern:/?` 슬래시(빗금)를 선택 사항으로 지정하였습니다. 자바스크립트가 슬래시를 정규 표현식의 끝을 나타내는 기호로 받아들이지 않도록 슬래시 앞에 역슬래시를 추가하여 이스케이프 처리하였습니다.
129129

130130
```js run
131-
alert( "<h1>Hi!</h1>".match(/<\/?[a-z][a-z0-9]*>/gi) ); // <h1>, </h1>
131+
alert( "<h1>안녕!</h1>".match(/<\/?[a-z][a-z0-9]*>/gi) ); // <h1>, </h1>
132132
```
133133

134-
```smart header="To make a regexp more precise, we often need make it more complex"
135-
We can see one common rule in these examples: the more precise is the regular expression -- the longer and more complex it is.
134+
```smart header="정규 표현식을 보다 정밀하게 만들기 위해서는, 가급적 더 복잡하게 만들어야 합니다"
135+
지금까지의 예시들을 통해 한 가지 공통된 법칙을 볼 수 있습니다. ‘정규 표현식이 정밀하면 할수록, 그 정규 표현식은 더 길고, 더 복잡하다’는 것입니다.
136136
137-
For instance, for HTML tags we could use a simpler regexp: `pattern:<\w+>`. But as HTML has stricter restrictions for a tag name, `pattern:<[a-z][a-z0-9]*>` is more reliable.
137+
예를 들어 HTML 태그의 경우, `pattern:<\w+>`처럼 간단한 표현식을 사용할 수도 있습니다. 하지만 HTML의 태그 이름에 관한 엄격한 규칙을 감안하면 `pattern:<[a-z][a-z0-9]*>`이 더 안전합니다.
138138
139-
Can we use `pattern:<\w+>` or we need `pattern:<[a-z][a-z0-9]*>`?
139+
`pattern:<\w+>`을 써도 괜찮은 걸까요? 아니면 `pattern:<[a-z][a-z0-9]*>`을 써야 하는 걸까요?
140140
141-
In real life both variants are acceptable. Depends on how tolerant we can be to "extra" matches and whether it's difficult or not to remove them from the result by other means.
141+
실제 사용할 때에 있어서는 둘 다 적합합니다. 원하는 일치 항목 외에 “부수적인” 일치 항목들을 얼마나 허용할 건지, 다른 방식으로 해당 항목들을 제거하는 데 어려움이 따르는지 여부에 따라 결정하면 됩니다.
142142
```

0 commit comments

Comments
 (0)