자료형
자바스크립트 언어에 존재하는 값.
값(value)은 프로그램이 조작할 수 있는 데이터를 의미한다.
값에는 여러가지 종류가 있으며 이런 값의 종류를 자료형(Data Type)이라고 한다.
- 숫자 기본(parseInt, NaN)
숫자는 따옴표로 감싸지 않고 그대로 적으면 된다. 따옴표로 감싼 숫자는 문자열로 인식한다.
3
-4
0.5
5e4
50000
//5뒤에 0이 4개
이전에 console.log 를 실행할 때 < undefined 가 콘솔에 출력됐지만 이번에는 "Hello, world"가 출력된다.
< 뒤에 나오는 값은 콘솔에 입력한 명령의 값이다. 문자열을 입력했기 때문에 그 값이 그대로 출력된다.
이렇게 결과값이 나오는 명령을 식(또는 표현식 expression)이라고 한다.
- typeof
내가 입력한 값의 타입이 궁금할 때 typeof로 확인한다.
- NaN
NaN(Not a Number) 라고 하지만 number 라고 한다. 공식적으로 숫자라고 한다.
- parseInt 문자열을 숫자로 바꾸기
parseInt는 문자열을 정수로만 바꾼다. 정수가 아닌 값을 입력하면 정수 부분만 추출한다.
- parseFloat
문자열을 소수로 바꿀 때는 parseFloat을 한다.
- Number
Number는 문자열을 소수, 정수로 모두 바꿀 수 있다.
- parseInt 와 Number 의 차이점
parseInt 는 문자열에서 숫자만 추출하지만 Number는 문자와 숫자가 같이 있을 때 숫자만 추출하지 못하고 NaN이 출력된다.
- .substr
substr(0,2) : 문자열을 앞에서 2개를 자르겠다.
- prompt()
문자를 직접 값으로 입력할 수 있는 창이 뜬다.
- parseInt(prompt())
직접 입력한 값을 숫자로 변경한다.
- type of parseInt(prompt())
값의 자료형을 알려준다.
- 산술 연산자 사용하기
더하기( + ), 빼기( - ), 곱하기( * ), 나누기( / )등의 부호를 사용한다.
추가로 나눗셈의 나머지를 구하는 모듈러스(modulus)연산자 %와 거듭제곱 **도 있다.
- Infinity 무한 값 알아보기
숫자를 0으로 나누면 어떻게 될까? 수학에서는 0으로 나누기가 성립하지 않지만 자바스크립트는 어떻게 될까?
Infinity 라는 새로운 값이 나온다. 자바스크립트에서는 무한이라는 수를 표현하는 Infinity 값이 존재한다.
Infinity 값은 음수로도 존재한다. 음수를 0으로 나누면 된다.
단, 무한한 값끼리 계산할 떄는 다르다.
결괏값으로 NaN이 나왔다. 무한에서 무한을 빼는 것은 성립하지 않기 때문이다.
NaN이 나오는 경우는 0 을 0으로 나눌 때이다.
Infinity 값은 자주 쓰이지 않지만 , 무한이라는 개념을 프로그래밍에서 사용할 수 있으니 기억해두자!
- 문자와 숫자 더하기
+ 연산자가 문자열끼리 더할 때도 사용되고, 숫자끼리 더할 때도 사용된다는 것을 배웠다.
문자열과 숫자를 더하면 어떻게 될까?
"문자열 0"으로 문자열과 숫자가 하나로 합쳐진다. 문자열과 다른 자료형을 더하게 되면 다른 자료형이 문자열로 바뀐 후 문자열과 더해진다. 이처럼 값의 자료형이 바뀌는 현상 또는 바뀌는 행위를 형 변환(type casting)이라고 한다.
문자열 1과 숫자 0을 더하면 숫자 1이 아니라 문자열 10이 나온다.
숫자와 문자열을 더했기 때문에 숫자 0이 문자열 0으로 형변환 된 후, 문자열 1과 합쳐져 문자열 10이 된다.
더하기를 할 때는 숫자보다 문자열 자료형이 우선시 된다고 기억하자.
이번에는 문자열에서 숫자를 빼보자.
연산자를 사용할 때는 다른 자료형이 먼저 숫자로 형변환된 후 빼기를 하게 된다.
앞의 경우에는 문자열을 숫자로 바꾸면 NaN이 되고, 여기서 0을 빼봤자 그대로 NaN이므로 NaN이 나온다.
이번에는 결괏값이 숫자로 나온다. 문자열 9는 숫자 9로 형변환되고, 여기서 5를 빼기 때문에 결괏값이 4가 나온다.
- 숫자로 형 변환하기
문자열에서 숫자로 형 변환할 때, 변환한 뒤의 값을 예측하기 위해서는 parse를 실행한 후 결과를 생각한다.
'☭DEVELOPER > #4 자바스크립트' 카테고리의 다른 글
자바스크립트 | 레츠기릿 자바스크립트 8 (2) | 2024.01.09 |
---|---|
자바스크립트 | 레츠기릿 자바스크립트 7 (0) | 2024.01.09 |
자바스크립트 | 레츠기릿 자바스크립트 5 (0) | 2024.01.05 |
자바스크립트 | 레츠기릿 자바스크립트 4 (0) | 2024.01.05 |
자바스크립트 | 레츠기릿 자바스크립트 3 (0) | 2023.12.20 |