[자바스크립트]parseInt()와 Number()의 차이

가끔 문자열이나 실수 자료형을 정수형으로 형변환 해야될 때가 있는데 구글링을 하다보면 JavaScript에는 parseInt()로 변환하는 방법과 Number()로 변환하는 방법 두 가지를 발견할 수 있다.
이번에는 두 메서드 간의 차이점을 알아보고 어느 상황에 어느 메서드를 활용해야 하는지 알아보겠다.

1.숫자로만 구성된 문자열 변환

const str = '0001';
parseInt(str); // 1
Number(str); // 1

두 메서드 모두 숫자 1을 반환했다. 그렇다면 '0' 문자열은 어떻게 될까?

const str = '0';
parseInt(str); // 0
Number(str); // 0

둘 다 0을 반환한다.

2. 문자와 숫자가 섞인 문자열 변환

- 2.1 문자로 시작하는 문자열

const str = '제1회';
parseInt(str); // NaN
Number(str); // NaN

둘 다 NaN(Not a Number)로 숫자를 반환하지 않는다.

- 2.2 숫자로 시작하는 문자열

const str = '1000원';
parseInt(str); // 1000
Number(str); // NaN

parseInt()는 숫자가 끝나는 지점까지의 문자를 모두 숫자로 반환해주고 Number()는 문자열이 하나라도 포함되어 있으면 숫자로 반환해주지 않는다.

- 2.3 숫자와 문자가 반복되며 섞인 문자열

const str = '1000원2000원';
parseInt(str); //1000

parseInt()가 문자열 내의 모든 숫자를 반환하지는 않는다.

3. 소수점이 포함된 숫자로 이루어진 문자열 변환

const str = '12.345';
parseInt(str); // 12
Number(str); // 12.345

parseInt()는 메서드 이름 그대로 정수로 반환하고 Number()는 숫자 전체를 반환한다.

4. 실수 자료형을 정수로 변환

const num = 12.345;
parseInt(num); // 12
Number(num); // 12.345
parseFloat(num); // 12.345

문자열이 아닌 숫자도 메서드의 인자로 받을 수 있다.

결론
parseInt()는 인자로 받은 문자열의 첫 글자가 문자가 아니라면 문자가 처음으로 시작하는 지점 전까지의 숫자를 모두 반환하고 소수점 이하는 버리고 정수형으로 반환한다.
Number()는 문자열 내에 문자가 하나라도 있으면 NaN을 반환하고 소수점을 포함한 모든 숫자를 반환한다.