You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: 1-js/02-first-steps/08-comparison/article.md
+32-36Lines changed: 32 additions & 36 deletions
Original file line number
Diff line number
Diff line change
@@ -5,9 +5,9 @@
5
5
- 보다 큼/작음: <code>a > b</code>, <code>a < b</code>.
6
6
- 보다 크거나/작거나 같음: <code>a >= b</code>, <code>a <= b</code>.
7
7
- 같음: `a == b` (2개의 `=`기호에 유의합니다. 하나의 기호 `a = b`는 할당을 의미합니다).
8
-
- 같지 않음. 수학에서 표기법은 다음과 같습니다. <code>≠</code>, 자바스크립트에서는 느낌표가 붙은 할당연산자로 작성됩니다. <code>a != b</code>.
8
+
- 같지 않음: 수학에서 표기법은 다음과 같습니다. <code>≠</code>, 자바스크립트에서는 느낌표가 붙은 할당연산자로 작성됩니다. <code>a != b</code>.
9
9
10
-
## 불리언은 결과입니다.
10
+
## 결과는 논리 타입(boolean)입니다.
11
11
12
12
다른 모든 연산자와 마찬가지로 비교는 값을 반환합니다. 이 경우 값은 불리언 값입니다.
13
13
@@ -51,7 +51,6 @@ alert( 'Bee' > 'Be' ); // true
51
51
4. 각 문자열이 끝날 때까지 반복합니다.
52
52
5. 두 문자열이 같은 길이로 끝나면 두 문자열은 동일합니다. 그렇지 않으면 긴 문자열이 더 큽니다.
53
53
54
-
In the examples above, the comparison `'Z' > 'A'` gets to a result at the first step while the strings `"Glow"` and `"Glee"` are compared character-by-character:
55
54
위의 예제에서 문자열 `"Glow"` 와 `"Glee"`가 문자별로 비교되는 동안 비교-`'Z' > 'A'`는 첫 단계에서 결과에 도달합니다.
56
55
57
56
1.`G`는`G`와 같습니다.
@@ -62,12 +61,11 @@ In the examples above, the comparison `'Z' > 'A'` gets to a result at the first
62
61
위에 주어진 비교 알고리즘은 사전이나 전화번호부에서 사용된 알고리즘과 거의 동일하지만 정확하게 동일하지는 않습니다.
63
62
64
63
예를 들어, 대소문자가 중요합니다. 대문자 `"A"`는 소문자 `"a"`와 같지 않습니다. 어느 것이 더 큽니까? 소문자 `"a"`입니다. 왜? 소문자는 "자바스크립트가 사용하는 내부 인코딩 테이블"(유니 코드)에서 더 큰 인덱스를 갖기 때문입니다. <info:string> 주제에서 이에 대한 자세한 내용과 결과를 살펴 보겠습니다.
65
-
66
64
```
67
65
68
66
## 다른 타입간의 비교
67
+
-## 다른 타입간의 비교
69
68
70
-
When comparing values of different types, JavaScript converts the values to numbers.
Now let's see some funny things that happen when we apply these rules. And, what's more important, how to not fall into a trap with them.
164
+
이제 이 규칙을 적용했을 때 일어나는 재미있는 일들을 확인합니다. 그리고 무엇이 더 중요한지, 어떻게 이것들과 함정에 빠지지 않는지 확인합니다.
169
165
170
-
### Strange result: null vs 0
166
+
### 이상한 결과 : null 대 0
171
167
172
-
Let's compare `null` with a zero:
168
+
`null`과 0을 비교합시다.
173
169
174
170
```js run
175
171
alert( null>0 ); // (1) false
176
172
alert( null==0 ); // (2) false
177
173
alert( null>=0 ); // (3) *!*true*/!*
178
174
```
175
+
176
+
수학적으로 이 결과는 이상합니다. 마지막 결과는 "`null`이 0보다 크거나 같음"을 나타내고, 그래서 마지막 결과 위의 비교 중 하나는 `true`여야 하지만 둘 다 `false`입니다.
179
177
180
-
Mathematically, that's strange. The last result states that "`null` is greater than or equal to zero", so one of the comparisons above it must be correct, but they are both false.
181
-
182
-
The reason is that an equality check `==` and comparisons `> < >= <=` work differently. Comparisons convert `null` to a number, treating it as `0`. That's why (3) `null >= 0` is true and (1) `null > 0` is false.
178
+
그 이유는 항등 검사`==`와 비교`> < >= <=`가 다르게 작동하기 때문입니다. 비교는 `null`을 숫자로 변환하여 `0`으로 처리합니다. 이것이 (3) `null> = 0`이 true이고 (1)`null> 0`이 false 인 이유입니다.
183
179
184
-
On the other hand, the equality check `==` for `undefined` and `null` is defined such that, without any conversions, they equal each other and don't equal anything else. That's why (2)`null == 0` is false.
180
+
반면, `undefined`와 `null`에 대한 항등 검사`==`는 이렇게 정의됩니다. 어떠한 변환도 없이 이 둘은 서로 같지만 다른 무엇과도 같지않습니다. 이것이 (2)`null == 0`이 거짓인 이유입니다.
185
181
186
-
### An incomparable undefined
182
+
### 비교할 수 없는 undefined
187
183
188
-
The value `undefined` shouldn't be compared to other values:
184
+
`undefined`값은 다른 값과 비교되어서는 안됩니다.
189
185
190
186
```js run
191
187
alert( undefined>0 ); // false (1)
192
188
alert( undefined<0 ); // false (2)
193
189
alert( undefined==0 ); // false (3)
194
190
```
195
191
196
-
Why does it dislike zero so much? Always false!
192
+
왜 이것은 0을 싫어하나요? 항상 `false` 입니다!
197
193
198
-
We get these results because:
194
+
다음과 같은 이유로 이러한 결과를 얻습니다.
199
195
200
-
-Comparisons `(1)` and `(2)` return `false` because `undefined` gets converted to `NaN` and`NaN` is a special numeric value which returns `false` for all comparisons.
201
-
-The equality check `(3)` returns `false` because `undefined` only equals `null` and no other value.
196
+
-`(1)`과`(2)`는 `undefined`가 `NaN`으로 변환되고`NaN`이 모든 비교에 대해 `false`를 반환하는 특수한 숫자 값이기 때문입니다.
197
+
-`undefined`는 오직 `null`만 같고 동등한 다른 값은 없어서 항등검사`(3)`은 `false`를 반환합니다.
202
198
203
-
### Evade problems
199
+
### 문제 회피
204
200
205
-
Why did we go over these examples? Should we remember these peculiarities all the time? Well, not really. Actually, these tricky things will gradually become familiar over time, but there's a solid way to evade problems with them:
201
+
왜 이 예들을 검토하였을까요? 항상 이러한 특성을 기억해야 할까요? 글쎄요, 그렇진 않습니다. 사실, 이러한 까다로운 일들은 점차 익숙해 질 것입니다. 하지만 문제를 피할 수 있는 견고한 방법이 있습니다.
206
202
207
-
Just treat any comparison with `undefined/null` except the strict equality `===` with exceptional care.
203
+
완전 평등`===`을 제외한 `undefined/null`에 대한 모든 비교를 특별한 주의를 기울여 처리하십시오.
208
204
209
-
Don't use comparisons `>= > < <=` with a variable which may be `null/undefined`, unless you're really sure of what you're doing. If a variable can have these values, check for them separately.
205
+
뭘 하고 있는지 확신하지 못한다면, `>= > < <=`비교를 `null/undefined`일 수 있는 변수와 함께 사용하지 마십시오. 변수가 이 값을 가질 수 있으면, 변수를 개별적으로 검사하십시오.
210
206
211
-
## Summary
207
+
## 요약
212
208
213
-
-Comparison operators return a boolean value.
214
-
-Strings are compared letter-by-letter in the "dictionary" order.
215
-
-When values of different types are compared, they get converted to numbers (with the exclusion of a strict equality check).
216
-
-The values `null` and `undefined` equal `==`each other and do not equal any other value.
217
-
-Be careful when using comparisons like`>`or`<` with variables that can occasionally be `null/undefined`. Checking for `null/undefined` separately is a good idea.
209
+
-비교 연산자는 불리언 값을 반환합니다.
210
+
-문자열은 "사전"순서로 문자단위로 비교됩니다.
211
+
-서로 다른 유형의 값을 비교하면 숫자로 변환됩니다 ("완전 항등 검사"는 제외하고).
212
+
-`null`값과 `undefined`값은 서로 같고`==`다른 어떠한 값과도 같지 않습니다.
213
+
-때때로 `null/undefined`일 수 있는 변수에 대해`>`또는`<`같은 비교를 사용할 때 주의하십시오. 개별적으로 `null/undefined`를 체크하는 것은 좋은 생각입니다.
This part of the tutorial aims to cover JavaScript "as is", without environment-specific tweaks.
3
+
튜토리얼의 이 파트는 브라우저(Browser) 환경 특유의 조정 없이 "있는 그대로"의 자바스크립트를 다루는 것을 목표로합니다.
4
4
5
-
But we'll still be using the browser as our demo environment, so we should know at least a few of its user-interface functions. In this chapter, we'll get familiar with the browser functions `alert`, `prompt` and `confirm`.
5
+
그러나 우리는 여전히 브라우저(Browser)를 데모 환경으로 사용할 것이므로 최소한의 사용자 인터페이스 기능을 알아야 합니다. 이 챕터에서는 브라우저(Browser) 함수인 `alert`, `prompt`, `confirm`에 대해 알아 보겠습니다.
6
6
7
-
## alert
7
+
## 알림창(alert)
8
8
9
-
Syntax:
9
+
문법:
10
10
11
11
```js
12
12
alert(message);
13
13
```
14
14
15
-
This shows a message and pauses script execution until the user presses "OK".
15
+
이 메시지는 사용자가 확인("OK")을 누를 때까지 메시지를 표시하고 스크립트 실행을 일시 중지합니다.
16
16
17
-
For example:
17
+
예시:
18
18
19
19
```js run
20
20
alert("Hello");
21
21
```
22
22
23
-
The mini-window with the message is called a *modal window*. The word "modal" means that the visitor can't interact with the rest of the page, press other buttons, etc. until they have dealt with the window. In this case -- until they press "OK".
23
+
메시지가 있는 미니 창을 *모달창*(modal window)이라고 합니다. 모달"modal"이란 단어는 방문자가 창을 다룰 때까지 페이지의 나머지 부분과 상호 작용하거나 다른 버튼을 누르는 등의 작업을 수행할 수 없음을 의미합니다. 이 경우 - 확인("OK")를 누를 때까지 입니다.
24
24
25
-
## prompt
25
+
## 입력창(prompt)
26
26
27
-
The function `prompt` accepts two arguments:
27
+
`prompt`함수는 두 개의 인수를 받습니다.
28
28
29
29
```js no-beautify
30
30
result =prompt(title[, default]);
31
31
```
32
32
33
-
It shows a modal window with a text message, an input field for the visitor, and the buttons OK/CANCEL.
33
+
이 함수는 텍스트 메시지, 방문자를 위한 입력 필드(input field)과 확인/취소(OK/CANCEL) 버튼이 있는 모달 창을 보여줍니다.
34
34
35
35
`title`
36
-
: The text to show the visitor.
36
+
: 방문자에게 보여줄 텍스트입니다.
37
37
38
38
`default`
39
-
: An optional second parameter, the initial value for the input field.
39
+
: 선택사항인 두 번째 매개 변수는 입력 필드의 초기 값입니다.
40
40
41
-
The visitor may type something in the prompt input field and press OK. Or they can cancel the input by pressing CANCEL or hitting the `key:Esc` key.
41
+
방문자는 프롬프트 입력 필드에 내용을 입력하고 확인(OK)을 누릅니다. 또는 취소(CANCEL)을 누르거나 `key:Esc`키를 눌러 입력을 취소할 수 있습니다.
42
42
43
-
The call to `prompt` returns the text from the input field or `null` if the input was canceled.
43
+
`prompt`호출은 입력 필드에서 텍스트를 반환하거나 입력이 취소된 경우 `null`을 반환합니다.
44
44
45
-
For instance:
45
+
예시:
46
46
47
47
```js run
48
48
let age =prompt('How old are you?', 100);
49
49
50
50
alert(`You are ${age} years old!`); // You are 100 years old!
51
51
```
52
52
53
-
````warn header="In IE: always supply a `default`"
54
-
The second parameter is optional, but if we don't supply it, Internet Explorer will insert the text `"undefined"` into the prompt.
53
+
````warn header="IE 에서는 항상 '기본값'을 제공하십시오."
54
+
두 번째 매개변수는 선택사항이지만, 제공하지 않으면 Internet Explorer는 `"undefined"`텍스트를 프롬프트에 삽입합니다.
55
55
56
-
Run this code in Internet Explorer to see:
56
+
확인하기 위해 Internet Explorer에서 이 코드를 실행하십시오.
57
57
58
58
```js run
59
59
let test = prompt("Test");
60
60
```
61
61
62
-
So, for prompts to look good in IE, we recommend always providing the second argument:
62
+
따라서 IE에서 보기 좋게 prompt()를 실행하려면, 항상 두 번째 인수를 제공하는 것이 좋습니다.
63
63
64
64
```js run
65
65
let test = prompt("Test", ''); // <-- for IE
66
66
```
67
67
````
68
68
69
-
## confirm
69
+
## 확인창(confirm)
70
70
71
-
The syntax:
71
+
문법:
72
72
73
73
```js
74
74
result =confirm(question);
75
75
```
76
76
77
-
The function `confirm` shows a modal window with a `question` and two buttons: OK and CANCEL.
77
+
`confirm`함수는 질문(`question`)과 두 개의 버튼(OK/CANCEL)이 있는 모달 윈도우를 보여줍니다.
78
78
79
-
The result is `true` if OK is pressed and `false` otherwise.
79
+
OK를 누르면 `true`이고 그렇지 않으면 `false`입니다.
80
80
81
-
For example:
81
+
예시:
82
82
83
83
```js run
84
84
let isBoss =confirm("Are you the boss?");
85
85
86
86
alert( isBoss ); // true if OK is pressed
87
87
```
88
88
89
-
## Summary
89
+
## 요약
90
90
91
-
We covered 3 browser-specific functions to interact with visitors:
91
+
방문자와 상호작용할 수 있는 세 가지 브라우저 특유의 기능을 다뤘습니다.
92
92
93
93
`alert`
94
-
: shows a message.
94
+
: 메시지를 보여줍니다.
95
95
96
96
`prompt`
97
-
: shows a message asking the user to input text. It returns the text or, if CANCEL or `key:Esc` is clicked, `null`.
97
+
: 사용자에게 텍스트를 입력하라는 메시지를 표시합니다. 이 함수는 텍스트를 반환하거나, 취소(CANCEL) 또는`key:Esc`를 누르면 `null`을 반환합니다.
98
98
99
99
`confirm`
100
-
: shows a message and waits for the user to press "OK" or "CANCEL". It returns `true` for OK and `false` for CANCEL/`key:Esc`.
100
+
: 메시지를 보여주고 사용자가 확인("OK")또는 취소("CANCEL")을 누를 때까지 기다립니다. 이 함수는 확인(OK)에 대해 `true`를 반환하고 CANCEL/`key:Esc`에 대해 `false`를 반환합니다.
101
101
102
-
All these methods are modal: they pause script execution and don't allow the visitor to interact with the rest of the page until the window has been dismissed.
102
+
이 모든 메서드는 모달입니다. 이 메서드들은 스크립트 실행을 일시 중지하고 방문자가 창을 닫을 때까지 나머지 페이지와 상호 작용할 수 없도록 합니다.
103
103
104
-
There are two limitations shared by all the methods above:
104
+
위의 메서드에는 공통된 두 가지 제한 사항이 있습니다.
105
105
106
-
1. The exact location of the modal window is determined by the browser. Usually, it's in the center.
107
-
2. The exact look of the window also depends on the browser. We can't modify it.
106
+
1.모달 윈도우의 정확한 위치는 브라우저에 의해 결정됩니다. 대개 중앙에 있습니다.
107
+
2.창의 모양은 브라우저에 따라 달라집니다. 우리는 그것을 수정할 수 없습니다.
108
108
109
-
That is the price for simplicity. There are other ways to show nicer windows and richer interaction with the visitor, but if "bells and whistles" do not matter much, these methods work just fine.
109
+
이 것은 간단함(simplicity)을 위해 치러야할 대가입니다. 더 좋은 창을 표시하고 방문자와 보다 풍부한 상호 작용을 보여주는 다른 방법이 있지만 "멋으로 덧붙이는 부가 기능"이 별로 중요하지 않은 경우, 이 메서드를 사용하는게 좋습니다.
0 commit comments