[자바스크립트] parseInt 함수 (궁금증 포함..)

맹뿌·2021년 6월 21일
2

자바스크립트

목록 보기
7/8

노마드코더 수업을 들으면서 parseInt라는 형변환 연산자에 대해서 알게 되었다. 실습을 하는 도중에 parseInt에 대해서 헷갈리는 부분이 생겨 정리해두기 위해 이 글을 적는다.

parseInt 란?

자바스크립트에 내장되어 있는 함수로, 말 그대로 문자열을 파싱하여 문자열에 포함된 숫자를 찾아서 number로 형변환을 시켜준다.

let age = parseInt('30');
console.log(age , typeof age);   // 30, number

문자열이 숫자로 시작한다면 숫자만을 리턴해준다.

let str = parseInt('123숫자들');
console.log(str);   // 123

그러나 숫자가 포함된 문자열이라 하더라도 문자로 시작하거나, 아님 숫자를 포함하지 않는 문자열의 경우는 NaN으로 반환된다.

let str = parseInt('숫자들123');
console.log(str);   // NaN


let sing = parseInt('lalala');
console.log(sing);   // NaN

parseInt 예제

const age = prompt("How old are you?");

console.log(age, parseInt(age));

prompt 함수의 경우, 입력 받은 값이 숫자인지 문자인지 상관없이 string 타입으로 입력된다. 따라서 입력받은 값이 숫자일 경우, number로 형 변환을 한 후에 연산을 하는 등의 추가적인 코드 작성에 있어 parseInt 함수는 유용하게 사용된다.

const age = parseInt(prompt("How old are you?"));
console.log(age)

다만 위와 같이 parseInt 함수로 형 변환한 것을 다른 변수에 저장하면 age의 타입은 따로 바꾸지 않는 이상 영구적으로 number가 되는 것 같다.


주의할 점 🚧

const age = prompt("How old are you?");

console.log(age, parseInt(age), age);

형을 변환해준다고 하기에 parseInt(변수)를 사용한 뒤에 변수의 타입을 다시 찍어보면 계속 number로 나올 것이라고 생각했다. 그런데 위 코드를 찍어보니 첫 번째, 세 번째는 string 타입으로, 두 번째는 number 타입으로 찍였다. 따라서 parseInt(변수)를 한 번 사용했다고 해서, 해당 변수의 타입이 number 타입으로 영구적으로 변하는 것은 아닌 것 같다. parseInt 함수를 사용할 때만 임시로 형 변환이 되는 것 같다.


궁금한 점 😢

parseInt 함수는 문자열에 숫자가 없으면 NaN으로 반환하는 것으로 알고 있다. 그런데

const age = prompt("How old are you?");
change = parseInt(age);
console.log(typeof change, typeof age);

위 코드를 실행해서 'aaaa' 등과 같이 숫자를 포함하지 않는 문자열을 입력값으로 주어도 change의 type을 number로 출력해준다.

왜!!! 때문에,, NaN이 아닌 number로 출력되는지 알고 싶다...


혹시나 이 글을 읽고 계신 분들 중에 답을 알고 계시다면,, 댓글 남겨주세요ㅠ_ㅜ
추가적으로 제가 잘못된 정보를 적어두었다면 댓글로 수정 부탁드립니다-

🎁 참조 및 출처

profile
무엇이든 할 수 있고, 무엇이든 될 수 있는

1개의 댓글

comment-user-thumbnail
2022년 8월 4일

저도 parseInt 공부하다가 여기까지 왔네요 ㅎ 답을 찾으셨나요? typeof NaN == 'number'. 입니다. 관련링크 https://stackoverflow.com/questions/60612248/why-does-typeof-evaluate-all-parseint-expressions-as-number 이미 작년 포스팅이라 답을 이미 찾으셨으리라 생각하지만요!

답글 달기