# 기본 문법과 자료형

## 기본 구문

자바스크립트의 구문은 자바, C, C++ 등과 매우 비슷합니다.

```javascript
let a = "Hello";
let 안녕 = "안녕";
```

자바스크립트는 대소문자를 구분합니다. 또한, 유니코드를 사용하므로 변수 이름에 한글을 사용해도 됩니다.

자바와 마찬가지로, 하나의 명령문이 끝나면 세미콜론을 붙입니다. 하지만, 줄 바꿈이 있는 때에는 세미콜론을 생략해도 됩니다.

C 스타일의 한줄 주석과, C++ 스타일의 블록 주석 모두 사용할 수 있습니다.

## 변수의 선언

- var

  변수를 선언합니다. 선언과 동시에 값을 할당할 수도 있습니다. 하위호환성 문제가 없다면 `let`과 `const`를 사용하세요.

- let

  변수를 선언합니다. `var`의 단점을 보완하고자, ECMAScript 2015에서 추가되었습니다.

- const

  상수를 선언합니다. ECMAScript 2015에서 추가되었습니다.

  상수의 값은 변경할 수 없지만, 상수로 선언된 객체의 멤버나 상수로 정의된 배열의 항목은 변경할 수 있습니다.


선언만하고 초기화되지 않은 변수는 ```undefined```라는 값을 갖습니다.

```javascript
let a;
console.log("a = " + a); // a = undefined

const PI = 3.141592;
```

### var와 let

#### 변수의 범위

`var`로 선언된 변수는 블록 범위라는 개념이 없습니다.

```javascript
if (true) {
    var a = "Hello";
}
console.log(a); // Hello
```

`let`으로 선언된 변수는 블록 범위 내에서만 유효합니다.

```javascript
if (true) {
    let a = "Hello";
}
console.log(a); // ReferenceError: a is not defined
```

#### 변수 호이스팅

`var`로 선언된 변수는 맨 위로 끌어 올려집니다.

```javascript
console.log(a === undefined); // 나중에 선언된 변수도 사용할 수 있다.
var a = 3;

/* 위 코드는 아래와 같이 작동합니다. */
var a;
console.log(a === undefined);
a = 3;
```

```javascript
console.log(a === undefined); // ReferenceError: Cannot access 'a' before initialization
let a = 3;
```

#### 함수 호이스팅

```javascript
fun1(); // 아직 정의되지 않은 함수도 맨 위로 끌어 올려집니다.

function fun1() {
    console.log("Function 1");
}

fun2(); // Error

var fun2 = function () { // 함수 표현식 형태로 정의된 경우에는 끌어 올려지지 않습니다.
    console.log("Function 2");
}
```

## 데이터 구조와 타입

- Boolean

  true 또는 false 중 하나입니다.

- Number

  정수형 또는 실수형 숫자입니다.

- String

  문자열입니다.

- Symbol

  인스턴스가 고유하고 불변인 데이터 형입니다. ECMAScript 2015에서 추가되었습니다.

- Object

  자바스크립트 객체입니다.

- undefined

  undefined는 수치 문맥에서는 NaN으로, boolean 문맥에서는 false로 동작합니다.

  ```javascript
  let a; // a = undefined
  if (a) {
      console.log("a = " + a); 
  } else {
      console.log("a is undefined.");
  }
  
  console.log(a + 34); // NaN
  ```

- null

  자바스크립트는 대소문자를 구분하므로 `null`은 Null, NULL 등과 다릅니다.

  `null`은 수치 문맥에서는 `0`으로, boolean 문맥에서는 `false`로 동작합니다.

  ```javascript
  let a = null;
  if (a) {
      console.log("a = " + a);
  } else {
      console.log("a is null.");
  }
  
  console.log(a + 34); // 34
  ```


### 동적 자료형

자바스크립트는 동적 타이핑 언어로써 변수에 자료형을 지정하지 않습니다.

```javascript
let a = 43;
a = "Hello"; // 숫자나 문자열이나 상관없이 어떤 값이라도 할당할 수 있습니다.
```

문자열과 숫자를 + 연산하면 숫자는 문자열로 변환됩니다. 그러나, - 연산의 경우에는 문자열형 숫자가 숫자로 변환됩니다.

```javascript
console.log("The number is " + 42); // The number is 42
console.log(42 + " is the number"); // 42 is the number
console.log("The number is " - 42); // NaN
```

```javascript
console.log("3" + 2); // 32
console.log(3 + "2"); // 32
console.log("3" + "2"); // 32
console.log("3" - 2); // 1
console.log(3 - "2"); // 1
console.log("3" - "2"); // 1
```

### 문자열형 숫자를 숫자로 변환

전역 함수 parseInt()와 parseFloat()를 사용해서 문자열형 숫자를 숫자로 바꿀 수 있습니다.

```javascript
parseInt(numStr, radix) // 진법도 지정해야 합니다. 
parseFloat(numStr)
```

```javascript
let a = "3.9";
console.log(parseInt(a, 10)); // 3
console.log(parseFloat(a)); // 3.9
```

## 리터럴

### 숫자

```javascript
43, -365 // 10진수
0xff0d, 0x1234 // 16진수. 0x로 시작한다.
0b0011, -0b11 // 2진수. 0b로 시작한다.
3.141592 // 실수
-.1234
-3.1E+12 // 실수의 지수 표현
.1e-23
```

### 문자열

문자열은 큰 따옴표("") 또는 작은 따옴표('')로 감싸서 표현합니다.

```javascript
let str = "Hello, World!";
```

#### 템플릿 리터럴

템플릿 리터럴은 ECMAScript 2015에서 추가되었습니다. 템플릿 문자열은 백틱(`)으로 감쌉니다. 템플릿 문자열에서는 줄 바꿈이 유지됩니다.

```javascript
let name = "Charlie";
let age = 14;
let template = `My name is ${name}. I'm ${age}-year-old.`;
console.log(template);
```

### 배열

배열은 대괄호를 사용해서 표현합니다.

```javascript
let array = ["a", "b", "c"];
```

배열 요소 가운데에 쉼표만 있으면 해당 요소는 undefined가 됩니다. 맨 끝의 쉼표는 무시됩니다만, 브라우저에 따라 다르게 구현되어 있습니다.

```javascript
let array = ["a", "b", , "c",];

for (const element of array) {
    console.log(element);
}
/*
    a
    b
    undefined
    c
*/
```

### 객체

객체는 중괄호를 사용해서 키/값 쌍을 표현합니다.

```javascript
let charlie = {
    age: 14,
    name:"Charlie"
};

console.log(charlie.age); // C의 구조체처럼 .으로 접근할 수도 있고,
console.log(charlie["age"]); // 배열처럼 []로 접근할 수도 있습니다.
```

### 정규식

정규식은 슬래시로 감싸서 표현합니다.

```javascript
let regex = /[a-z0-9]*/;
```