[Javascript] 기본 자료형 종류 (Primitive Type)

2021. 9. 12. 01:04자바스크립트

[Javascript] 데이터 타입 (Data types) - Primitive / Object (tistory.com)

 

[Javascript] 데이터 타입 (Data types) - Primitive / Object

데이터타입은 크게 기본형타입(Primitive type)과 객체타입(Object type)으로 나눌 수 있다. Primitive type - Number, String, Boolean, null, undefined, Symbol 1. 기본형타입은 원시타입이라고도 하며, 변수에..

comymel.tistory.com

 

자바스크립트에서는 기본형(Primitive type)과 객체형(Object type)으로 나눌 수 있다고 했다.

기본형과 객체형 중 기본형의 종류에는 무엇이 있는지 알아보자.

 

 

Primitive type

 

 

1. 숫자(Number)

 

정수(integer), 소숫점의 숫자(decimal number) 등 상관없이 모두 숫자형이다.

 

ex)

const num1 = 5;
const num2 = 2.7;
const num3 = -18.2;

function check() {
    console.log(typeof(num1));
    console.log(typeof(num2));
    console.log(typeof(num3));
};
check(); // => num1,2,3 모두 number로 출력됨

 

* typeof( ) : 데이터 타입을 반환하는 연산자

 

 

 

2. 문자열(String)

 

말그대로 한글자든 여러 글자든 상관없이 모두 문자열이다.

 

<문자열과 변수를 연결해서 표현하는 방법>

- `string ${변수명}`;

- "string" + 변수명; (작은따옴표, 큰따옴표 모두 가능)

- 'string', 변수명;

 

ex)

const example = 'lalala';

console.log(`이것은 문자 ${example}`);
console.log('이것은 문자 ' + example);
console.log("이것은 문자", example);
// 모두 같은 결과가 나옴 => 이것은 문자 lalala

 

 

 

3. 불값(Boolean)

 

참(true), 거짓(false)로 나누어진다.

 

- true로 간주되는 값 : false 외의 모든 값

- false로 간주되는 값 : 0, null, undefined, NaN, ''(빈문자열);

 

ex)

const truth = true;
const lie = false;

 

 

 

4. 빈값(null)

 

변수에 null을 할당하면 해당 변수는 명확하게 비어있는 empty값이라고 지정해준다.

null을 할당한다는 것은 의도적으로 '비어있는 값'을 넣었다는 것이다.

 

ex)

let empty = null;
console.log(`${empty}, ${typeof empty}`); // => null, object

* typeof로 null값이 할당된 empty의 타입을 확인해보면 object로 나온다.

null은 분명히 primitive type이라고 했는데 왜 object로 나올까?

그것은 자바스크립트의 초기 버그이기 때문인데 이 버그를 아직까지 고치지 않는 이유는 지금까지 기존에 쓰여진 코드가 많기 때문에 이것이 수정되면 좋지 않은 영향을 미칠 수 있기 때문이라고 한다.

null인지 타입을 확인하려면 일치연산자 ===를 사용하면 된다.

ex) empty === null; // => true

 

 

 

5. 빈값(undefined)

 

변수 선언은 이루어졌지만 할당된 값이 없는 상태이다.

null은 비어있는 값이라고 정한 것이지만 undefined는 비어있는지 아닌지 정해지지 않았다는 것이다.

undefined라고 값을 할당한 것과 아무 값을 할당하지 않은 것 모두 undefined이다.

 

ex)

let a;
console.log(); // => undefiend

 

 

 

6. 심볼(symbol)

 

심볼은 맵이나 다른식별자에서 유일한 식별자가 필요할 때, 동시다발적으로 일어날 수 있는 코드에서 우선순위를 주고 싶을 때, 고유한 식별자가 필요할 때 사용한다.

object의 property로도 사용할 수 있다.

예를 들어 회사에서 프로젝트 협업을 하고 있는 상황이라고 생각해보자.

내가 만든 한 object에 age라는 property가 있다.

다른 팀원이 age라는 property가 이미 존재하는지 모르고 같은 object에 age property를 또 만든다면 오류가 나고 문제가 생길 수 있다.

이때 age라는 property를 보호하고 싶다면 Symbol()을 사용해 하나의 symbol로 만들면 같은 age라는 property를 중복으로 만든다고 하더라도 다른 property로 간주하기 때문에 코드 충돌을 방지할 수 있다.

 

 

1. 심볼은 Symbol( ); 함수를 사용하여 만들 수 있다.

2. 심볼을 만들 때 해당 심볼에 대한 Symbol("이름") 심볼 이름(설명)를 붙일 수도 있다.

   이 심볼 이름은 어떤 것에도 영향을 주지 않는 이름표 역할만을 한다.

   여러개의 심볼 변수들이 할당받은 심볼 이름이 같다고 하더라도 심볼값은 다르다는 말이다.

=> 다시 말해서, 심볼은 여러개의 symbol이 동일한 값이라고 하더라도 각각의 symbol은 다른 식별자로 간주된다.

하지만 식별자를 symbol이 아닌 string을 이용해서 만들 경우에 string은 같은 string을 쓰면 동일한 식별자로 간주한다.

3. 심볼은 문자형으로 자동형 변환이 되지 않는다.

   심볼을 출력할 때 심볼을 바로 출력하면 에러가 발생할 수 있다.

   심볼이름을 출력하고 싶다면 .description을 이용하여 출력해야 한다.

 

 

ex)

// 1.
const symbol_1 = Symbol(); // symbol_1은 심볼값이 됨

// 2.
const symbol_2 = Symbol("example"); // symbol_2는 심볼이 되고, symbol_2를 설명하는 내용(이름표)는 example
const symbol_3 = Symbol("example"); // symbol_3도 심볼이 되고, symbol_2와 같은 이름표를 가지고 있음

console.log(symbol_2 == symbol_3);
// symbol_2와 symbol_3이 같은지 확인, 출력결과는 false => 심볼 이름은 같지만 값은 다름

const symbol_4 = Symbol.for("stringEx"); // 주어진 string(stringEx)에 맞는 심볼을 만듦
const symbol_5 = Symbol.for("stringEx"); // symbol_4와 같은 string으로 심볼을 만듦
console.log(symbol_4 == symbol_5); // => 출력결과: symbol_4와 symbol_4는 같은가? true
// (string으로 심볼을 만들었기 때문에 같은 값을 넣으면 같은 심볼로 인식함)

// 3.
console.log(symbol_2.decription); // => 출력결과: example