본문 바로가기
Front-End/자바스크립트 (JavaScript)

[JavaScript] 변수와 타입(Type)

by MS_developer 2022. 8. 22.

변수(Variable)란?

모든 사물에는 우리가 부르기로 '약속'한 이름이 있다. 컴퓨터 또한 시스템 안에 데이터를 저장할 때 이를 부르기 위한 이름을 지어줘야 하는데, 이를 변수라고 한다.


변수가 왜 필요할까?

만약 누군가 '사과'가 필요한데 이름이 생각나지 않았다고 생각해보자. 만약 그 사람이 지나가던 때마침 친구에게 '그거 좀 갖다 줘'라고 말한다면, 우린 '사과'를 가져다 줄 수 있을까?

일반적으로 '그게 뭔데?'라고 되물을 것이다.

이처럼 컴퓨터에게도 데이터를 저장하고 필요할 때마다 해당 데이터를 불러오기 위해서는 더 명확한 지칭이 필요한데, 이역할을 변수가 해주는 것이다. 그렇다면 어떻게 변수라는 '이름'을 지어줄까?


변수의 선언과 할당

변수를 만들기 위해선 두 가지 단계로 나뉜다.

먼저 데이터를 저장할 공간의 확보를 위한 선언(Declaration)과 그곳에 데이터를 집어넣는 할당(Assignment)가 있다. 선언이란 변수의 이름을 정하고 앞으로 그렇게 부르기로 약속하는 것을 말하고, 할당은 해당하는 이름 안에 원하는 데이터 값을 넣는 단계를 뜻한다.

 

변수의 선언과 할당

 

 

위의 코드처럼 변수에 "a"라는 이름을 지어주는 것을 선언이라 하고, a라는 이름의 변수에 10이라는 값을 지정해주는 걸 할당이라고 한다. 하지만 위의 예시 코드를 보고 있으면 '그냥 선언과 할당을 한번에 하면 안되나?'라는 의문이 든다. 변수는 선언과 할당을 동시에 할 수 있다. 이를 위해서는 앞서 변수의 선언에 사용된 문장과 할당에 사용된 문장을 비교해보면 "a"가 중복되어 사용된 것을 알 수 있다. 

변수의 선언과 할당을 동시에

위의 코드처럼 변수를 선언함과 동시에 저장하고자 하는 값을 할당하면 된다. 그렇다면 a라는 변수에 저장되는 값들이 숫자인지 글자인지 컴퓨터는 어떻게 구분할까?


타입(Type)이란?

앞서 변수를 선언하기 위해선 데이터의 "타입"을 지정해줘야 했다. 그렇다면 타입은 무엇일까? 타입은 데이터 보관을 위한 변수 선언에 있어 저장하고자 하는 데이터 '값(Value)'의 유형을 구분하기 위한 '열쇠들(keys)'을 타입이라 한다.


왜 각기 다른 타입이 필요할까?

예시를 들어보자.

컴퓨터 시스템은 모든 데이터 값을 이진법으로 치환해서 저장한다. 그런데 우리가 데이터 유형을 정하지 않은 채 숫자 {100}과 글자 {'백'}을 데이터 공간에 저장했다고 가정해보자. 컴퓨터가 해당 값들을 이진법으로 치환했을 때 그 저장값이 {11001010}과 {11001010}이라면, 어떤 것이 숫자고 글자인지 명확히 구분할 수 있을까?

뭐가 다르다구요?

주어진 예시에서 우리는 색을 통해 그 대상이 다름을 보다 쉽게 인식할 수 있지만, 컴퓨터는 색을 구분하지 않는다. 

인간이 '숫자(number)'와 '글자(string)'를 구분할 때 다르게 인식하듯, 컴퓨터 시스템도 지정된 값을 다르게 인식하기 위해서는 적절한 가이드가 제공되어야 한다. 그리고 컴퓨터가 데이터를 구분하고 분류하는데 있어 필요한 가이드가 바로 "타입"이다.


타입의 종류

데이터를 저장하는 타입은 여러가지가 있지만 대표적으로

  1. 숫자 (Number)
  2. 문자열(String)
  3. 참.거짓(Boolean)
  4. 배열 (Array)
  5. 객체 (Object)
  6. 함수 (Function)

등 으로 구분할 수 있다. 또한 데이터를 할당(보관함에 저장)하지 않았을 때 기본값으로 설정되는 'undefined'도 하나의 타입이자 값으로 볼 수 있다. 


typeof 연산자

그렇다면 컴퓨터가 저장한 값을 인간이 다시 분류하려면 어떻게 해야될까? 

typeof 연산자를 사용하면 된다. typeof 연산자는 숫자라면 Number, 문자열이라면 String 등 뒤에 따라오는 변수의 유형이 무엇인지 알려준다. 자바스크립트에서 typeof 연산자를 활용하는 방법은 다음과 같다.

  1. 변수의 선언 및 할당
  2. typeof 할당된 변수

간단한게 개발자 도구(Dev Tool)를 통해 확인 가능하다

 

댓글