두 번째 대단원 맞춤법 점검(WIP)

Author: Violet-Bora-Lee

1-js/02-first-steps/01-hello-world/article.md

@@ -4,10 +4,10 @@
 
 코어 자바스크립트를 다루고 있긴 하지만, 학습을 위해선 스크립트를 실행할 수 있는 환경이 필요합니다. 본 튜토리얼은 온라인으로 제공되기 때문에 실행환경으로 브라우저를 사용하도록 하겠습니다. Node.js와 같이 브라우저 이외의 환경에 주력하는 학습자를 위해, 브라우저 한정 명령어(`alert` 등)는 최소한으로 사용하도록 하겠습니다. 이런 명령어를 학습하는 데 시간을 보내지 않도록 말이죠. 브라우저 환경에서의 자바스크립트는 [다음 파트](/ui)에서 다루도록 하겠습니다.
 
-먼저, 웹 페이지에 스크립트를 삽입하는 방법에 대해 알아봅시다. Node.js와 같은 서버 사이드 환경에서 스크립트를 실행하고 싶다면 `"node my.js"`와 같은 명령어를 사용하면 됩니다.
+먼저, 웹 페이지에 스크립트를 삽입하는 방법에 대해 알아봅시다. 참고로 Node.js와 같은 서버 사이드 환경에서 스크립트를 실행하고 싶다면 `'node my.js'`와 같은 명령어를 사용하면 됩니다.
 
 
-## "script" 태그
+## 'script' 태그
 
 `<script>` 태그를 이용하면 자바스크립트 프로그램을 HTML 문서 어느 곳에나 삽입할 수 있습니다.
 
@@ -35,7 +35,7 @@
 ```
 
 ```online
-오른쪽 위에 있는 "재생" 버튼을 누르면 예제가 실행됩니다.
+오른쪽 위에 있는 '재생' 버튼을 누르면 예제가 실행됩니다.
 ```
 
 `<script>` 태그엔 자바스크립트 코드가 들어갑니다. 브라우저는 이 태그를 만나면 안의 코드를 자동으로 처리합니다.
@@ -99,8 +99,8 @@ HTML 안에 직접 스크립트를 작성하는 방식은 대개 스크립트가
 이를 통해 트래픽이 절약되고 웹 페이지의 실 속도가 빨라집니다.
 ```
 
-````warn header="`src` 속성이 있으면, 태그 내부의 코드는 무시됩니다."
-`<script>` 태그는 `src` 속성과 내부 코드를 동시에 가지지 못합니다. 
+````warn header="`src` 속성이 있으면 태그 내부의 코드는 무시됩니다."
+`<script>` 태그는 `src` 속성과 내부 코드를 동시에 가지지 못합니다.
 
 다음 코드는 실행되지 않습니다.
 

1-js/02-first-steps/02-structure/article.md

@@ -6,11 +6,11 @@
 
 문(statement)은 어떤 작업을 수행하는 문법 구조(syntax structure)와 명령어(command)를 의미합니다.
 
-앞서 "Hello, world!" 메시지를 보여주는 `alert('Hello, world!')` 문을 확인한 바 있습니다.
+앞서 'Hello, world!' 메시지를 보여주는 `alert('Hello, world!')` 문을 확인한 바 있습니다.
 
 코드엔 원하는 만큼 문을 작성할 수 있습니다. 이때, 서로 다른 문은 세미콜론으로 구분합니다.
 
-아래 코드는 "Hello World"를 두 개의 alert 문으로 나눈 예시입니다.
+아래 코드는 'Hello World'를 두 개의 alert 문으로 나눈 예시입니다.
 
 ```js run no-beautify
 alert('Hello'); alert('World');
@@ -34,9 +34,9 @@ alert('Hello')
 alert('World')
 ```
 
-자바스크립트는 줄 바꿈이 있으면 이를 "암시적" 세미콜론으로 해석합니다. 이런 동작 방식을 [세미콜론 자동 삽입(automatic semicolon insertion)](https://tc39.github.io/ecma262/#sec-automatic-semicolon-insertion)이라 부릅니다.
+자바스크립트는 줄 바꿈이 있으면 이를 '암시적' 세미콜론으로 해석합니다. 이런 동작 방식을 [세미콜론 자동 삽입(automatic semicolon insertion)](https://tc39.github.io/ecma262/#sec-automatic-semicolon-insertion)이라 부릅니다.
 
-**대부분의 경우, 줄 바꿈은 세미콜론을 의미합니다. 하지만 "대부분의 경우"가 "항상"을 의미하진 않습니다.**
+**대부분의 경우, 줄 바꿈은 세미콜론을 의미합니다. 하지만 '대부분의 경우'가 '항상'을 의미하진 않습니다.**
 
 아래와 같이 줄 바꿈이 세미콜론을 의미하지 않는 경우도 있습니다.
 
@@ -46,9 +46,9 @@ alert(3 +
 + 2);
 ```
 
-세미콜론 자동 삽입이 일어나지 않았기 때문에 `6`이 출력됩니다. 어떤 줄이 `"+"` 로 끝나면, 그 줄은 "불완전한 표현식"이므로 세미콜론이 필요하지 않다는 걸 직감하실 겁니다. 위 코드도 이런 의도로 동작합니다.
+세미콜론 자동 삽입이 일어나지 않았기 때문에 `6`이 출력됩니다. 어떤 줄이 `"+"` 로 끝나면, 그 줄은 '불완전한 표현식'이므로 세미콜론이 필요하지 않다는 걸 직감하실 겁니다. 위 코드도 이런 의도로 동작합니다.
 
-**반면, 세미콜론이 정말로 필요하지만 자바스크립트가 이를 추정하지 "못하는" 상황도 존재합니다.**
+**반면, 세미콜론이 정말로 필요하지만 자바스크립트가 이를 추정하지 '못하는' 상황도 존재합니다.**
 
 이런 상황에서 발생하는 에러는 찾거나 고치기가 상당히 어렵습니다.
 
@@ -75,7 +75,7 @@ alert("에러가 발생합니다.")
 ```js run
 alert("제대로 동작합니다.");
 
-[1, 2].forEach(alert)  
+[1, 2].forEach(alert)
 ```
 
 "제대로 동작합니다." 메시지 다음에 `1`과 `2`가 나타나는 것을 확인할 수 있죠.

1-js/02-first-steps/03-strict-mode/article.md

@@ -4,9 +4,9 @@
 
 덕분에 기존에 작성한 코드는 절대 망가지지 않는다는 장점이 있었습니다. 하지만 자바스크립트 창시자들이 했던 실수나 불완전한 결정이 언어 안에 영원히 박제된다는 단점도 생겼습니다.
 
-이런 상황은 ECMAScript5(ES5)가 등장하기 전인 2009년까지 지속되었습니다. 그런데 새롭게 제정된 ES5에서는 새로운 기능이 추가되고 기존 기능 중 일부가 변경되었습니다. 기존 기능을 변경하였기 때문에 하위 호환성 문제가 생길 수 있겠죠? 그래서 변경사항 대부분은 ES5의 기본 모드에선 활성화되지 않도록 설계되었습니다. 대신 `"use strict"`라는 특별한 지시자를 사용해 엄격 모드(strict mode)를 활성화 했을 때만 이 변경사항이 활성화되게 해놓았습니다.
+이런 상황은 ECMAScript5(ES5)가 등장하기 전인 2009년까지 지속되었습니다. 그런데 새롭게 제정된 ES5에서는 새로운 기능이 추가되고 기존 기능 중 일부가 변경되었습니다. 기존 기능을 변경하였기 때문에 하위 호환성 문제가 생길 수 있겠죠? 그래서 변경사항 대부분은 ES5의 기본 모드에선 활성화되지 않도록 설계되었습니다. 대신 `use strict`라는 특별한 지시자를 사용해 엄격 모드(strict mode)를 활성화 했을 때만 이 변경사항이 활성화되게 해놓았습니다.
 
-## "use strict"
+## use strict
 
 지시자 `"use strict"`, 혹은 `'use strict'`는 단순한 문자열처럼 생겼습니다. 하지만 이 지시자가 스크립트 최상단에 오면 스크립트 전체가 "모던한" 방식으로 동작합니다.
 
@@ -21,7 +21,6 @@
 
 명령어를 그룹화하는 방식인 함수에 대해선 곧 학습하도록 하겠습니다. 함수에 대해 학습하기 전에, `"use strict"`는 스크립트 최상단이 아닌 함수 본문 맨 앞에 올 수도 있다는 점을 알아두시기 바랍니다. 이렇게 하면 오직 해당 함수만 엄격 모드로 실행됩니다. 엄격 모드는 대개 스크립트 전체에 적용하지만 말이죠.
 
-````warn header="Ensure that \"use strict\" is at the top"
 ````warn header="\"use strict\"는 반드시 최상단에 위치시키세요."
 `"use strict"`는 스크립트 최상단에 있어야 한다는 점을 잊지 마세요. 그렇지 않으면 엄격 모드가 활성화되지 않을 수도 있습니다.
 
@@ -51,7 +50,7 @@ alert("some code");
 
 `use strict`에 영향을 받는 경우라면 개발자는 기대하지 않았던 결과를 얻을 수 있기 때문입니다.
 
-그렇다면 어떻게 해야 콘솔에서 `use strict`를 사용할 수 있을까요? 
+그렇다면 어떻게 해야 콘솔에서 `use strict`를 사용할 수 있을까요?
 
 'use strict'를 입력한 후, `Shift+Enter키`를 눌러 줄 바꿈 해 원하는 스크립트를 입력하면 됩니다. 아래와 같이 말이죠.
 
@@ -81,7 +80,7 @@ alert("some code");
 
 모던 자바스크립트는 '클래스'와 '모듈'이라 불리는 진일보한 구조를 제공합니다(클래스와 모듈에 대해선 당연히 뒤에서 학습할 예정입니다). 이 둘을 사용하면 `use strict`가 자동으로 적용되죠. 따라서 이 둘을 사용하고 있다면 스크립트에 `"use strict"`를 붙일 필요가 없습니다.
 
-결론은 이렇습니다. **코드를 클래스와 모듈을 사용해 구성한다면 `"use strict"`를 생략해도 됩니다. 그런데 아직은 이 둘을 배우지 않았으니 `"use strict"`를 귀한 손님처럼 모시도록 합시다.**
+결론은 이렇습니다. **코드를 클래스와 모듈을 사용해 구성한다면 `"use strict"`를 생략해도 됩니다. 그런데 아직은 이 둘을 배우지 않았으니 `"use strict"`를 귀한 손님처럼 모시도록 하겠습니.**
 
 지금까지는 `use strict`의 일반적인 특징에 대해 알아보았습니다.
 

1-js/02-first-steps/04-variables/article.md

@@ -8,11 +8,11 @@
 
 ## 변수
 
-[변수(variable)](https://en.wikipedia.org/wiki/Variable_(computer_science))는 데이터를 저장할 때 쓰이는 "이름이 붙은 저장소" 입니다. 온라인 쇼핑몰 애플리케이션을 구축하는 경우 상품이나 방문객 등의 정보를 저장할 때 변수를 사용하죠.
+[변수(variable)](https://en.wikipedia.org/wiki/Variable_(computer_science))는 데이터를 저장할 때 쓰이는 '이름이 붙은 저장소' 입니다. 온라인 쇼핑몰 애플리케이션을 구축하는 경우 상품이나 방문객 등의 정보를 저장할 때 변수를 사용하죠.
 
 자바스크립트에선 `let` 키워드를 사용해 변수를 생성합니다.
 
-아래 문(statement)은 "message"라는 이름을 가진 변수를 생성(*선언*)합니다.
+아래 문(statement)은 'message'라는 이름을 가진 변수를 생성(*선언*)합니다.
 
 ```js
 let message;
@@ -70,7 +70,7 @@ let user = 'John',
   message = 'Hello';
 ```
 
-"쉼표가 먼저 오는" 방식으로 작성하는 사람도 있습니다.
+'쉼표가 먼저 오는' 방식으로 작성하는 사람도 있습니다.
 
 ```js no-beautify
 let user = 'John'
@@ -88,16 +88,16 @@ let user = 'John'
 *!*var*/!* message = 'Hello';
 ```
 
-`var`는 `let`과 *거의* 동일하게 동작합니다. `var`도 `let`처럼 변수를 선언하는 데 쓰이죠. 다만 `var`는 "오래된" 방식입니다.
+`var`는 `let`과 *거의* 동일하게 동작합니다. `var`도 `let`처럼 변수를 선언하는 데 쓰이죠. 다만 `var`는 '오래된' 방식입니다.
 
 `let`과 `var`의 미묘한 차이점에 대해선 추후 <info:var> 에서 자세히 다루도록 하겠습니다. 지금 시점에선 이 차이점이 중요하지 않기 때문에 넘어가도록 합시다.
 ````
 
 ## 현실 속의 비유
 
-"상자" 안에 데이터를 저장하는데, 이 상자에는 특별한 이름표가 붙어 있다고 상상해 봅시다. 이렇게 하면 "변수"를 좀 더 쉽게 이해할 수 있습니다.
+'상자' 안에 데이터를 저장하는데, 이 상자에는 특별한 이름표가 붙어 있다고 상상해 봅시다. 이렇게 하면 '변수'를 좀 더 쉽게 이해할 수 있습니다.
 
-예를 들어, 변수 `message`는 `"message"`라는 이름표가 붙어있는 상자에 `"Hello!"`라는 값을 저장한 것이라고 생각할 수 있습니다.
+예를 들어, 변수 `message`는 `message`라는 이름표가 붙어있는 상자에 `"Hello!"`라는 값을 저장한 것이라고 생각할 수 있습니다.
 
 ![](variable.svg)
 
@@ -136,9 +136,9 @@ alert(message); // Hello world!
 ```
 
 ```smart header="함수형 언어"
-[함수형(functional)](https://en.wikipedia.org/wiki/Functional_programming) 프로그래밍 언어는 변숫값 변경을 금지합니다. [스칼라(Scala)](http://www.scala-lang.org/)와 [얼랭(Erlang)](http://www.erlang.org/)은 대표적인 함수형 언어입니다. 
+[함수형(functional)](https://en.wikipedia.org/wiki/Functional_programming) 프로그래밍 언어는 변숫값 변경을 금지합니다. [스칼라(Scala)](http://www.scala-lang.org/)와 [얼랭(Erlang)](http://www.erlang.org/)은 대표적인 함수형 언어입니다.
 
-이들 언어에서는 "상자 속에" 값이 일단 저장되면, 그 값을 영원히 유지합니다. 다른 값을 저장하고 싶다면 새로운 상자를 만들어야(새 변수를 선언해야)만 합니다. 이전 변수를 재사용할 수 없습니다.
+이들 언어에서는 '상자 속에' 값이 일단 저장되면, 그 값을 영원히 유지합니다. 다른 값을 저장하고 싶다면 새로운 상자를 만들어야(새 변수를 선언해야)만 합니다. 이전 변수를 재사용할 수 없습니다.
 
 처음 봤을 땐 좀 이상해 보일 수 있지만, 함수형 언어는 중대한 개발에 상당히 적합한 언어입니다. 이런 제약이 장점으로 작용하는 병렬 계산(parallel computation)과 같은 영역도 있죠. 당장은 사용할 계획이 없더라도 이런 언어를 공부하는 것은 시야를 넓히는 데 도움이 되므로, 학습을 권유 드립니다.
 ```
@@ -164,8 +164,8 @@ let test123;
 아래는 유효한 변수명에 관한 예시입니다.
 
 ```js run untrusted
-let $ = 1; // "$"라는 이름의 변수를 선언합니다.
-let _ = 2; // "_"라는 이름의 변수를 선언합니다.
+let $ = 1; // '$'라는 이름의 변수를 선언합니다.
+let _ = 2; // '_'라는 이름의 변수를 선언합니다.
 
 alert($ + _); // 3
 ```
@@ -198,11 +198,11 @@ let 我 = '...';
 
 예약어 예시: `let`, `class`, `return`, `function`
 
-아래 코드는 문법(syntax) 에러를 발생시킵니다.
+아래 코드는 문법 에러를 발생시킵니다.
 
 ```js run no-beautify
-let let = 5; // "let"을 변수명으로 사용할 수 없으므로 에러!
-let return = 5; // "return"을 변수명으로 사용할 수 없으므로 에러!
+let let = 5; // 'let'을 변수명으로 사용할 수 없으므로 에러!
+let return = 5; // 'return'을 변수명으로 사용할 수 없으므로 에러!
 ```
 ````
 
@@ -213,7 +213,7 @@ let return = 5; // "return"을 변수명으로 사용할 수 없으므로 에러
 ```js run no-strict
 // 참고: 이 예제에는 "use strict"가 없습니다.
 
-num = 5; // 변수 "num"이 정의되어있지 않더라도, 단순 할당만으로 변수가 생성됩니다.
+num = 5; // 변수 'num'이 정의되어있지 않더라도, 단순 할당만으로 변수가 생성됩니다.
 
 alert(num); // 5
 ```
@@ -237,7 +237,7 @@ num = 5; // error: num is not defined
 const myBirthday = '18.04.1982';
 ```
 
-이렇게 `const`로 선언한 변수를 "상수(constant)"라고 부릅니다. 상수는 재할당할 수 없으므로 상수를 변경하려고 하면 에러가 발생합니다.
+이렇게 `const`로 선언한 변수를 '상수(constant)'라고 부릅니다. 상수는 재할당할 수 없으므로 상수를 변경하려고 하면 에러가 발생합니다.
 
 ```js run
 const myBirthday = '18.04.1982';
@@ -275,7 +275,7 @@ alert(color); // #FF7F00
 
 그렇다면 언제 일반적인 방식으로 상수를 명명하고, 언제 대문자를 사용해서 명명해야 하는 걸까요? 명확히 짚고 넘어갑시다.
 
-"상수"는 변수의 값이 절대 변하지 않음을 의미합니다. 그중에는 (빨간색을 나타내는 16진수 값처럼) 코드가 실행되기 전에 이미 그 값을 알고 있는 상수도 있고, 런타임 과정에서 *계산되지만* 최초 할당 이후 값이 변하지 않는 상수도 있습니다.
+'상수'는 변수의 값이 절대 변하지 않음을 의미합니다. 그중에는 (빨간색을 나타내는 16진수 값처럼) 코드가 실행되기 전에 이미 그 값을 알고 있는 상수도 있고, 런타임 과정에서 *계산되지만* 최초 할당 이후 값이 변하지 않는 상수도 있습니다.
 
 예시:
 ```js
@@ -284,7 +284,7 @@ const pageLoadTime = /* 웹페이지를 로드하는데 걸린 시간 */;
 
 `pageLoadTime`의 값은 페이지가 로드되기 전에는 정해지지 않기 때문에 일반적인 방식으로 변수명을 지었습니다. 하지만 이 값은 최초 할당 이후에 변경되지 않으므로 여전히 상수입니다.
 
-정리하자면, 대문자 상수는 "하드 코딩한" 값의 별칭을 만들 때 사용하면 됩니다.
+정리하자면, 대문자 상수는 '하드 코딩한' 값의 별칭을 만들 때 사용하면 됩니다.
 
 ## 바람직한 변수명
 
@@ -303,7 +303,7 @@ const pageLoadTime = /* 웹페이지를 로드하는데 걸린 시간 */;
 - `userName` 이나 `shoppingCart`처럼 사람이 읽을 수 있는 이름을 사용하세요.
 - 무엇을 하고 있는지 명확히 알고 있지 않을 경우 외에는 줄임말이나 `a`, `b`, `c`와 같은 짧은 이름은 피하세요.
 - 최대한 서술적이고 간결하게 명명해 주세요. `data`와 `value`는 나쁜 이름의 예시입니다. 이런 이름은 아무것도 설명해주지 않습니다. 코드 문맥상 변수가 가리키는 데이터나 값이 아주 명확할 때에만 이런 이름을 사용합시다.
-- 자신만의 규칙이나 소속된 팀의 규칙을 따르세요. 만약 사이트 방문객을 "user"라고 부르기로 했다면, 이와 관련된 변수를 `currentVisitor`나 `newManInTown`이 아닌 `currentUser`나 `newUser`라는 이름으로 지어야 합니다.
+- 자신만의 규칙이나 소속된 팀의 규칙을 따르세요. 만약 사이트 방문객을 'user'라고 부르기로 했다면, 이와 관련된 변수를 `currentVisitor`나 `newManInTown`이 아닌 `currentUser`나 `newUser`라는 이름으로 지어야 합니다.
 
 간단해 보이나요? 그렇게 보이긴 합니다. 그러나 실전에서 서술적이고 간결한 변수명을 짓는 것은 간단하지 않습니다. 그럼, 화이팅!