회사를 다니면 시험은 안보니까 좋다.
그러나, 시험을 봐도 좋으니까 방학을 되돌려줬으면 좋겠다 ㅜ

회사에서 하라는 알고리즘 공부는 안하고 JS 공부나 하련다!!

1. 값

값은 식(표현식)이 평가(또는 계산)되어 생성된 결과를 말한다

10 + 20 //30

위의 예제에서, 다음의 10+20 식이 평가(계산)되어 30이라는 결과가 만들어진다.
이러한 값은 메모리에 2진수로 저장되는 것이다.

2. 리터럴

var result = 10 + 20;

이 있다고 하자,
10 + 20이라는 표현식에서 우리는 30이라는 값을 얻어올 수 있다.
30이라는 값은 메모리에 2진수로 저장되고, result라는 변수로서 식별하는 것이다.

그런데, 10과 20은 컴퓨터가 어떻게 알아들을까??

이것은 '리터럴'이라고하여 사람이 이해할 수 있는 문자(아라비아 숫자, 알파벳, 한글 등) 또는 미리 약속된 기호("", [], {} ,// 등)로 표기한 코드이다. 이들은 런타임에 자바스크립트 엔진이 evaluation(평가)하여 값을 생성한다. 즉, 리터럴은 값을 생성하기 위해 미리 약속한 표기법이라고 할 수 있는 것이다.

리터럴의 종류

자바스크립트 엔진에 의해 리터럴이 계산(evaluation -평가) 되면 메모리에 값이 할당된다. 따라서 리터럴도 메모리를 잡아먹는다는 것을 알아두면 된다.

3. 표현식(expression)

표현식은 값을 참조하거나, 기존의 값을 불러오는 식 또는 새로운 값을 만드는 식을 말한다.

var result = 10 + 20;

에서 10과 20은 리터럴이고, 10 + 20은 표현식이다. 이들은 30이라는 새로운 값을 생성하고 이를 result라는 변수에 집어넣는다.

4. 문(statement)

표현식과 문을 구분하는 것은 매우 중요하다.
이는 자바스크립트 엔진 입장에서 코드를 읽을 수 있기 때문이다.

문(statement)는 프로그램을 구성하는 기본 단위이자 최소 실행 단위이다. 문의 집합으로 이루어진 것이 바로 프로그램이며, 문을 작성하고 순서에 맞게 나열하는 것이 프로그래밍이다.

문은 여러 토큰으로 구성된다. 토큰문법적인 의미를 가지며, 문법적으로 더 이상 나눌 수 없는 코드의 기본 요소를 말한다. 가령, 키워드, 식별자, 연산자, 리터럴, 세미콜론, 마침표 등 특수 기호는 문법적인 의미를 가지며 문법적으로 더 이상 나눌 수 없는 코드의 기본 요소이므로 토큰이다.

바로 다음과 같이 정리할 수 있다.
문이 있다면, 문은 다음과 같은 토큰들로 이루어진다.
var , sum , = , 1, +, 2, ; 모두 토큰이 되는 것이다.

문의 또 다른 이름은 명령문이다. 즉, 문은 컴퓨터에게 내리는 명령이다. 문이 실행되면 명령이 실행되고 무슨 일인가 일어난다.

문은 선언문, 할당문, 조건문, 반복문 등으로 구분할 수 있다.

1. 선언문 : 변수가 선언된다.
2. 할당문 : 값이 할당된다.
3. 조건문 : 지정한 조건에 따라 분기가 결정되어 코드 블럭이 실행된다.
4. 반복문 : 특정 조건에 따라 코드 블럭을 반복한다.

var x; // 변수 선언문

x = 5; // 할당문

function foo() {} // 함수 선언문

if(x>1) { console.log(x)} // 조건문

while( x > 1) { x = x -1;} //반복문 

5. 세미콜론과 자동 세미콜론 삽입 기능

세미콜론(;)은 문의 종료를 나타낸다. 따라서, 자바스크립트 엔진은 세미콜론이 있냐없냐에 따라서 문의 종료인지 아닌 지를 파악하는 것이다.

물론 코드블럭( = { } )에는 세미콜론을 붙이지 않아도 된다.

function foo(){
  var i = 1; // 세미콜론을 붙여주자
} //뒤에 세미콜론을 붙이지 않는다.

코드블럭들은 언제나 문의 종료를 의미하는 자체 종결성(self closing)을 갖기 때문이다.

물론 세미콜론을 안붙여도 된다. 이는 자바스크립트 엔진이 소스코드를 해석할 대 문의 끝이라고 추정되는 예측 지점에 자동으로 세미콜론을 붙여주기 때문이다.

이를 세미콜론 자동 삽입 기능(ASI : automatic semicolon insertion)이 수행되기 때문이다. 그러나, ASI 언제나 정상적으로 작동하는 것은 아니다. 따라서, 자신이 원하는 로직을 분명히 하고 싶다면 세미콜론을 붙이는 것이 좋다.

function foo() {
	return
  	{}
}
console.log(foo());

위의 예제에서 우리가 원하는 결과값은

{}

일 것이다. 그러나 실제 값은

undefined

가 나온다.
왜냐하면 ASI가 다음과 같이 처리하였기 때문이다.

function foo() {
	return; // return에서 문을 종료해버리니까 {} 가 반환되지 않는다.
  	{}
}
console.log(foo());

세미콜론을 붙인다해서 손해볼 것은 없으니 꼭꼭 붙여주도록 하자

6. 표현식인 문과 표현식이 아닌 문

문은 표현식일 수도 있고, 아닐 수도 있다.

1. 문이 표현식인 경우 : 기존 값을 불러오거나 값을 평가할 수 있다.
2. 문이 표현식이 아닌 경우 : 선언문과 같이 값이 평가될 수 없는 경우이다.

var x; //이는 표현식이 아닌 문이다.
x = 100; // 이는 표현식인 문이다.

즉, 정리하면 문이 표현식인 경우는 값이 있는 경우, 리터럴할 경우를 말한다.

이게 뭐가 중요한가 싶은데, 다음의 문법이 안되는 이유를 설명해보자고하자

var x = var y; // 불가

이를 1번이라고 하겠다.

그럼 다음의 문법이 왜 가능한지 설명해보자

var y;
var x = y = 100; // 가능

이를 2번이라고 하겠다.

1번은 불가능하고, 2번은 가능한 이유는 1번은 문에서 대입하려는 값이 표현식이 아니기 때문이다. 즉, 표현식은 값을 평가(evaluation)할 수 있어야하는데, 여기서는 값이 없기 때문에 표현식이 없다. 따라서 표현식이 아닌 문이 된다.

따라서, 1번의 대입문이 성립하지않은 것이다.

그러나 2번은 y = 100의 경우, 값이 evaluation이 가능하기 때문에 표현식인 문이 성립한다. 따라서, 값을 대입할 수 있는 것고, 이는 x까지 값을 넣을 수 있는 것이다. 왜냐하면 표현식인 문은 값이 있기 때문에 값처럼 사용할 수 있기 때문이다.