오늘의 키워드📌

---

• 자바스크립트 변수와 데이터 타입(자료형)
• 데이터 타입 확인하기

1. 변수

---

1-1. 변수 ?

변수는 변할 수 있는 수, 변할 수 있는 정보라는 뜻이다. 프로그램을 만드는데 필요한 숫자나 문자와 같은 데이터를 보관할 공간이 필요한데, 물건을 잠시 보관하는 상자 같은 역할을 하는것이 변수다.

변수는 선언하고 할당하고 사용할 수 있다. 또한 변수는 변할 수 있는 수이므로 지정된 값을 계속 바꿀 수도 있다.

즉, 변수는 값의 위치(주소)를 기억하는 저장소이다. 이때 값의 위치란 값이 위치하고 있는 메모리 상의 주소(address)를 의미한다.

변수란 값이 위치하고 있는 메모리 주소(Memory address)에 접근하기 위해 사람이 이해할 수 있는 언어로 명명한 식별자(identifier)이다. 식별자는 어떤 대상을 유일하게 식별할수 있는 이름을 말한다. 식별자에는 변수명, 함수명, 프로퍼티명, 클래스명 등이 있다.

변수는 var let const 키워드를 사용하여 선언하고 할당 연산자를 사용해 값을 할당한다. 그리고 식별자인 변수명을 사용해 변수에 저장된 값을 참조한다.

1-2. 변수명을 정할 때

• 변수 이름은 $, _ 를 제외한 공백, 특수문자, 구두점을 사용할 수 없다.
• 첫 글자는 숫자가 될 수 없다.
• 대소문자를 구별한다.
• 예약어가 쓰일 수 없다.
• 유니코드 문자도 사용할 수 있다.
• var, let, const의 키워드를 사용할 수 있다.

2. 데이터 타입(자료형)

---

2-1. 데이터 타입?

변수는 메모리 주소에 접근하기 위해 명명한 식별자라고 했다. 메모리에 값을 저장하기 위해서는 먼저 메모리 공간을 확보해야 할 메모리의 크기(byte)를 알아야 하는데, 이는 값의 종류에 따라 확보해야 할 메모리의 크기가 다르기 때문이다.

이때 값의 종류, 즉 데이터의 종류를 데이터 타입(자료형)이라 한다.

그리고 데이터 타입은 프로그래밍 언어에서 사용할 수 있는 데이터(숫자, 문자열, 불리언 등)의 종류를 말한다.

2-2. 원시 타입과 객체 타입

• 원시 타입(primitive data type)

  • boolean
  • null
  • undefined
  • number
  • string
  • symbol (ES6에서 추가)

• 객체 타입(object/reference type)

  • object

예를 들어서 숫자(number) 타입 1과 문자열(string) 타입 '1'은 비슷하게 보이지만 다른 타입의 값이다. 숫자 타입의 값은 주로 산술 연산을 위해 만들지만 문자열 타입의 값은 주로 텍스트로 출력하기 위해 만든다.

이처럼 개발자는 명확한 의도를 가지고 타입을 구별하여 값을 만들 것이고 자바스크립트 엔진은 타입을 구별하여 값을 취급할 것이다.

자바스크립트에서 제공하는 7개의 데이터 타입은 크게 원시타입과 객체 타입으로 구분할 수 있겠다.

3. 데이터 타입 확인하기

---

typeof 연산자는 피연산자의 평가 전 자료형을 나타내는 문자열을 반환한다.

• undefined : 변수가 정의되지 않거나 값이 없을 때
• number : 데이터 타입이 수일 때
• string : 데이터 타입이 문자열일 때
• boolean : 데이터 타입이 불리언일 때
• object : 데이터 타입이 함수, 배열 등 객체일 때
• function : 변수의 값이 함수일 때
• symbol : 데이터 타입이 심볼일 때

3-1. typeof 사용

console.log(typeof 'Hello world!')
console.log(typeof 123)
console.log(typeof true)
console.log(typeof undifined)
console.log(typeof null)
console.log(typeof {})
console.log(typeof [])

결과 화면

console.log(typeof null)
console.log(typeof {})
console.log(typeof [])

null, {}, [] 데이터 타입들은 object로 반환되었는데 함수를 생성해서 명확한 데이터 타입을 확인해 보자.

3-2. getType 함수 생성

function getType(data) {
  return Object.prototype.toString.call(data).slice(8, -1)
}

console.log(getType(123))
console.log(getType(false))
console.log(getType(null))
console.log(getType({}))
console.log(getType([]))

결과 화면

• null = Null
• {} = Object
• [] = Array

null {} [] 모두 명확한 데이터 타입으로 출력되었다.