[JS] 1. 기본 문법과 변수, 상수

Why Js?

프로그래밍 언어를 배우다보면 결국 언어는 별게 아니라는 생각을 하게 된다. 중요한 것은 구조이고 언어는 수단일 뿐이다. 하지만 우리는 그 언어의 특성을 알때 언어의 장점을 극대화 하여 어떤 프로그램의 성능을 높일 수 있다. 언어를 잘 알아야 프로젝트에서 언어를 선택할때 어떤 언어를 사용할지에 대한 정확한 근거가 생긴다. 프론트앤드와 백앤드 심지어 데이터베이스까지 모든 분야에서 사용가능하다는 점에서 나는 javascript에 큰 매력을 느꼈고, 자세히 공부해 보려한다. Js는 풀스택이 되는 가장 빠른 선택일 것이다. Js를 배우고 프론트앤드, 백앤드, 데이터베이스의 전체 로직과 구조를 훑고 세부분야를 선택해 공부하며 필요에 따라 다른 언어와 프레임 워크를 공부할 계획이다. 이 모든 게획은 Js위에 있다. 그러니 Js를 깊게 파보자.

 

 

 

 

 

---

가장 기본.

모든 언어를 공부할때 가장 기본이 되는 문법을 찾아보게 된다. 세미콜론을 쓰는지 제곱이 ^인지 **인지 첫번째 인덱스가 0인지 1인지 이런 사소한것 말이다. 거기서부터 시작 할것이다. 

 

1. js는 세미콜론을 쓴다.

안써도 자동으로 세미콜론을 붙여주지만 오류가 발생하는 경우도 많으므로 확실하게 쓰자.

alert("에러가 발생합니다.")
[1, 2].forEach(alert)

다음은 에러 예제다. 그냥 세미콜론 쓰자. 

 

2. 주석 ( // , /**/ )

js는 // 와 /**/으로 주석처리가 가능하다. 

// 한줄 주석
/* 여러줄
주석은
이렇게 */

단축키는 

Win: ctrl + /, ctrl + shift + /

Mac: cmd + /, cmd + option + /

 

3. Strict Mode(엄격모드)

'use strict'
"use strict"

Js는 언어가 발전하면서도 기존의 낡은 부분을 배제 할 수 없다. 최신 기술이 나와 예전 기술을 더이상 쓸 일이 없더라도 예전 기술에 대한 지원을 끊을 수 없다. 만약 예전 기술을 더이상 지원하지 않는 다면 그 기술이 사용된 웹 페이지는 오류가 생길 것이다. 이미 사용중인 웹 페이지들을 보호하기 위해 Js는 신기술이 추가되는 형식으로 발전한다. 따라서 Js의 변경사항을 반영하여 최신 Js를 사용하기 위해서는 Js 스크립트 최상단에 'use strict'를 적어 엄격모드를 활성화 하는것이 좋다. 

코드에 클래스혹은 모듈이 사용된다면 'use strict'를 쓰지 않아도 엄격모드가 활성화 된다.

 

 

---

변수와 상수

상수와 변수가 선언될 때는 3개의 단계를 거치게 된다. 이 과정을 기억하고 변수와 상수 키워드에 대해 알아보자.

1. 선언
2. 초기화
3. 할당

 

1. 변수 (var, let)

Js의 변수선언 키워드는 두개가 있다. var와 let이다. 결론부터말 하면 var는 쓰지말고 let만 쓰면된다. 하지만 역사를 잊은 민족에게 미래가 없든 왜 var대신 let을 쓰는지 알기 위해서는 var에대해 알아야 한다. 둘의 차이점 알아본 후 왜 let만 써야 하는지 알아보자. 

 

(1) var는 한번 선언한 변수를 다시 선언 할 수 있다.

var name = 'cloer';
var name = 'my name';

위 코드에서 에러가 생기지 않는다.( 'use strict'를 써도 에러가 없다. ) 하지만 let은 에러가 발생한다.

let name = "cloer";
let name = "my name";

 

(2) var는 선언하기 전에 사용할 수 있다.

예전에 Js가 그것도 언어냐고 무시받는 이유중 하나였다. 충격적이게도 선언 전에 사용이 가능하다. 

console.log(name);
var name = "cloer";

위 코드에서 에러가 발생하지 않고 undefined가 출력된다. conole.log()는 다른 언어의 print함수와 같은 시능이고 undefined는 추후에 자료형에서 설명할 것이니 오류가 발생하지 않는다는 점에 초점을 맞추도록 하자. 오류가 발생하지 않는 이유는 호이스팅(hoisting)때문이다. let은 역시 오류가 발생한다. 그렇다면 let은 호이스팅 되지 않는 것일까? 그건 아니다. let도 호이스팅된다. 이부분은 호이스팅에 대해 따로 글로 정리하겠다. let은 오류를 일으키는 이유는 TDZ때문이다. 호이스팅과 TDZ에 관해서는 이 글에서 자세히 다룬다.

var는 선언과 초기화가 동시에 일어난다. 따라서 선언과 초기화가 호이스팅되어 undefined가 출력된 것이다. let은 선언과 초기화 단계가 분리되어있다. 따라서 let의 선언은 호이스팅되지만 초기화가 안됐기때문에 레퍼런스 에러가 발생한다.

 

(3) var는 함수 스코프, let,const는 블록 스코프이다.

var는 함수 스코프(function-scoped), let과 const는 블록 스코프(block-scoped)이다. 블록스코프는 코드블록안에서 선언된 변수는 지역변수로 외부에서는 접근할 수 없다. 함수스코프는 함수 내부에서 선언된 변수만 지역변수가 된다. 그렇다면 함수 스코프와 블록 스코프의 차이는 뭘까?

함수 스코프는 말 그대로 함수 호출시 생성되는 스코프을 의미하고 블록 스코프는 함수, if문, for문, try-catch문등을 모두 말한다. 즉 if문 안에서 선언한 var변수를 if문 밖에서 사용이 가능하다.

 

2. 상수 (const)

상수는 const키워드를 사용한다. const로 선언된 상수는 후에 재할당 될 수 없다. 팁이 있다면 모든 변수를 const로 선언하고 변경이 필요할때 let으로 바꿔주는것이 버그를 방지하기 좋다. 

const는 선언, 초기화, 할당이 동시에 일어난다. 

 

3. 변수명명 규칙

변수와 상수 선언 키워드를 알았으니 변수를 선언 해야한다. 이것도 언어마다 다르기 때문에 확실히 하고 가자. 

1. 숫자, 문자, $, _ 만 변수명에 사용 가능하다.
2. 변수의 첫 글자에는 숫자가 올 수 없다.
3. 대소문자를 구분한다.
4. 영어말고도 사용가능하나 권장하지 않는다.
5. 예약어는 사용할 수 없다.

또 Js에서는 카멜 표기법(camelCase)가 주로 사용된다. 상수는 대문자로 쓰는것이 일반적이다. 

 

 

---

 

참조

https://ko.javascript.info/

https://www.youtube.com/watch?v=ocGc-AmWSnQ&list=PLZKTXPmaJk8JZ2NAC538UzhY_UNqMdZB4