2025-01-24T02:27:50
This commit is contained in:
274
doc/topics/Datatype.md
Normal file
274
doc/topics/Datatype.md
Normal file
@@ -0,0 +1,274 @@
|
||||
# 기본 문법과 자료형
|
||||
|
||||
## 기본 구문
|
||||
|
||||
자바스크립트의 구문은 자바, 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]*/;
|
||||
```
|
||||
Reference in New Issue
Block a user