diff --git a/1-js/02-first-steps/08-comparison/article.md b/1-js/02-first-steps/08-comparison/article.md index fb7d6a0eba..19c549ce2a 100644 --- a/1-js/02-first-steps/08-comparison/article.md +++ b/1-js/02-first-steps/08-comparison/article.md @@ -5,9 +5,9 @@ - 보다 큼/작음: a > b, a < b. - 보다 크거나/작거나 같음: a >= b, a <= b. - 같음: `a == b` (2개의 `=`기호에 유의합니다. 하나의 기호 `a ​​= b`는 할당을 의미합니다). -- 같지 않음. 수학에서 표기법은 다음과 같습니다. ≠, 자바스크립트에서는 느낌표가 붙은 할당연산자로 작성됩니다. a != b. +- 같지 않음: 수학에서 표기법은 다음과 같습니다. ≠, 자바스크립트에서는 느낌표가 붙은 할당연산자로 작성됩니다. a != b. -## 불리언은 결과입니다. +## 결과는 논리 타입(boolean)입니다. 다른 모든 연산자와 마찬가지로 비교는 값을 반환합니다. 이 경우 값은 불리언 값입니다. @@ -51,7 +51,6 @@ alert( 'Bee' > 'Be' ); // true 4. 각 문자열이 끝날 때까지 반복합니다. 5. 두 문자열이 같은 길이로 끝나면 두 문자열은 동일합니다. 그렇지 않으면 긴 문자열이 더 큽니다. -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: 위의 예제에서 문자열 `"Glow"` 와 `"Glee"`가 문자별로 비교되는 동안 비교-`'Z' > 'A'`는 첫 단계에서 결과에 도달합니다. 1. `G`는`G`와 같습니다. @@ -62,12 +61,11 @@ In the examples above, the comparison `'Z' > 'A'` gets to a result at the first 위에 주어진 비교 알고리즘은 사전이나 전화번호부에서 사용된 알고리즘과 거의 동일하지만 정확하게 동일하지는 않습니다. 예를 들어, 대소문자가 중요합니다. 대문자 `"A"`는 소문자 `"a"`와 같지 않습니다. 어느 것이 더 큽니까? 소문자 `"a"`입니다. 왜? 소문자는 "자바스크립트가 사용하는 내부 인코딩 테이블"(유니 코드)에서 더 큰 인덱스를 갖기 때문입니다. 주제에서 이에 대한 자세한 내용과 결과를 살펴 보겠습니다. - ``` ## 다른 타입간의 비교 +- ## 다른 타입간의 비교 -When comparing values of different types, JavaScript converts the values to numbers. 다른 유형의 값을 비교할 때 자바스크립트는 값을 숫자로 변환합니다. 예시: @@ -104,12 +102,12 @@ alert( Boolean(b) ); // true alert(a == b); // true! ``` -자바스크립트의 관점에서 보았을 때, 이 결과는 매우 정상입니다. 항등 검사`==`는 숫자 변환(`"0"`을 `0`으로)을 사용하여 값을 변환하고, 반면 명시적인 '불리언'변환은 그 밖의 규칙을 사용합니다. +자바스크립트의 관점에서 보았을 때, 이 것은 매우 정상적인 결과입니다. 항등 검사`==`는 숫자 변환(`"0"`을 `0`으로)을 사용하여 값을 변환하고, 반면 명시적인 '불리언'변환은 또 다른 규칙을 사용합니다. ```` ## 완전 항등 검사 -일반적인 항등 검사`==`는 문제가 있습니다. 그것은 `0`과 `false`를 구별 할 수 없습니다. +일반적인 항등 검사`==`는 문제가 있습니다. 그것은 `0`과 `false`를 구별할 수 없다는 것입니다ㅣ. ```js run alert( 0 == false ); // true @@ -127,7 +125,6 @@ alert( '' == false ); // true **완전 항등 연산자 `===`는 타입 변환없이 항등성을 검사합니다.** -In other words, if `a` and `b` are of different types, then `a === b` immediately returns `false` without an attempt to convert them. 다시 말해, `a`와 `b`가 다른 타입이라면, `a === b`는 변환하려고 시도하지 않고 즉시 `false`를 반환합니다. 해봅시다: @@ -144,7 +141,7 @@ alert( 0 === false ); // false, because the types are different 좀 더 많은 사레를 살펴봅시다. -`null`또는 `undefined`가 다른 값과 비교될 때 비직관적인 행동이 있습니다. +`null`또는 `undefined`으로 다른 값과 비교할 때 비직관적인 행동을 합니다. 완전 항등 검사`===` @@ -155,37 +152,36 @@ alert( 0 === false ); // false, because the types are different ``` 항등 검사`==` -: There's a special rule. These two are a "sweet couple": they equal each other (in the sense of `==`), but not any other value. -: 특별한 규칙이 있습니다. 이 두 가지는 "달콤한 커플"입니다 : 그들은 (`==`의 의미로) 서로 같지만 다른 값은 없습니다. +: 특별한 규칙이 있습니다. 이 두 가지는 "달콤한 커플"입니다 : 이 것들은 `==`을 사용하엿을 때 서로 동등하다고 나오지만 어떠한 값도 가지고 있지 않습니다. ```js run alert( null == undefined ); // true ``` -For maths and other comparisons `< > <= >=` -: `null/undefined` are converted to numbers: `null` becomes `0`, while `undefined` becomes `NaN`. +수학과 각각의 비교 `< > <= >=` +: `null/undefined`는 숫자로 변환됩니다. `null`은 `0`이되고 `undefined`는 `NaN`이 됩니다. -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. +이제 이 규칙을 적용했을 때 일어나는 재미있는 일들을 확인합니다. 그리고 무엇이 더 중요한지, 어떻게 이것들과 함정에 빠지지 않는지 확인합니다. -### Strange result: null vs 0 +### 이상한 결과 : null 대 0 -Let's compare `null` with a zero: +`null`과 0을 비교합시다. ```js run alert( null > 0 ); // (1) false alert( null == 0 ); // (2) false alert( null >= 0 ); // (3) *!*true*/!* ``` + +수학적으로 이 결과는 이상합니다. 마지막 결과는 "`null`이 0보다 크거나 같음"을 나타내고, 그래서 마지막 결과 위의 비교 중 하나는 `true`여야 하지만 둘 다 `false`입니다. -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. - -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. +그 이유는 항등 검사`==`와 비교`> < >= <=`가 다르게 작동하기 때문입니다. 비교는 `null`을 숫자로 변환하여 `0`으로 처리합니다. 이것이 (3) `null> = 0`이 true이고 (1)`null> 0`이 false 인 이유입니다. -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. +반면, `undefined`와 `null`에 대한 항등 검사`==`는 이렇게 정의됩니다. 어떠한 변환도 없이 이 둘은 서로 같지만 다른 무엇과도 같지않습니다. 이것이 (2)`null == 0`이 거짓인 이유입니다. -### An incomparable undefined +### 비교할 수 없는 undefined -The value `undefined` shouldn't be compared to other values: +`undefined`값은 다른 값과 비교되어서는 안됩니다. ```js run alert( undefined > 0 ); // false (1) @@ -193,25 +189,25 @@ alert( undefined < 0 ); // false (2) alert( undefined == 0 ); // false (3) ``` -Why does it dislike zero so much? Always false! +왜 이것은 0을 싫어하나요? 항상 `false` 입니다! -We get these results because: +다음과 같은 이유로 이러한 결과를 얻습니다. -- 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. -- The equality check `(3)` returns `false` because `undefined` only equals `null` and no other value. +- `(1)`과`(2)`는 `undefined`가 `NaN`으로 변환되고 `NaN`이 모든 비교에 대해 `false`를 반환하는 특수한 숫자 값이기 때문입니다. +- `undefined`는 오직 `null`만 같고 동등한 다른 값은 없어서 항등검사`(3)`은 `false`를 반환합니다. -### Evade problems +### 문제 회피 -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: +왜 이 예들을 검토하였을까요? 항상 이러한 특성을 기억해야 할까요? 글쎄요, 그렇진 않습니다. 사실, 이러한 까다로운 일들은 점차 익숙해 질 것입니다. 하지만 문제를 피할 수 있는 견고한 방법이 있습니다. -Just treat any comparison with `undefined/null` except the strict equality `===` with exceptional care. +완전 평등`===`을 제외한 `undefined/null`에 대한 모든 비교를 특별한 주의를 기울여 처리하십시오. -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. +뭘 하고 있는지 확신하지 못한다면, `>= > < <=`비교를 `null/undefined`일 수 있는 변수와 함께 사용하지 마십시오. 변수가 이 값을 가질 수 있으면, 변수를 개별적으로 검사하십시오. -## Summary +## 요약 -- Comparison operators return a boolean value. -- Strings are compared letter-by-letter in the "dictionary" order. -- When values of different types are compared, they get converted to numbers (with the exclusion of a strict equality check). -- The values `null` and `undefined` equal `==` each other and do not equal any other value. -- Be careful when using comparisons like `>` or `<` with variables that can occasionally be `null/undefined`. Checking for `null/undefined` separately is a good idea. +- 비교 연산자는 불리언 값을 반환합니다. +- 문자열은 "사전"순서로 문자단위로 비교됩니다. +- 서로 다른 유형의 값을 비교하면 숫자로 변환됩니다 ("완전 항등 검사"는 제외하고). +- `null`값과 `undefined`값은 서로 같고`==` 다른 어떠한 값과도 같지 않습니다. +- 때때로 `null/undefined`일 수 있는 변수에 대해 `>` 또는 `<`같은 비교를 사용할 때 주의하십시오. 개별적으로 `null/undefined`를 체크하는 것은 좋은 생각입니다. diff --git a/1-js/02-first-steps/09-alert-prompt-confirm/article.md b/1-js/02-first-steps/09-alert-prompt-confirm/article.md index 4bbfd58f12..4b05ed6933 100644 --- a/1-js/02-first-steps/09-alert-prompt-confirm/article.md +++ b/1-js/02-first-steps/09-alert-prompt-confirm/article.md @@ -1,48 +1,48 @@ -# Interaction: alert, prompt, confirm +# 상호 작용: 알림창, 입력창, 확인창 -This part of the tutorial aims to cover JavaScript "as is", without environment-specific tweaks. +튜토리얼의 이 파트는 브라우저(Browser) 환경 특유의 조정 없이 "있는 그대로"의 자바스크립트를 다루는 것을 목표로합니다. -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`. +그러나 우리는 여전히 브라우저(Browser)를 데모 환경으로 사용할 것이므로 최소한의 사용자 인터페이스 기능을 알아야 합니다. 이 챕터에서는 브라우저(Browser) 함수인 `alert`, `prompt`, `confirm`에 대해 알아 보겠습니다. -## alert +## 알림창(alert) -Syntax: +문법: ```js alert(message); ``` -This shows a message and pauses script execution until the user presses "OK". +이 메시지는 사용자가 확인("OK")을 누를 때까지 메시지를 표시하고 스크립트 실행을 일시 중지합니다. -For example: +예시: ```js run alert("Hello"); ``` -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". +메시지가 있는 미니 창을 *모달창*(modal window)이라고 합니다. 모달"modal"이란 단어는 방문자가 창을 다룰 때까지 페이지의 나머지 부분과 상호 작용하거나 다른 버튼을 누르는 등의 작업을 수행할 수 없음을 의미합니다. 이 경우 - 확인("OK")를 누를 때까지 입니다. -## prompt +## 입력창(prompt) -The function `prompt` accepts two arguments: +`prompt`함수는 두 개의 인수를 받습니다. ```js no-beautify result = prompt(title[, default]); ``` -It shows a modal window with a text message, an input field for the visitor, and the buttons OK/CANCEL. +이 함수는 텍스트 메시지, 방문자를 위한 입력 필드(input field)과 확인/취소(OK/CANCEL) 버튼이 있는 모달 창을 보여줍니다. `title` -: The text to show the visitor. +: 방문자에게 보여줄 텍스트입니다. `default` -: An optional second parameter, the initial value for the input field. +: 선택사항인 두 번째 매개 변수는 입력 필드의 초기 값입니다. -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. +방문자는 프롬프트 입력 필드에 내용을 입력하고 확인(OK)을 누릅니다. 또는 취소(CANCEL)을 누르거나 `key:Esc`키를 눌러 입력을 취소할 수 있습니다. -The call to `prompt` returns the text from the input field or `null` if the input was canceled. +`prompt`호출은 입력 필드에서 텍스트를 반환하거나 입력이 취소된 경우 `null`을 반환합니다. -For instance: +예시: ```js run let age = prompt('How old are you?', 100); @@ -50,35 +50,35 @@ let age = prompt('How old are you?', 100); alert(`You are ${age} years old!`); // You are 100 years old! ``` -````warn header="In IE: always supply a `default`" -The second parameter is optional, but if we don't supply it, Internet Explorer will insert the text `"undefined"` into the prompt. +````warn header="IE 에서는 항상 '기본값'을 제공하십시오." +두 번째 매개변수는 선택사항이지만, 제공하지 않으면 Internet Explorer는 `"undefined"`텍스트를 프롬프트에 삽입합니다. -Run this code in Internet Explorer to see: +확인하기 위해 Internet Explorer에서 이 코드를 실행하십시오. ```js run let test = prompt("Test"); ``` -So, for prompts to look good in IE, we recommend always providing the second argument: +따라서 IE에서 보기 좋게 prompt()를 실행하려면, 항상 두 번째 인수를 제공하는 것이 좋습니다. ```js run let test = prompt("Test", ''); // <-- for IE ``` ```` -## confirm +## 확인창(confirm) -The syntax: +문법: ```js result = confirm(question); ``` -The function `confirm` shows a modal window with a `question` and two buttons: OK and CANCEL. +`confirm`함수는 질문(`question`)과 두 개의 버튼(OK/CANCEL)이 있는 모달 윈도우를 보여줍니다. -The result is `true` if OK is pressed and `false` otherwise. +OK를 누르면 `true`이고 그렇지 않으면 `false`입니다. -For example: +예시: ```js run let isBoss = confirm("Are you the boss?"); @@ -86,24 +86,24 @@ let isBoss = confirm("Are you the boss?"); alert( isBoss ); // true if OK is pressed ``` -## Summary +## 요약 -We covered 3 browser-specific functions to interact with visitors: +방문자와 상호작용할 수 있는 세 가지 브라우저 특유의 기능을 다뤘습니다. `alert` -: shows a message. +: 메시지를 보여줍니다. `prompt` -: shows a message asking the user to input text. It returns the text or, if CANCEL or `key:Esc` is clicked, `null`. +: 사용자에게 텍스트를 입력하라는 메시지를 표시합니다. 이 함수는 텍스트를 반환하거나, 취소(CANCEL) 또는 `key:Esc`를 누르면 `null`을 반환합니다. `confirm` -: shows a message and waits for the user to press "OK" or "CANCEL". It returns `true` for OK and `false` for CANCEL/`key:Esc`. +: 메시지를 보여주고 사용자가 확인("OK")또는 취소("CANCEL")을 누를 때까지 기다립니다. 이 함수는 확인(OK)에 대해 `true`를 반환하고 CANCEL/`key:Esc`에 대해 `false`를 반환합니다. -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. +이 모든 메서드는 모달입니다. 이 메서드들은 스크립트 실행을 일시 중지하고 방문자가 창을 닫을 때까지 나머지 페이지와 상호 작용할 수 없도록 합니다. -There are two limitations shared by all the methods above: +위의 메서드에는 공통된 두 가지 제한 사항이 있습니다. -1. The exact location of the modal window is determined by the browser. Usually, it's in the center. -2. The exact look of the window also depends on the browser. We can't modify it. +1. 모달 윈도우의 정확한 위치는 브라우저에 의해 결정됩니다. 대개 중앙에 있습니다. +2. 창의 모양은 브라우저에 따라 달라집니다. 우리는 그것을 수정할 수 없습니다. -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. +이 것은 간단함(simplicity)을 위해 치러야할 대가입니다. 더 좋은 창을 표시하고 방문자와 보다 풍부한 상호 작용을 보여주는 다른 방법이 있지만 "멋으로 덧붙이는 부가 기능"이 별로 중요하지 않은 경우, 이 메서드를 사용하는게 좋습니다. diff --git a/1-js/02-first-steps/10-ifelse/article.md b/1-js/02-first-steps/10-ifelse/article.md index 1e12fa7b59..ca0e17c3cc 100644 --- a/1-js/02-first-steps/10-ifelse/article.md +++ b/1-js/02-first-steps/10-ifelse/article.md @@ -1,14 +1,14 @@ -# Conditional operators: if, '?' +# 조건 연산자: if, '?' -Sometimes, we need to perform different actions based on different conditions. +때때로, 우리는 다른 조건에 따라 다른 행동을 취할 필요가 있습니다. -To do that, we use the `if` statement and the conditional (ternary) operator which we will be referring to as the “question mark” operator `?` for simplicity. +그렇게하기 위해, `if`문과 간결함을 위해 `?`연산자로 참조될 조건부 삼항연산자(conditional ternary operator)를 사용합니다. -## The "if" statement +## "if" 문 -The `if` statement evaluates a condition and, if the condition's result is `true`, executes a block of code. +`if`문은 조건을 평가하고 조건 결과가 `true`이면 코드 블록을 실행합니다. -For example: +예시: ```js run let year = prompt('In which year was ECMAScript-2015 specification published?', ''); @@ -18,9 +18,9 @@ if (year == 2015) alert( 'You are right!' ); */!* ``` -In the example above, the condition is a simple equality check (`year == 2015`), but it can be much more complex. +위의 예제에서 조건은 간단한 항등 검사 (`year == 2015`)이지만 코드는 훨씬 더 복잡해질 수 있습니다. -If we want to execute more than one statement, we have to wrap our code block inside curly braces: +만약 둘 이상의 명령문을 실행하려면 코드 블록을 중괄호로 묶어야합니다. ```js if (year == 2015) { @@ -29,18 +29,18 @@ if (year == 2015) { } ``` -We recommend wrapping your code block with curly braces `{}` every time you use an `if` statement, even if there is only one statement to execute. Doing so improves readability. +`if` 문을 사용할 때마다 중괄호`{}`로 코드 블록을 래핑(wrapping)하는 것이 좋습니다. 단 하나의 명령문만 실행해도 마찬가지입니다. 이렇게하면 가독성이 향상됩니다. -## Boolean conversion +## 불리언,부울(논리 타입) 변환 -The `if (…)` statement evaluates the expression in its parentheses and converts the result to a boolean. +`if (…)` 문은 괄호 안의 표현식을 평가하고 결과를 부울로 변환합니다. -Let's recall the conversion rules from the chapter : + 챕터에 있는 변환 규칙을 상기해 보겠습니다. -- A number `0`, an empty string `""`, `null`, `undefined`, and `NaN` all become `false`. Because of that they are called "falsy" values. -- Other values become `true`, so they are called "truthy". +- 숫자`0`, 빈 문자열`""`, `null`, `undefined`, `NaN`은 모두 `false`가 됩니다. 이때문에 이 값들을 "falsy"값 이라고 부릅니다. +- 다른 값은 `true`가 되므로 "truthy"라고 합니다. -So, the code under this condition would never execute: +따라서 아래 조건의 코드는 절대로 실행되지 않습니다. ```js if (0) { // 0 is falsy @@ -48,7 +48,7 @@ if (0) { // 0 is falsy } ``` -...and inside this condition -- it always will: +... 그리고 다음 조건 안에서는 항상 실행할 것입니다. ```js if (1) { // 1 is truthy @@ -56,7 +56,7 @@ if (1) { // 1 is truthy } ``` -We can also pass a pre-evaluated boolean value to `if`, like this: +다음과 같이 사전 평가된 부울 값을 `if`에 전달할 수 도 있습니다 : ```js let cond = (year == 2015); // equality evaluates to true or false @@ -66,11 +66,11 @@ if (cond) { } ``` -## The "else" clause +## "else"절 -The `if` statement may contain an optional "else" block. It executes when the condition is false. +`if`문은 임의로 "else"블록을 포함할 수 있습니다. 조건이 거짓일 때 실행됩니다. -For example: +예시: ```js run let year = prompt('In which year was the ECMAScript-2015 specification published?', ''); @@ -81,11 +81,11 @@ if (year == 2015) { } ``` -## Several conditions: "else if" +## 여러 조건 : "else if" -Sometimes, we'd like to test several variants of a condition. The `else if` clause lets us do that. +때때로 조건의 여러 변형을 테스트해야 합니다. `else if`절이 그렇게할 수 있게 합니다. -For example: +예시: ```js run let year = prompt('In which year was the ECMAScript-2015 specification published?', ''); @@ -99,15 +99,15 @@ if (year < 2015) { } ``` -In the code above, JavaScript first checks `year < 2015`. If that is falsy, it goes to the next condition `year > 2015`. If that is also falsy, it shows the last `alert`. +위의 코드에서 JavaScript는 먼저 `year < 2015`를 확인합니다. 이 조건이 falsy라면 다음 조건`year > 2015`'으로 진행됩니다. 이 조건 또한 falsy인 경우 마지막 `alert`를 표시합니다. -There can be more `else if` blocks. The final `else` is optional. +더 많은 `else if`블록이 있을 수 있습니다. 마지막 `else`는 선택 사항입니다. -## Ternary operator '?' +## 삼항 연산자 '?' -Sometimes, we need to assign a variable depending on a condition. +때로는 조건에 따라 변수를 할당해야 합니다. -For instance: +예시: ```js run no-beautify let accessAllowed; @@ -124,26 +124,26 @@ if (age > 18) { alert(accessAllowed); ``` -The so-called "ternary" or "question mark" operator lets us do that in a shorter and simpler way. +소위 "삼항"(ternary) 또는 "물음표"라는 연산자는 더 짧고 간단한 방법으로 여러 조건을 테스트할 수 있게 합니다. -The operator is represented by a question mark `?`. The formal term "ternary" means that the operator has three operands. It is actually the one and only operator in JavaScript which has that many. +연산자는 물음표`?`로 표시됩니다. 공식 용어 "삼항"(ternary)은 연산자에 3개의 피연산자(operand)가 있음을 의미합니다. 이것은 실제로 자바스크립트에서 피연사자를 가장 많이 가진 유일한 연산자입니다. -The syntax is: +문법: ```js let result = condition ? value1 : value2; ``` -The `condition` is evaluated: if it's truthy then `value1` is returned, otherwise -- `value2`. +평가받은 조건`condition`: truthy 일 경우 `value1`이 반환되고, 그렇지 않으면 `value2`가 반환됩니다. -For example: +예시: ```js let accessAllowed = (age > 18) ? true : false; ``` -Technically, we can omit the parentheses around `age > 18`. The question mark operator has a low precedence, so it executes after the comparison `>`. +기술적으로, `age > 18` 주위에 괄호를 생략 할 수 있습니다. 물음표 연산자는 우선 순위가 낮으므로 비교 `>`후에 실행됩니다. -This example will do the same thing as the previous one: +이 예제는 이전 것과 같은 동작을 할 것입니다. ```js // the comparison operator "age > 18" executes first anyway @@ -151,10 +151,10 @@ This example will do the same thing as the previous one: let accessAllowed = age > 18 ? true : false; ``` -But parentheses make the code more readable, so we recommend using them. +그러나 괄호를 사용하면 코드를 더 쉽게 ​​읽을 수 있게 하므로 사용하는 것이 좋습니다. ````smart -In the example above, you can avoid using the question mark operator because the comparison itself returns `true/false`: +위의 예제에서 비교 자체가 `true/false`를 반환하기 때문에 물음표 연산자를 사용하지 않아도 됩니다. ```js // the same @@ -162,11 +162,11 @@ let accessAllowed = age > 18; ``` ```` -## Multiple '?' +## 다중 '?' -A sequence of question mark operators `?` can return a value that depends on more than one condition. +일련의 물음표 연산자`?`는 둘 이상의 조건에 의존하는 값을 반환할 수 있습니다. -For instance: +예시: ```js run let age = prompt('age?', 18); @@ -178,14 +178,14 @@ let message = (age < 3) ? 'Hi, baby!' : alert( message ); ``` -It may be difficult at first to grasp what's going on. But after a closer look, we can see that it's just an ordinary sequence of tests: +처음에는 무슨 일이 일어나고 있는지 파악하기가 어려울 수 있습니다. 그러나 더 자세히 살펴보면, 테스트의 일반적인 순서라는 것을 알 수 있습니다. -1. The first question mark checks whether `age < 3`. -2. If true -- it returns `'Hi, baby!'`. Otherwise, it continues to the expression after the colon '":"', checking `age < 18`. -3. If that's true -- it returns `'Hello!'`. Otherwise, it continues to the expression after the next colon '":"', checking `age < 100`. -4. If that's true -- it returns `'Greetings!'`. Otherwise, it continues to the expression after the last colon '":"', returning `'What an unusual age!'`. +1. 첫 번째 물음표는 `age < 3`인지 확인합니다. +2. 그 결과가 참(true)이면 - `Hi, baby!`를 반환합니다. 그렇지 않으면 콜론 '":"' 이후에 `age < 18`을 확인하는 표현식을 계속합니다. +3. 그 결과가 참(true)이면 ``Hello!'` 를 반환합니다. 그렇지 않으면 다음 콜론 '":"' ' 이후에 `age < 100`을 확인하는 표현식을 계속합니다. +4. 그 결과가 참(true)이면 `'Greetings!'`을 반환합니다. 그렇지 않으면 마지막 콜론 ': "" 이후에 `'What an unusual age!'`를 반환하는 표현식을 계속합니다. -Here's how this looks using `if..else`: +`if..else`를 사용하면 어떻게 보이는지 확인해봅시다. ```js if (age < 3) { @@ -199,9 +199,9 @@ if (age < 3) { } ``` -## Non-traditional use of '?' +## 종전과 다른 '?'사용 -Sometimes the question mark `?` is used as a replacement for `if`: +때로는 물음표`?`가 `if`의 대체물로 사용되기도 합니다 ```js run no-beautify let company = prompt('Which company created JavaScript?', ''); @@ -212,15 +212,15 @@ let company = prompt('Which company created JavaScript?', ''); */!* ``` -Depending on the condition `company == 'Netscape'`, either the first or the second expression after the `?` gets executed and shows an alert. +`company == 'Netscape'`조건에 따라 `?` 다음의 첫 번째 또는 두 번째 표현식이 실행되고 경고가 표시됩니다. -We don't assign a result to a variable here. Instead, we execute different code depending on the condition. +여기서 변수에 결과를 할당하지 않습니다. 대신, 우리는 조건에 따라 다른 코드를 실행합니다. -**We don't recommend using the question mark operator in this way.** +**이런 식으로 물음표 연산자를 사용하지 않는 것이 좋습니다.** -The notation is shorter than the equivalent `if` statement, which appeals to some programmers. But it is less readable. +이 물음표 표기법은 동등한 `if` 문 보다 짧아서 일부 프로그래머에게 매력적으로 느껴집니다. 그러나 읽기 쉽지 않습니다. -Here is the same code using `if` for comparison: +비교를 위해 `if`를 사용하는 동일한 코드가 있습니다. ```js run no-beautify let company = prompt('Which company created JavaScript?', ''); @@ -234,6 +234,6 @@ if (company == 'Netscape') { */!* ``` -Our eyes scan the code vertically. Code blocks which span several lines are easier to understand than a long, horizontal instruction set. +우리의 눈은 코드를 수직으로 스캔합니다. 여러 줄에 걸쳐있는 코드 블록은 길고 수평 인 명령어 세트보다 이해하기 쉽습니다. -The purpose of the question mark operator `?` is to return one value or another depending on its condition. Please use it for exactly that. Use `if` when you need to execute different branches of code. +물음표 연산자`?`의 목적은 조건에 따라 하나의 값 또는 다른 값을 반환하는 것입니다. 정확하게 사용하십시오. 다른 코드 분기를 실행할 필요가 있을 때 `if`를 사용하십시오. diff --git a/1-js/02-first-steps/11-logical-operators/article.md b/1-js/02-first-steps/11-logical-operators/article.md index 4932020ae4..490105128f 100644 --- a/1-js/02-first-steps/11-logical-operators/article.md +++ b/1-js/02-first-steps/11-logical-operators/article.md @@ -1,24 +1,24 @@ -# Logical operators +# 논리 연산자 -There are three logical operators in JavaScript: `||` (OR), `&&` (AND), `!` (NOT). +자바스크립트에는 세 가지 논리 연산자가 있습니다: `||`(OR), `&&`(AND), `!`(NOT). -Although they are called "logical", they can be applied to values of any type, not only boolean. Their result can also be of any type. +"논리적"이라고 부르지만 모든 유형의 값에 적용 할 수 있습니다.(논리 타입뿐만 아니라) 그 결과는 어떤 타입이든 가능합니다. -Let's see the details. +세부 사항을 확인합시다. ## || (OR) -The "OR" operator is represented with two vertical line symbols: +"OR"연산자는 두 개의 수직선 기호로 표시됩니다. ```js result = a || b; ``` -In classical programming, the logical OR is meant to manipulate boolean values only. If any of its arguments are `true`, it returns `true`, otherwise it returns `false`. +클래식 프로그래밍에서 "논리적 OR"은 불리언 값만 조작하기 위한 것이었습니다. 인수중 하나라도 `true`이면 `true`를 반환하고, 그렇지 않으면 `false`를 반환합니다. -In JavaScript, the operator is a little bit trickier and more powerful. But first, let's see what happens with boolean values. +자바스크립트에서 연산자는 조금 더 까다롭고 강력합니다. 하지만 먼저 불리언 값에 어떤 일이 일어나는지 살펴 보겠습니다. -There are four possible logical combinations: +가능한 논리적 조합에는 네 가지가 있습니다. ```js run alert( true || true ); // true @@ -27,21 +27,21 @@ alert( true || false ); // true alert( false || false ); // false ``` -As we can see, the result is always `true` except for the case when both operands are `false`. +보시다시피 결과는 두 피연산자가 모두 `false`인 경우를 제외하고 항상 `true`입니다. -If an operand is not a boolean, it's converted to a boolean for the evaluation. - -For instance, the number `1` is treated as `true`, the number `0` as `false`: +피연산자가 논리타입이 아니면 평가를 위해 논리타입으로 변환됩니다. +예를 들어, 숫자 `1`은 `true`로 취급되고 숫자 `0`은 `false`로 취급됩니다. + ```js run if (1 || 0) { // works just like if( true || false ) alert( 'truthy!' ); } ``` -Most of the time, OR `||` is used in an `if` statement to test if *any* of the given conditions is `true`. +대부분의 경우, OR `||`는 주어진 조건 중 어떠한 것이 `true`인지 테스트하기 위해 `if`문에서 사용합니다. -For example: +예: ```js run let hour = 9; @@ -53,7 +53,7 @@ if (hour < 10 || hour > 18) { } ``` -We can pass more conditions: +더 많은 조건을 넘길 수 있습니다. ```js run let hour = 12; @@ -64,29 +64,29 @@ if (hour < 10 || hour > 18 || isWeekend) { } ``` -## OR finds the first truthy value +## OR은 첫 번째로 참인 값을 찾습니다. -The logic described above is somewhat classical. Now, let's bring in the "extra" features of JavaScript. +위에서 설명한 로직(논리)은 다소 고전적입니다. 이제 자바스크립트의 "추가"기능을 소개하겠습니다. -The extended algorithm works as follows. +확장 알고리즘은 다음과 같이 작동합니다. -Given multiple OR'ed values: +OR 값이 여러 개있는 경우: ```js result = value1 || value2 || value3; ``` -The OR `||` operator does the following: +OR`||`연산자는 다음을 수행합니다. -- Evaluates operands from left to right. -- For each operand, converts it to boolean. If the result is `true`, stops and returns the original value of that operand. -- If all operands have been evaluated (i.e. all were `false`), returns the last operand. +- 피연산자(operand)를 왼쪽에서 오른쪽으로 수치를 구합니다. +- 각 피연산자에 대해 논리 타입으로 변환합니다. 결과가 `true`이면 수치연산을 멈추고 해당 피연산자의 원래 값(변환 전)을 반환합니다. +- 모든 피연산자의 수치를 구한 경우(즉 모두 `거짓`인 경우) 마지막 피연산자를 반환합니다. -A value is returned in its original form, without the conversion. +값은 변환없이 원래 형식으로 반환됩니다. -In other words, a chain of OR `"||"` returns the first truthy value or the last one if no such value is found. +바꾸어 말하면, OR`"||"`의 연속은 첫 번째 참인 값을 반환하거나 참인 값이 없으면 마지막 값을 반환합니다. -For instance: +예: ```js run alert( 1 || 0 ); // 1 (1 is truthy) @@ -97,13 +97,14 @@ alert( null || 0 || 1 ); // 1 (the first truthy value) alert( undefined || null || 0 ); // 0 (all falsy, returns the last value) ``` -This leads to some interesting usage compared to a "pure, classical, boolean-only OR". +위의 예시들은 "순수하고 전형적인 부울-전용 OR"과 비교되는 흥미로운 사용법을 유도합니다. -1. **Getting the first truthy value from a list of variables or expressions.** +1. **변수 또는 표현식 목록에서 첫 번째 truthy 값 얻기.** Imagine we have several variables which can either contain data or be `null/undefined`. How can we find the first one with data? + 데이터를 담거나 `null/undefined`일 수 있는 여러 변수가 있다고 상상해봅시다. 데이터를 가진 첫 번째 변수를 어떻게 찾을 수 있을까요? - We can use OR `||`: + OR `||`을 사용할 수 있습니다: ```js run let currentUser = null; @@ -116,14 +117,16 @@ This leads to some interesting usage compared to a "pure, classical, boolean-onl alert( name ); // selects "John" – the first truthy value ``` - If both `currentUser` and `defaultUser` were falsy, `"unnamed"` would be the result. -2. **Short-circuit evaluation.** + `currentUser`와 `defaultUser` 둘 다 거짓(falsy)이면, `"unnamed"`가 결과가 됩니다. + +2. **단락 회로 평가.(Short-circuit evaluation)** - Operands can be not only values, but arbitrary expressions. OR evaluates and tests them from left to right. The evaluation stops when a truthy value is reached, and the value is returned. This process is called "a short-circuit evaluation" because it goes as short as possible from left to right. + 피연산자는 값뿐만 아니라 임의의 표현식이 될 수 있습니다. OR`||`는 왼쪽에서 오른쪽으로 평가 및 테스트합니다. 참인 값에 도달하면 평가가 중지되고 그 값이 리턴됩니다. 이 프로세스는 가능한 한 짧게 왼쪽에서 오른쪽으로 진행되기 때문에 "단락 회로 평가"라고합니다. - This is clearly seen when the expression given as the second argument has a side effect like a variable assignment. + "단락 회로 평가"는 두 번째 인수로 주어진 표현식이 변수 할당과 같은 부수적인 효과를 가질 때 분명하게 나타납니다. In the example below, `x` does not get assigned: + 아래 예제에서 `x`는 할당되지 않습니다.: ```js run no-beautify let x; @@ -133,7 +136,7 @@ This leads to some interesting usage compared to a "pure, classical, boolean-onl alert(x); // undefined, because (x = 1) not evaluated ``` - If, instead, the first argument is `false`, `||` evaluates the second one, thus running the assignment: + 대신에 첫 번째 인수가 `false`인 경우, `||`는 두 번째 인수를 평가하여 할당을 수행합니다. ```js run no-beautify let x; @@ -143,9 +146,10 @@ This leads to some interesting usage compared to a "pure, classical, boolean-onl alert(x); // 1 ``` - An assignment is a simple case. Other side effects can also be involved. + 할당은 간단한 경우입니다. 다른 부수적인 효과도 발생할 수 있습니다. As we can see, such a use case is a "shorter way of doing `if`". The first operand is converted to boolean. If it's false, the second one is evaluated. + 우리가 볼 수 있듯이, 그러한 유스 케이스는 "if if를하는 더 짧은 방법"이다. 첫 번째 피연산자는 부울로 변환됩니다. 거짓이면 두 번째 것이 평가됩니다. Most of time, it's better to use a "regular" `if` to keep the code easy to understand, but sometimes this can be handy.