자료와 변수 ① 기본 자료형

이번 글에선 자료와 변수 중 먼저 자료에 대해 알아보자.

 

자료와 자료형

 

프로그램이 처리할 수 있는 모든 것을 자료라고 하고

 

프로그래밍 언어는 자료를 쉽게 다룰 수 있도록 자료를 형태에 따라 구분하여 관리하는데,

이때 자료를 형태에 따라 구분해놓은 것을 자료형이라고 한다.

JavaScript에서는 다양한 자료형을 제공하는데, 특히 숫자, 문자열, 불 자료형이 가장 기본적이다.

숫자 자료형

 

JavaScript에서는 숫자를 입력해 숫자 자료형을 생성한다.

다른 프로그래밍 언어에서 int, float과 같이 소수점이 없는 숫자의 자료형과 소수점이 있는 숫자의 자료형을 구분했던 것과 달리,

JavaScript에서는 소수점이 없는 숫자와 소수점이 있는 숫자를 숫자 자료형 하나로 구분한다.

> 10
10
> 10.23
10.23

숫자 자료형에 사용할 수 있는 연산자는 다음과 같다.

• 더하기 연산자: +
• 빼기 연산자: -
• 곱하기 연산자: *
• 나누기 연산자: /
• 나머지 연산자: %

 

문자열 자료형

 

JavaScript에서는 문자 또는 문자열을 큰따옴표 또는 작은따옴표로 감싸 문자열 자료형을 생성한다.

다른 프로그래밍 언어에서 char, string과 같이 문자 하나의 자료형과 문자열의 자료형을 구분했던 것과 달리,

JavaScript에서는 문자 하나와 문자열을 문자열 자료형 하나로 구분한다.

> '안녕하세요'
"안녕하세요"
> "안녕하세요"
"안녕하세요"

앞서 문자 또는 문자열을 큰따옴표 또는 작은따옴표로 감싸 문자열 자료형을 생성한다고 했다.

그러나 따옴표의 사용에 있어, 문자열 안에 따옴표를 사용해야 하거나 따옴표를 따옴표 문자 그 자체로 사용해야 할 경우가 있을 수 있다.

문자열 안에 따옴표를 사용해야 할 경우,

문자열 내부에 작은따옴표를 사용하고 싶다면 문자열 외부에 큰따옴표를, 문자열 외부에 큰 따옴표를 사용하고 싶다면 문자열 외부에 작은따옴표를 사용하면 된다.

따옴표를 따옴표 문자 그 자체로 사용해야 할 경우,

따옴표 바로 앞에 이스케이프 문자를 붙여 사용하면 된다.

> 'This is "string"'
"This is "string""
> "This is 'string'"
"This is 'string'"

> "This is \"string\""
"This is "string""
> 'This is \'string\''
"This is 'string'"

앞의 두 예제의 결과와 뒤의 두 예제의 결과가 동일해 무슨 차이인가 싶을 수도 있지만, 뒤의 두 예제는 따옴표를 문자열을 표현하기 위함이 아니라 따옴표 문자 그 자체를 표현하기 위해 사용하고 있으므로 앞의 두 예제와 달리 문자열 내부와 문자열 외부에 동일한 따옴표를 사용할 수 있다.

문자열 자료형에 사용할 수 있는 연산자는 다음과 같다.

• 문자열 연결 연산자: +
• 문자 선택 연산자: [ ]

> '안녕' + '하세요'
"안녕하세요"

> '안녕하세요'[0]
"안"
> '안녕하세요'[2]
"하"

 

불 자료형

 

JavaScript에서는 true 또는 false를 입력하거나 비교 연산자와 논리 연산자를 사용해 불 자료형을 생성한다.

불 자료형은 조건문 괄호 안의 불 표현식의 형태로 조건문의 참과 거짓을 결정하는 데에 사용된다.

> true
true
> false
false

> 10 === 10
true
> 10 !== 10
false
> 20 > 10
true
> '가방' > '하마'
false
> 5 < 10 || 10 < 20
true

JavaScript에서의 비교 연산은 두 피연산자를 어떻게 해서라도 같아지도록 만든 후 이루어지기 때문에 일반적인 생각과 다른 결과를 만들어낸다.

> 1 == "1"
true
> false == "0"
true
> "" == []
true
> 0 == []
true

 

JavaScript에서는 위와 같은 경우를 방지하고자 ===, !== 연산자를 사용할 수 있다.

> 1 === "1"
false
> false === "0"
false
> "" === []
false
> 0 === []
false

 

즉, ==, != 연산자는 값을, ===, !== 연산자는 값과 자료형을 비교하는 것이다.

 

불 자료형에 사용할 수 있는 연산자는 다음과 같다.

• 논리 부정 연산자: !
• 논리곱 연산자: &&
• 논리합 연산자: ||

> !true
false
> !false
true

> true && true
true
> true && false
false
> false && true
false
> false && false
false

> true || true
true
> true || false
true
> false || true
true
> false || false
false

 

자료형 검사

 

JavaScript에서는 typeof 연산자를 사용해 특정 자료의 자료형을 검사한다.

typeof 연산자는 typeof(자료) 또는 typeof 자료와 같은 형태로 사용할 수 있으며

JavaScript의 typeof 연산자는 string, number, boolean, undefined, function, object, symbol, bigint를 결과로 출력한다.

> typeof(10)
"number"
> typeof('안녕하세요')
"string"
> typeof(true)
"boolean"

> typeof 10
"number"
> typeof '안녕하세요'
"string"
> typeof true
"boolean"

typeof 연산자는 다음과 같이 특정 자료의 자료형과 문자열을 비교하여 특정 자료의 자료형을 확인하는 형태로 사용되는 경우가 많다.

> typeof(10) === 'number'
true
> typeof 10 === 'number'
true

 

이때 typeof의 피연산자가 10인지, 10 === 'number'인지 명확하게 명시하기 위해 일반적으로 typeof 연산자는 괄호와 함께 사용한다.

 

---

이 글은 혼자 공부하는 자바스크립트 (윤인성 저)를 바탕으로 공부한 내용을 작성한 글입니다.