자바스크립트 : 자료형과 변수

프로그래밍을 위해서는 자료형과 변수에 대해 알아두는것이 중요합니다.

이번 글에서는 변수와 자료형이 무엇인지에 대해 알아보도록 하겠습니다.

 

 

 

 

변수

변수란, 데이터를 저장할때 쓰이는 저장소입니다.

자료형 변수명 = 값; 의 형태로 구성됩니다.

자료형이란, 변수에 담기는 데이터의 타입을 말하며

변수명이란, 해당 변수를 지정하기 위한 이름을 말하고

값은 해당 변수에 담긴 데이터를 의미합니다.

 

변수 외에도 데이터를 저장하는데 쓰이는 저장소는 상수가 존재하는데,

구성은 변수와 동일하지만 변수는 값을 변경할수 있지만, 상수는 값을 변경할 수 없습니다.

 

변수의 자료형은 크게 var, let, const 세가지로 존재합니다.

하지만 var의 경우는 호이스팅 문제로 인해 사용을 지양해야하므로 let과 const를 사용합니다.

let 은 변수를 지정할 때 사용합니다.

const 는 상수를 지정할 때 사용합니다. 

이 두 차이점을 생각하고 작성하면 좋습니다.

 

예시코드

const apple = 500;
let banana = 1500;

console.log('바나나 가격이 올랐습니다 (현재가 : ' +banana+')');
banana += 500;
console.log('바나나 : '+banana);

console.log('사과 가격이 올랐습니다? (현재가 : ' +apple+')')
apple+= 500; // const이므로 오류 발생
console.log('사과 : '+apple);

위 코드를 사용시 아래와 같은 출력 화면이 나옵니다.

위와 같이 apple은 상수, const이기 때문에 변경할 수 없으며, 변경시 오류가 발생합니다. 

 

 

 

 

타입

타입이란, 변수내 데이터의 형태를 말합니다.

자바스크립트에서는 크게 원시형 타입과 참조형 타입, 두가지 큰 틀로 나뉩니다.

 

원시 타입 (Primitive type)

원시 타입이란, 객체가 아니며, 메서드, 속성도 가지지 않는 말 그대로 원시적인 타입입니다.

원시 타입은 불변(Immutable)하기 때문에, 해당 값을 변경하는것이 아닌 메모리의 주소를 변경하는 방식으로 해결합니다.

이게 무슨 뜻인지 설명하기 전에 변수의 선언 방식을 간단하게 설명하겠습니다.

 

보통 변수에 값을 정의할때, 데이터를 어떠한 공간에 저장하고, 변수는 해당 공간을 가리킵니다.

이 때, 값이 바뀐다면 두가지 경우로 값을 바꿀 수 있습니다.

값 자체를 변경하거나, 가리키는 공간의 위치를 변경하거나

원시 타입은 가리키는 공간을 변경하여 정의된 값을 변경합니다.

 

예를 들어 5의 값을 변수 number 에 담는다면, a라는 공간에 5를 집어넣고,

변수는 a라는 공간을 가리키게 됩니다.

이때, 5는 원시타입이고, 불변값이기 때문에 변수 number 를 4로 바꾼다 하더라도,

공간 a의 데이터 5는 변경되지 않고,

변수가 가리키는 공간을 데이터 4가 존재하는 공간 b 로 바꾸는 것입니다.

 

마찬가지로, 여러 변수가 5의 값을 가리킨다 하면, 서로 다른 여러개의 공간에 5를 담는게 아닌,

모든 변수가 a를 가리키게 하여 메모리 낭비를 줄이게 됩니다.

1. string
   문자열을 의미합니다.
   따옴표( ' )를 사용하여 값을 표시하며, 백틱( ` )을 사용한 템플릿 문자열을 사용할 수 있습니다.
   데이터 보간은 ${}을 사용합니다.
   

   // 문자는 따옴표를 사용합니다.
   const s1 = "Thomas"
   const s2 = '12'
   
   // 템플릿 문자열은 백틱을 사용하며, ${} 안에 데이터를 보간합니다.
   const s3 = `My name is ${s1}, I'm ${s2} years old`
   
   console.log(s3)

2. number
   Integer, Float, Double, Bignum과 같은 다양한 숫자타입을 의미합니다.
   infinity (무한대)와 같은 전역 변수 또한 number로 취급합니다.
   number 타입의 범위는 매우 큽니다
   최댓값은 2¹⁰²⁴
   최솟값은 -2¹⁰²⁴ 입니다.
   하지만, 안전하게 표시할 수 있는 범위는
   2⁵³-1 부터 -2⁵³-1 로 제한됩니다.
   이 범위 밖의 number는 부동소수점 근사값으로 표시됩니다. 아래 4개의 변수
   Number.MAX_VALUE (최대 양수값)
   Number.MIN_VALUE (최소 양수값)
   Number.MAX_SAFE_INTEGER  (최대 안전 양수값)
   Number.MIN_SAFE_INTEGER (최소 안전 양수값)를 사용하여
   양수범위를 알 수 있으며,
   이보다 더 큰 범위의 숫자는 아래의 bigint를 활용합니다.
   
   
3. bigint
   숫자 표현에 범위 제한이 없는 숫자타입입니다.
   그 외에는 number와 동일합니다.
   
   
4. boolean
   논리형 타입입니다. true(참) 또는 false(거짓) 두가지 값이 존재합니다.
   
   
5. undefined
   정의되지 않은 타입입니다
   null 값과 비슷하지만, 값이 할당되지 않은 데이터, 반환값이 없는 함수 등을 출력할 때
   임시적으로 할당되는 값입니다.
   또한, 명시적으로도 undefined를 지정할 수도 있습니다.
   .
6. symbol
   고유한 값을 지정할 때 사용하는 타입입니다.
   각 개체에 고유한 키를 부여하여 다른 코드와 충돌하지 않을 때 사용합니다.
   같은 값을 키로 사용하더라도, 서로 다른 두 심볼은 같지 않습니다.
   
   
7. null
   존재하지 않는 값, 비워진 값, 알 수 없는 값을 표시할 때 사용합니다.

 

 

 

 

참조타입 (Reference Type)

참조 타입이란, 객체 또는 메서드 등을 참조하는 타입입니다.

mutable 타입으로, 같은 기능의 함수를 넣더라도 서로 개별적으로 작동하며,

값을 변경 시 값 자체가 변경됩니다.

 

1. Object
   객체를 의미하는 타입으로, 중괄호 ( {} ) 로 감싸서 데이터를 표현합니다.
   key-value로 구성되어있으며, key-value로 구성된 데이터 하나를 속성이라고 합니다.
   함수를 포함할 수도 있는데, 이때는 메서드라고 부릅니다.
   점 표기법 ( Object.key ) 또는 대괄호 표기법 ( Object [key] ) 을 사용하여 객체 속성에 접근할 수 있습니다.
   
   
   
2. Function
   함수를 의미하는 타입으로, javascript에서는 데이터로 취급할 수 있습니다.
   함수를 선언하거나, 변수에 함수를 지정하여(함수 표현식) 사용할 수 있습니다.
   출력 시 함수명 뒤에 소괄호( () )를 포함해야 반환값이 출력되며,
   소괄호가 없을 경우 함수 데이터 자체가 출력됩니다.
   
   
3. Array
   여러 데이터가 연결된 배열을 의미하는 타입입니다.
   대괄호( [] ) 로 감싸서 데이터를 표현합니다.
   length로 길이를 확인할 수 있고,
   index를 지정하여 특정 위치 데이터를 확인 가능합니다.
   이때, index는 0부터 시작합니다.