Sep 29, 2019 · Sep 28, 2019 · Sep 26, 2019 · Sep 26, 2019 · Sep 26, 2019 · Sep 26, 2019
diff --git a/1-js/02-first-steps/04-variables/article.md b/1-js/02-first-steps/04-variables/article.md

 자바스크립트에선 `let` 키워드를 사용해 변수를 생성합니다.

 아래 문(statement)은 "message"라는 이름을 가진 변수를 생성(*선언(declare)* 또는 *정의(define)*)합니다.
 아래 문(statement)은 "message"라는 이름을 가진 변수를 생성(*선언*)합니다.

 ```js
 let message;
 let user = 'John', age = 25, message = 'Hello';
 ```

 이렇게 작성하면 코드가 좀 더 짧아 보이긴 하지만 권장하는 방법은 아닙니다. 가독성을 위해 한변수는 한 줄에 작성해주세요.
 이렇게 작성하면 코드가 좀 더 짧아 보이긴 하지만 권장하는 방법은 아닙니다. 가독성을 위해 한줄에는 하나의 변수를 작성해주세요.

 변수 하나당 줄 하나를 사용하면 코드가 길어 보이지만 읽기엔 편합니다.
 한 줄에 한 개의 변수를 작성하면 코드가 길어 보이지만 읽기엔 편합니다.

 ```js
 let user = 'John';
  , message = 'Hello';
 ```

 위에서 소개한 방식들에 기술적인 차이가 있지는 않습니다.개인 취향과 미적 감각에 따라 원하는 방식으로 코드를작성하시길 바랍니다.
 위에서 소개한 방식들에 기술적인 차이가 있지는 않습니다.개인의 취향과 미적 감각에 따라 원하는 방식으로 코드를작성하세요.


 ````smart header="`let` 대신 `var`"

 "상자" 안에 데이터를 저장하는데, 이 상자에는 특별한 이름표가 붙어 있다고 상상해 봅시다. 이렇게 하면 "변수"를 좀 더 쉽게 이해할 수 있습니다.

 예를 들어, 변수 `message`는 `"message"`라는 이름표가 붙어있는 상자에 `"Hello!"`라는값 저장한 것이라고 생각할 수 있습니다.
 예를 들어, 변수 `message`는 `"message"`라는 이름표가 붙어있는 상자에 `"Hello!"`라는값을 저장한 것이라고 생각할 수 있습니다.

 ![](variable.svg)

 ```smart header="함수형 언어"
 [함수형(functional)](https://en.wikipedia.org/wiki/Functional_programming) 프로그래밍 언어는 변숫값 변경을 금지합니다. [스칼라(Scala)](http://www.scala-lang.org/)와 [얼랭(Erlang)](http://www.erlang.org/)은 대표적인 함수형 언어입니다.

 이들 언어에서는 "상자 속에"값을 일단저장면, 그 값을 영원히 유지합니다. 다른 값을 저장하고 싶다면 새로운 상자를 만들어야(새 변수를 선언해야)만 합니다. 이전 변수를 재사용할 수 없습니다.
 이들 언어에서는 "상자 속에"값이 일단저장되면, 그 값을 영원히 유지합니다. 다른 값을 저장하고 싶다면 새로운 상자를 만들어야(새 변수를 선언해야)만 합니다. 이전 변수를 재사용할 수 없습니다.

 처음 봤을 땐 좀 이상해 보일 수 있지만, 함수형 언어는 중대한 개발에 상당히 적합한 언어입니다. 이런 제약이 장점으로 작용하는 병렬 계산(parallel computation)과 같은 영역도 있죠. 당장은 사용할 계획이 없더라도 이런 언어를 공부하는 것은 시야를 넓히는 데 도움이 되므로, 학습을 권유 드립니다.
 ```
 let test123;
 ```

 여러 단어를 조합하여 변수명을 만들 땐 [카멜 케이스(camelCase)](https://en.wikipedia.org/wiki/CamelCase)가 흔히 사용됩니다. 카멜 케이스는 단어를 차례대로 나열하면서 첫 단어를제외하고 각 단어의 첫 글자를 대문자로 작성합니다. `myVeryLongName`같이 말이죠.
 여러 단어를 조합하여 변수명을 만들 땐 [카멜 케이스(camelCase)](https://en.wikipedia.org/wiki/CamelCase)가 흔히 사용됩니다. 카멜 케이스는 단어를 차례대로 나열하면서 첫 단어를제외한 각 단어의 첫 글자를 대문자로 작성합니다. `myVeryLongName`같이 말이죠.

 달러 기호 `'$'` 와언더스코어(underscore) `'_'` 를 변수명에 사용할 수 있다는 점이 조금 특이하네요. 이 특수 기호는 일반 글자처럼 특별한 의미를 지니진 않습니다.
 달러 기호 `'$'` 와밑줄 `'_'` 를 변수명에 사용할 수 있다는 점이 조금 특이하네요. 이 특수 기호는 일반 글자처럼 특별한 의미를 지니진 않습니다.

 아래는 유효한 변수명에 관한 예시입니다.

 let 我 = '...';
 ```

 위 코드에는 기술적인 에러가 없습니다. 변수명도 유효합니다. 하지만 영어를 변수명에 사용하는 것이국제적 관습이므로, 변수명은 영어를 사용해서 만들길 권유 드립니다. 다른 나라 사람이우리가 작성한스크립트를볼지도 모르는경우 등을 대비해 장기적인 안목을 가지고코를 작성합시다.
 위 코드에는 기술적인 에러가 없습니다. 변수명도 유효합니다. 하지만 영어를 변수명에 사용하는 것이국제적인 관습이므로, 변수명은 영어를 사용해서 만들길 권유 드립니다. 다른 나라 사람이 스크립트를볼경우 등을 대비해 장기적인 안목을 가지고코드를 작성합시다.
 ````

 ````warn header="예약어"

 ````warn header="`use strict` 없이 할당하기"

 변수는대게 정의되어 있어야 사용할 수 있습니다. 그러나 예전에는 `let` 없이도 단순하게 값을 할당해 변수를 생성하는 것이 가능했습니다. `use strict`를 쓰지 않으면 과거 스크립트와의호환성 유지 때문에 여전히 이 방식을 사용할 수 있습니다.
 변수는대개 정의되어 있어야 사용할 수 있습니다. 그러나 예전에는 `let` 없이도 단순하게 값을 할당해 변수를 생성하는 것이 가능했습니다. `use strict`를 쓰지 않으면 과거 스크립트와의호환성을 유지할 수 있기 때문에 여전히 이 방식을 사용할 수 있습니다.

 ```js run no-strict
 //주의: 이 예제에는 "use strict"가 없습니다.
 //참고: 이 예제에는 "use strict"가 없습니다.

 num = 5; // 변수 "num"이 정의되어있지 않더라도, 단순 할당만으로 변수가 생성됩니다.

 alert(num); // 5
 ```

 이렇게 변수를지정하는 것은 나쁜 관습입니다. 엄격 모드에서 에러를 발생시키기 때문이죠.
 이렇게 변수를생성하는 것은 나쁜 관습입니다. 엄격 모드에서 에러를 발생시키기 때문이죠.

 ```js
 "use strict";
 ```js run
 const myBirthday = '18.04.1982';

 myBirthday = '01.01.2001'; //Error: Assignment to constant variable.
 myBirthday = '01.01.2001'; //error, can't reassign the constant!
 ```

 변숫값이 절대 변경되지 않을 것이라 확신하면,이를 보장하고,다른 개발자들에게 이 변수는상수라는것을 전달하기 위해 `const`를 사용해 변수를 선언하도록 합시다.
 변숫값이 절대 변경되지 않을 것이라 확신하면,값이 변경되는 것을 방지하면서다른 개발자들에게 이 변수는상수라는 것을 알리기 위해 `const`를 사용해 변수를 선언하도록 합시다.


 ### 대문자 상수

 기억하기 힘든 값을 변수에 할당해 별칭으로 사용하는 것은 널리 사용되는 관습입니다.

 이런 상수는 대문자와밑줄(underscore)로 구성된 이름으로 명명합니다.
 이런 상수는 대문자와밑줄로 구성된 이름으로 명명합니다.

 예시로 웹에서 사용하는 색상 표기법인 16진수 컬러 코드에 대한 상수를 한번 만들어보겠습니다.

 const pageLoadTime = /* 웹페이지를 로드하는데 걸린 시간 */;
 ```

 `pageLoadTime` 값은 페이지가 로드되기 전에는 정해지지 않기 때문에 일반적인 방식으로 변수명을 지었습니다. 하지만 이 값은 최초 할당 이후에 변경되지 않으므로 여전히 상수입니다.
 `pageLoadTime`의 값은 페이지가 로드되기 전에는 정해지지 않기 때문에 일반적인 방식으로 변수명을 지었습니다. 하지만 이 값은 최초 할당 이후에 변경되지 않으므로 여전히 상수입니다.

 정리하자면, 대문자 상수는 "하드 코딩한(hard-coded)" 값의 별칭을 만들 때 사용하면 됩니다.
 정리하자면, 대문자 상수는 "하드 코딩한" 값의 별칭을 만들 때 사용하면 됩니다.

 ## 바람직한 변수명


 변수의 이름을 짓는 것은 프로그래밍에서 가장 중요하고 복잡한 기술 중 하나입니다. 변수명만 슬쩍 봐도 초보자가 코드를 작성했는지, 노련한 개발자가 작성했는지 알 수 있습니다.

 실제 프로젝트에선 맨 처음부터 완전히 독립적인 코드를 작성하기보다 기존 코드의 틀을 변경하고 확장하는데대부분 시간을 보냅니다. 작성했던 코드를 얼마 후에 다시 봤을 때, 정보에 알맞은 이름이 적혀있으면 정보를 더 쉽게 찾을 수 있습니다. 다시 말해, 변수가 올바른 이름을 가졌을 때 말이죠.
 실제 프로젝트에선 맨 처음부터 완전히 독립적인 코드를 작성하기보다 기존 코드의 틀을 변경하고 확장하는데대부분의 시간을 보냅니다. 작성했던 코드를 얼마 후에 다시 봤을 때, 정보에 알맞은 이름이 적혀있으면 정보를 더 쉽게 찾을 수 있습니다. 다시 말해, 변수가 올바른 이름을 가졌을 때 말이죠.

 그러므로 변수를 선언하기 전에 내가 지은 변수의 이름이 괜찮은지 숙고해 주시기 바랍니다.

 아래는 변수 명명 시 참고하기 좋은 규칙입니다.

 - `userName` 이나 `shoppingCart`처럼 사람이 읽을 수 있는 이름을 사용하세요.
 - 무엇을 하고 있는지 명확히 알고 있지 않을 경우 외에는, 줄임말이나 `a`, `b`, `c`와같 짧은 이름은 피하세요.
 - 최대한 서술적이고 간결하게 명명해 주세요. `data`와 `value`는 나쁜 이름의예입니다. 이런 이름은 아무것도 설명해주지 않습니다. 코드 문맥상 변수가 가리키는 데이터나 값이 아주 명확할 때에만 이런 이름을사용하도록 합시다.
 - 무엇을 하고 있는지 명확히 알고 있지 않을 경우 외에는 줄임말이나 `a`, `b`, `c`와같은 짧은 이름은 피하세요.
 - 최대한 서술적이고 간결하게 명명해 주세요. `data`와 `value`는 나쁜 이름의예시입니다. 이런 이름은 아무것도 설명해주지 않습니다. 코드 문맥상 변수가 가리키는 데이터나 값이 아주 명확할 때에만 이런 이름을사용합시다.
 - 자신만의 규칙이나 소속된 팀의 규칙을 따르세요. 만약 사이트 방문객을 "user"라고 부르기로 했다면, 이와 관련된 변수를 `currentVisitor`나 `newManInTown`이 아닌 `currentUser`나 `newUser`라는 이름으로 지어야 합니다.

 간단해 보이나요? 그렇게 보이긴 합니다. 그러나 실전에서 서술적이고 간결한 변수명을 짓는 것은 간단하지 않습니다. 그럼, 화이팅!

 ```smart header="재사용 아니면 새로 만들기?"
 개발자 중에는 새로운 변수를 선언하기보다 기존 변수를재활용 하는 걸 선호하는(게으른) 분들이 있습니다.
 개발자 중에는 새로운 변수를 선언하기보다 기존 변수를재사용 하는 걸 선호하는 게으른 분들이 있습니다.

 재사용된 변수는 과거에 붙여진 스티커를 떼지 않은 채 물건만 바뀐 상자와 같습니다. 상자 안에는 무엇이 들어 있을까요? 내용물에 대한 정보를 알고 있는 사람은 누구인가요? 이를 알기 위해선 상자에 가까이 다가가 확인해야만 합니다.


 ## 요약

 `var`, `let`, `const`를사용하면 변수를 선언할 수 있습니다. 선언된 변수엔 데이터를 저장할 수 있죠.
 `var`, `let`, `const`를사용해 변수를 선언할 수 있습니다. 선언된 변수엔 데이터를 저장할 수 있죠.

 - `let` -- 모던한 변수 선언 키워드입니다.
 - `var` -- 오래된 변수 선언 키워드입니다. 잘 사용하지 않습니다. `let`과의 미묘한 차이점은 <info:var> 챕터에서 다루도록 하겠습니다.