Data types (JavaScript)

출처 : https://javascript.info/types

Data types

 

데이터 타입 

자바스크립트에서 값은 항상 특정한 타입을 가짐. 예를 들어 문자열(string)이나 숫자 (number) 등이 있음.

자바스크립트에는 8가지 기본 데이터 타입이 있음. 

여기서는 이들에 대해 개괄적으로 설명하고 다음 챕터들에서 각각을 자세히 다룸. 

 

변수에는 어떤 타입의 값이든 저장할 수 있음. 

예를 들어 변수는 한 순간 문자열을 저장하다가 다음에는 숫자를 저장할 수 있음.

 

// 에러 없이 실행됨
let message = "hello";
message = 123456;

 

이와 같이 변수에 다른 타입의 값을 할당할 수 있는 프로그래밍 언어(예:자바스크립트)를 동적 타입 언어라고 부름. 

즉 , 데이터 타입은 존재하지만 변수는 특정 타입에 묶여 있진 않음.

 

Number

let n = 123;
n = 12.345;

 

숫자 타입은 정수와 부동 소수점 수를 모두 나타냄. 

곱셈 ( *) , 나눗셈 (/) , 덧셈 (+) , 뺄셈 ( - ) 등 다양한 연산을 지원함.

 

숫자에는 일반 숫자 외에도 특별한 숫자 값들이 포함됨. Infinity , -Infinity , NaN. 등등

 

Infinity

 

수학적 무한대를 나타내며 모든 숫자보다 큰 특별한 값임.

 

alert( 1 / 0 ); // Infinity
alert( Infinity ); // Infinity

 

NaN

 

계산 오류를 나타냄. 잘못되었거나 정의되지 않은 수학 연산의 결과로 발생함.

 

alert( "not a number" / 2 ); // NaN, 잘못된 나눗셈

 

NaN에 대해 추가 연산을 수행하면 항상 NaN이 반환됨.

 

alert( NaN + 1 ); // NaN
alert( 3 * NaN ); // NaN
alert( "not a number" / 2 - 1 ); // NaN

 

즉, 수식 어딘가에 NAN이 존재하게 되면 전체 결과에도 영향을 미치게 됨. (단, 예외로 NaN ** 0은 1임. ) 

 

수학 연산은 안전함. 

 

자바스크립트에서는 0으로 나누거나 숫자가 아닌 문자열을 숫자로 처리하는 등 어떤 연산을 하더라도 스크립트가 치명적인 오류로 중단되지 않음. 최악의 경우에 결과로 NAN이 반환됨.

 

특별한 숫자 값들은 공식적으로 number 타입에 속하지만 일반적인 의미의 숫자와는 다름. 

숫자와 관련된 내용은 이후 Numbers 챕터에서 더 알아봄.

 

BigInt

자바스크립트의 number 타입은 안전 정수 범위 (±(2^53 - 1), 즉 9007199254740991) 내의 정수만을 안전하게 표현할 수 있음.

 

정확히 말하면 number 타입은 더 큰 정수 (최대 1.7976931348623157 × 10^308까지)를 저장할 순 있지만 , 안전 범위를 벗어나면 정밀도 오류가 발생하여 근사값이 저장됨.

 

예를 들어 안전 범위를 약간 벗어난 두 계산 결과는 동일하게 나타남.

 

console.log(9007199254740991 + 1); // 9007199254740992
console.log(9007199254740991 + 2); // 9007199254740992

 

즉 (2^53 -1)보다 큰 모든 홀수 정수는 number 타입에 정확하게 저장할 수 없음. 

대부분의 경우 ±(2^53 - 1) 범위면 충분하지만 , 암호화나 마이크로초 정밀도의 타임스탬프처럼 정말 큰 정수가 필요한 경우가 있음.

 

이러한 문제를 해결하기 위해 BigInt 타입이 새로 추가되었음. 

BigInt 값은 정수 끝에 n을 붙여서 생성함. 

 

// 뒤에 붙은 "n"이 BigInt임을 의미합니다.
const bigInt = 1234567890123456789012345678901234567890n;

 

String

자바스크립트에서 문자열은 반드시 따옴표로 감싸야 함.

 

let str = "Hello";
let str2 = '싱글 따옴표도 가능합니다';
let phrase = `다른 문자열을 포함할 수 있습니다 ${str}`;

 

자바스크립트에는 3가지 종류의 따옴표가 있음.

 

더블 쿼트 : "Hello"

싱클 쿼트 : 'Hello'

백틱 : `Hello`

 

더블 쿼드와 싱글 쿼트는 단순 따옴표로 자바스크립트에서 실질적인 차이는 없음.

백틱은 확장 기능 따옴표임. 

백틱을 사용하면 ${...} 안에 변수나 표현식을 삽입할 수 있음.

 

예를 들어 :

 

let name = "John";

// 변수 삽입
alert( `안녕하세요, ${name}!` ); // 안녕하세요, John!

// 표현식 삽입
alert( `결과는 ${1 + 2}` ); // 결과는 3

 

${...} 내부의 표현식은 평가되어 결과가 문자열에 포함됨. 변수 , 산술 표현식 또는 복잡한 표현식 등 무엇이든 넣을 수 있음.

 

주의 : 이 기능은 백틱에서만 가능함.  다른 따옴표에서는 단순히 텍스트로 취급됨.

 

alert( "결과는 ${1 + 2}" ); // 결과는 ${1 + 2} (변수 삽입이 되지 않음)

 

문자열에 관한 자세한 내용은 Strings 챕터에서 다룸. 

 

자바스크립트에는 문자 (Character)타입이 따로 존재하지 않음.

 

C나 Java와 같이 단일 문자를 위한 char 타입은 없으며 , 모든 문자는 문자열(string) 로 취급됨.

문자열은 빈 문자열(문자 없음)일 수도, 한 글자 또는 여러 글자로 구성될 수 있음.

 

Boolean (논리형)

불린 타입은 오직 두 가지 값만 가짐. true와 false 

이 타입은 보통 예/아니오 값을 저장하는데 사용됨. 

예를 들어 true는 예 , 맞음을 , false는 아니오 , 틀림을 의미함.

 

let nameFieldChecked = true;  // 이름 필드가 체크됨
let ageFieldChecked = false;  // 나이 필드가 체크되지 않음

 

불린 값은 비교 연산의 결과로도 나타남.

 

let isGreater = 4 > 1;
alert( isGreater ); // true (비교 결과가 참)

 

불린에 대해서는 이후 Logical operators 챕터에서 더 자세히 다룰 것임. 

 

NULL 값

특별한 null 값은 위에서 설명한 다른 타입들에 속하지 않음.

null은 오직 하나의 값 , 즉 null만을 포함하는 독자적인 타입을 형성함.

 

let age = null;

 

자바스크립트에서 null은 다른 언어에서와 같이 "존재하지 않는 객체에 대한 참조 " 또는 "널 포인터"를 의미하지 않음.

그저 "없음" , "빈 값" , 혹은 "알 수 없음"을 나타내는 특별한 값임.

위 코드는 age가 알 수 없음을 의미함. 

 

Undefined 값

특별한 값 undefined도 독자적인 타입을 형성함. (null과 마찬가지로)

undefined의 의미는 "값이 할당되지 않음" 임. 

변수가 선언되었으나 값이 할당되지 않은 경우, 그 값은 undefined가 됨.

 

let age;
alert(age); // "undefined" 출력

 

기술적으로 변수에 명시적으로 undifined를 할당할 수도 있음.

 

let age = 100;

// 값을 undefined로 변경
age = undefined;
alert(age); // "undefined" 출력

 

하지만 일반적으로는 변수에 "빈 값"이나 "알수 없음"을 나타내기 위해 null을 사용하며 undifined는 할당되지 않은 상태의 기본값으로 남겨두는 것이 좋음.

 

객체(object)와 심볼(symbol)

객체 타입은 특별함. 

나머지 모든 타입은 단일 값을 갖는 원시(primitive)타입으로 분류되지만 , 객체는 데이터의 집합이나 보다 복잡한 엔티티를 저장하는데 사용됨.

이처럼 중요하기 때문에 , 객체는 특별한 취급을 받으며 , 원시 타입에 대해 더 익숙해진 후 Objects 챕터에서 다룰 것임. 

 

심볼(symbol) 타입은 객체에 대한 고유 식별자를 생성하는데 사용됨.

여기서 완전성을 위해 언급하지만 구체적인 내용은 객체를 배운 후에 다룸.

 

typeof 연산자

typeof 연산자는 피연산자의 타입을 문자열 형태로 반환함. 

이는 서로 다른 타입의 값을 다르게 처리하거나 빠르게 타입을 확인할 때 유용함. 

 

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)

 

추가 설명 : 

 

math는 수학 연산을 제공하는 내장 객체이며 , 이후 Numbers 챕터에서 배울 것임. 여기서는 객체의 에시로 사용됨. 

 

typeof null의 결과가 "object"인 것은 자바스크립트 초창기부터 존재한 공식적인 오류로 null은 실제로 객체가 아니라 고유한 타입의 값임.

 

typeof alert의 결과가 "function"인 이유는 , alert가 함수이기 때문임. 자바스크립트에는 특별한 "함수" 타입이 없으며 함수는 객체의 일종임. 

다만 typeof는 편의를 위해 함수를 "function" 으로 구분함. 

(기술적으로는 올바르지 않지만 실용적임)

 

 

typeof(x) 문법

typeof(x)와 같이 괄호를 사용한 형태도 볼 수 있음 이는 typeof x와 동일함. 

명확히 하자면 typeof는 연산자이지 함수가 아님. 여기서 사용된 괄호는 단순히 수학적 그룹화를 위한 것으로 typeof의 일부가 아님. 

보통 괄호 안에는 (2+2)와 같은 수학 표현식이 들어가지만 여기서는 단일 인수(x)만 포함함. 

이렇게 하면 typeof 연산자와 인수 사이의 공백을 피할 수 있어 일부 사람들이 선호함. 

일부는 typeof(x)를 선호하지만 , 일반적으로는 typeof x 형태가 더 널리 사용됨.

 

문제 

문자열 따옴표 

 

다음 스크립트의 출력 결과는 ?

 

let name = "Ilya";

alert( `hello ${1}` );    // ?
alert( `hello ${"name"}` ); // ?
alert( `hello ${name}` );   // ?

 

 

1은 그대로 hello 1

두번째는 name 자체를 문자열로 받고 있으니 그대로 hello name

세번째는 변수로써 사용하고 있어 hello Ilya