자료형
자바스크립트에서 값은 항상 문자열이나 숫자형 같은 특정한 자료형에 속합니다. 자바스크립트에는 8가지의 기본 자료형이 있습니다.
자바스크립트의 변수는 자료형에 관계없이 모든 데이터일 수 있습니다. 따라서 변수는 어떤 순간에 문자열일 수 있고 다른 순간엔 숫자가 될 수 있습니다.
let message = 'hello';
message = 123456;
1. 숫자형
숫자형은 정수 및 소수점 숫자를 나타냅니다.
let num = 123;
num = 12.34;
숫자형을 이용해서 곱셈 * , 나눗셈 / , 덧셈 + , 뺄셈 - 등으로 연산도 가능합니다. 이외에도 Infinity(무한대), -Infinity, NaN 같은 '특수 숫자값'이 숫자형에 포함됩니다.
NaN의 경우 계산 중 에러가 발생했다는 것을 나타내는 값입니다.
alert("문자" / 2); // NaN, 문자열을 숫자열로 나눌 수 없습니다.
2. BigInt
자바스크립트에선 (2^53-1)(9007199254740991)보다 크거나 -(2^53-1)보다 작은 정수는 '숫자형'을 사용해 나타낼 수 없습니다. 보통은 사용될 일이 없겠지만 이런 큰 수가 필요한 작업이 존재합니다. 그래서 BigInt형을 표준으로 채택하였습니다.
BigInt형은 정수 리터럴 끝에 n을 붙이면 만들 수 있습니다.
// 끝에 'n'이 붙으면 BigInt형 자료입니다.
const bigInt = 1234567890123456789012345678901234567890n;
3. 문자형
자바스크립트에선 문자열을 따옴표로 묶습니다.
let string = 'hello'
let string2 = 'world'
let string3 = `${string} ${string2}, nice to meet you!`
따옴표에는 세가지 종류가 있습니다.
- 큰따옴표: "Hello"
- 작은따옴표: 'Hello'
- 백틱: `Hello`
자바스크립트에서는 큰따옴표와 작은따옴표에 차이를 두지 않습니다.
백틱은 변수나 표현식을 감싼 후에 ${....} 안에 넣어주면, 다음과 같이 원하는 변수나 표현식을 문자열 중간에 넣을 수 있습니다.
let name = 'John'
// 변수를 문자열 중간에 삽입
alert(`hello ${name}`); // Hello, John!
// 표현식을 문자열 중간에 삽입
alert(`the result is ${1+2}`); // the result is 3
위의 예시와 같이 ${.....} 안에는 name과 같은 변수나 1 + 2 같은 수학 관련 표현식도 넣을 수 있습니다. 물론 더 복잡한 표현식도 가능하다. 이렇게 문자열 중간에 들어간 변수나 표현식은 출력했을 때 문자열의 일부가 됩니다.
큰따옴표나 작은따옴표를 사용하면 백틱과 같은 효과를 낼 수 없다는 것을 주의해야 합니다.
4. 불리언(boolean)형
불리언형(논리 타입)은 true와 false 두 가지 값 밖에 없는 자료형입니다. 불리언형은 긍정이나 부정을 나타내는 값을 저장할 때 사용합니다. true는 긍정, false는 부정을 의미합니다.
let checkTrue = true;
let checkFalse = false;
불린값은 비교 결과를 저장할 때도 사용합니다.
let check_Bigger = 4 > 1;
alert(check_Bigger) // true
5. 객체와 심볼
객체(object)형은 특수한 자료형입니다.
객체형을 제외한 다른 자료형은 문자든 숫자든 한 가지만 표현할 수 있기 때문에 원시 자료형이라고 부릅니다. 그러나 객체는 데이터 컬렉션이나 복잡한 개체를 표현할 수 있습니다.
이런 특징 때문에 자바스크립트에서 객체는 특별한 취급을 받습니다. 자세한 내용은 원시형을 배운 후 객체에서 다루도록 하겠습니다.
심볼(symbol)형은 객체의 고유한 식별자를 만들 때 사용됩니다. 심볼형은 객체를 배운 후 알아보도록 하겠습니다.
6. typeof 연산자
typeof 연산자는 인수의 자료형을 반환합니다. 자료형에 따라 처리 방식을 다르게 하고 싶거나 변수의 자료형을 빠르게 알아내고자 할 때 유용합니다.
typeof 연산자는 두 가지 형태의 문법을 지원합니다.
1. 연산자: typeof x
2. 함수: typeof(x)
괄호가 있든 없든 결과는 동일합니다.
typeof x 를 호출하면 인수의 자료형을 나타내는 문자열을 반환합니다.
typeof undefined // "undefined"
typeof 0 // "number"
typeof 10n // "bigint"
typeof true // "boolean"
typeof "foo" // "string"
typeof Symbol("id") // "symbol"
typeof Math // "object" (1)
typeof null // "object" (2)
typeof alert // "function" (3)
(1)에서 object가 출력된 이유는 Math가 수학 연산을 제공하는 내장 객체이기 때문이다.
(2)에서 object가 출력된 이유는 null이 별도의 고유한 자료형을 가지는 특수 값으로 객체가 아니지만, 하위 호환성을 위해 이런 오류를 수정하지 않고 남겨놓았기 때문입니다.
(3) typeof는 피연산자가 함수이면 function을 반환합니다. 그러나 '함수형'이라는 것이 존재하지 않습니다. 이렇게 출력되는 이유는 하위 호환성 유지를 위해 남겨두었기 때문입니다.
7. null 값
null 값은 어느 자료형에도 속하지 않는 값으로 null 값은 오로지 null 값만 포함하는 별도의 자료형을 만듭니다.
let age = null;
자바스크립트의 null은 '존재하지 않는 값', '비어 있는 값', 알 수 없는 값'을 나타내는 데 사용합니다. 예시의 코드는 나이를 알 수 없거나 그 값이 비어있음을 보여줍니다.
8. undefined 값
undefined 값도 null 값처럼 자신만의 자료형을 형성합니다. undefined는 '값이 할당되지 않은 상태'를 나타낼 때 사용합니다. 변수를 선언했으나 값이 할당되지 않았다면 undefined가 자동으로 할당된다.
let name;
alert(name); // undefined 출력
만약 변수를 빈 상태로 나타내려면 undefined보단 null을 사용해야 합니다.
* 요약 *
자바스크립트에는 8가지 기본 자료형이 있습니다.
- 숫자형 : 정수, 소수 등의 숫자를 나타날 때 사용합니다.
- bigint : 길이 제약 없이 정수를 나타낼 수 있습니다.
- 문자형 : 빈 문자열이나 글자들로 이뤄진 문자열을 나타낼 때 사용합니다. 단일 문자를 나타내는 별도의 자료형은 없습니다.
- 불린형 : ture, false를 나타낼 때 사용합니다.
- null : null 만을 위한 독립 자료형으로 알 수 없는 값을 나타냅니다.
- undefined : undefined만을 위한 독립 자료형으로 할당되지 않은 값을 나타냅니다.
- 객체형 - 복잡한 데이터 구조를 표현할 때 사용합니다.
- 심볼형 - 객체의 고유 식별자를 만들 때 사용합니다.
typeof 연산자는 피연산자의 자료형을 알려줍니다.
- typeof x 또는 typeof(x) 형태로 사용합니다.
- 피연산자의 자료형을 문자열 형태로 반환합니다.
- null의 typeof 연산은 "object"인데, 이는 언어상 오류입니다. null은 객체가 아닙니다.
'Study > JavaScript' 카테고리의 다른 글
JavaScript [형 변환] (0) | 2021.08.11 |
---|---|
JavaScript [alert, prompt, confirm] (0) | 2021.08.10 |
JavaScript [변수와 상수] (0) | 2021.08.09 |
JavaScript [코드구조, 엄격모드] (0) | 2021.08.06 |
JavaScript [script 태그] (0) | 2021.08.05 |